# Form Control components

> Browse 8 Form Control components for React, styled with Tailwind CSS and ready for your Next.js project.

200 components available. Showing the first 60 — browse the rest at https://21st.dev/community/components/s/form-control.

- [Label](https://21st.dev/@shadcn/components/label.md) — by shadcn
- [Input](https://21st.dev/@originui/components/input/required-input.md) — by Origin UI
- [Calendar \[React Day Picker\]](https://21st.dev/@originui/components/calendar/date-picker.md) — by Origin UI
- [Slider](https://21st.dev/@originui/components/slider.md) — by Origin UI
- [Slider](https://21st.dev/@originui/components/slider/slider-with-ticks.md) — by Origin UI
- [Slider](https://21st.dev/@originui/components/slider/vertical-slider.md) — by Origin UI
- [Slider](https://21st.dev/@originui/components/slider/slider-with-tiny-thumb.md) — by Origin UI
- [Slider](https://21st.dev/@originui/components/slider/slider-with-output.md) — by Origin UI
- [Slider](https://21st.dev/@originui/components/slider/slider-with-input.md) — by Origin UI
- [Slider](https://21st.dev/@originui/components/slider/slider-with-square-thumb.md) — by Origin UI
- [Slider](https://21st.dev/@originui/components/slider/slider-with-reference-labels.md) — by Origin UI
- [Slider](https://21st.dev/@originui/components/slider/slider-with-solid-thumb.md) — by Origin UI
- [Slider](https://21st.dev/@originui/components/slider/slider-with-multiple-thumbs.md) — by Origin UI
- [Slider](https://21st.dev/@originui/components/slider/slider-with-labels.md) — by Origin UI
- [Slider](https://21st.dev/@originui/components/slider/disabled-slider.md) — by Origin UI
- [Checkbox](https://21st.dev/@shadcn/components/checkbox.md) — by shadcn
- [Switch](https://21st.dev/@shadcn/components/switch.md) — by shadcn
- [Calendar](https://21st.dev/@shugar/components/calendar/min-and-max-dates.md) — by tigran tumasov
- [Radio Group](https://21st.dev/@originui/components/radio-group/theme.md) — by Origin UI
- [Radio Group](https://21st.dev/@originui/components/radio-group.md) — by Origin UI
- [Radio Group](https://21st.dev/@originui/components/radio-group/color-picker.md) — by Origin UI
- [Radio Group](https://21st.dev/@originui/components/radio-group/rating-with-emoji.md) — by Origin UI
- [Radio Group](https://21st.dev/@originui/components/radio-group/with-rounded-icon.md) — by Origin UI
- [Radio Group](https://21st.dev/@originui/components/radio-group/grid-based-no-check.md) — by Origin UI
- [Radio Group](https://21st.dev/@originui/components/radio-group/with-a-label-and-a-description.md) — by Origin UI
- [Radio Group](https://21st.dev/@originui/components/radio-group/disabled.md) — by Origin UI
- [Bouncy Toggle](https://21st.dev/@jatin-yadav05/components/bouncy-toggle.md) — by Jatin Yadav
- [Radio Group Card](https://21st.dev/@ruixen.ui/components/radio-group-card.md) — by Ruixen UI
- [Animated Check Box](https://21st.dev/@ringlabs/components/animated-check-box.md) — by ring labs
- [Switch \[react-aria-components\]](https://21st.dev/@jolbol1/components/switch.md) — by James Shopland
- [Color Picker](https://21st.dev/@uplusion23/components/color-picker.md) — by Trevor McIntire
- [Switch](https://21st.dev/@jshguo/components/interfaces-switch.md) — by jshguo
- [Checkbox](https://21st.dev/@originui/components/checkbox/terms-of-service-checkbox.md) — by Origin UI
- [Checkbox](https://21st.dev/@originui/components/checkbox/fancy-todo-checkbox.md) — by Origin UI
- [Checkbox](https://21st.dev/@berlix/components/checkbox.md) — by Berlix UI
- [Checkbox](https://21st.dev/@originui/components/checkbox/with-expansion.md) — by Origin UI
- [Checkbox](https://21st.dev/@originui/components/checkbox/vertical-group-of-checkboxes.md) — by Origin UI
- [Checkbox](https://21st.dev/@originui/components/checkbox/with-a-label-and-a-description.md) — by Origin UI
- [Checkbox](https://21st.dev/@originui/components/checkbox/colored-checkbox.md) — by Origin UI
- [Checkbox](https://21st.dev/@originui/components/checkbox/group-of-checkboxes.md) — by Origin UI
- [Checkbox](https://21st.dev/@originui/components/checkbox/with-a-label-and-a-description-1.md) — by Origin UI
- [Checkbox](https://21st.dev/@originui/components/checkbox/right-aligned-checkbox.md) — by Origin UI
- [Color Picker](https://21st.dev/@haydenbleasel/components/color-picker.md) — by Hayden Bleasel
- [Radio Group](https://21st.dev/@shadcn/components/radio-group.md) — by shadcn
- [Custom Checkbox](https://21st.dev/@Edil-ozi/components/custom-checkbox.md) — by Edil Ozi
- [Switch](https://21st.dev/@shugar/components/switch/icon.md) — by tigran tumasov
- [Switch](https://21st.dev/@shugar/components/switch.md) — by tigran tumasov
- [Select](https://21st.dev/@sean0205/components/select/custom-indicator.md) — by Sean Hello
- [Select (Native)](https://21st.dev/@originui/components/select-native/required-select-native.md) — by Origin UI
- [Select (Native)](https://21st.dev/@originui/components/select-native/select-with-colored-border-native.md) — by Origin UI
- [Select](https://21st.dev/@sean0205/components/select/group.md) — by Sean Hello
- [Select](https://21st.dev/@sean0205/components/select/size.md) — by Sean Hello
- [Select](https://21st.dev/@sean0205/components/select/disabled.md) — by Sean Hello
- [Label](https://21st.dev/@originui/components/label.md) — by Origin UI
- [Switch](https://21st.dev/@shugar/components/switch/full-width.md) — by tigran tumasov
- [Switch](https://21st.dev/@shugar/components/switch/sizes.md) — by tigran tumasov
- [Switch](https://21st.dev/@shugar/components/switch/disabled.md) — by tigran tumasov
- [Checkbox](https://21st.dev/@sean0205/components/checkbox.md) — by Sean Hello
- [Field Components](https://21st.dev/@anubra266/components/field-components/inset-label-input.md) — by Abraham
- [Choicebox](https://21st.dev/@shugar/components/choicebox-1/disabled.md) — by tigran tumasov

Full component directory: https://21st.dev/llms.txt