• Design systems
  • Components
  1. Components
  2. Number input

Number input component examples

Number inputs handle quantities, limits and formatting while keeping keyboard entry quick.

Also known as Number field

Open Number Input source example
Number Input from Chakra UI

Number Input

Chakra UI
Open Number Input source example
Number Input from Duet Design System

Number Input

Duet Design System
Open Number Input source example
Number Input from Flowbite

Number Input

Flowbite
Open Number Input source example
Number Input from HeroUI

Number Input

HeroUI
Open Number input source example
Number input from PatternFly

Number input

PatternFly
Open Number Input source example
Number Input from Shoelace

Number Input

Shoelace
Open Number input source example
Number input from Solar

Number input

Solar
Open Number input source example
Number input from WDN Design System

Number input

WDN Design System

Related categories

Explore adjacent component patterns.

Email address

name@example.com

Text input

Input, Input field, Text field, text fields, Textinput

Slider

Range slider, Range input, Range

Name

Ada Lovelace

Email

ada@example.com
Submit

Form

Form layout

Email address

name@example.com

Label

Form label, Helper text, Hint, help text

Public design systems, component patterns, and the source material behind them.

Design systems

  • All design systems
  • Recommended picks
  • Submit a design system

Industries

  • Government
  • Finance
  • Travel
  • Retail
  • Healthcare
  • Communications
  • Media
  • Education
  • Technology

Components

  • UI component examples
  • Actions
  • Forms and input
  • Navigation
  • Feedback and status
  • Data display
  • Content and media
  • Layout and structure
  • Overlays
  • AI and conversation
Attributions

© 2026 designsystem.gallery