Tailwind CSS Toggle Group Components

Dev Design Library indexes 49 Tailwind CSS toggle group components from 24 open-source UI libraries, with the most coming from ReUI, React Spectrum, Shadcn Space, SpaceUI and Intent UI. Each one links to its page with the source code, a live preview where available, the library license and the install command. Every library in this list styles its components with Tailwind CSS utility classes. Toggle group components belong to the Inputs group.

• Toggle Groupshadcn/ui · ReactA set of two-state buttons that can be toggled on or off.
• Toggle Button GroupHeroUI · ReactGroups multiple ToggleButtons into a unified control, allowing users to select one or multiple options.
• Toggle Button GroupReact Spectrum · ReactA ToggleButtonGroup is a grouping of related ToggleButtons, with single or multiple selection.
• Toggle Groupcoss ui · ReactProvides a shared state to a series of toggle buttons.
• Toggle GroupOrigin UI · ReactProvides a shared state to a series of toggle buttons.
• Halo Toggle GroupCult UI · ReactSegmented single-select control with frosted track, gradient rim, and spring-driven sliding thumb (aligned with Halo…
• Basic toggle group.ReUI · ReactBasic toggle group.
• tag-groupIntent UI · Reacttag-group
• Toggle GroupVengeance UI · React
• Toggle GroupToolcraft · React
• Toggle Group 01 - Animated Formatting ToolbarShadcn Space · ReactA premium animated view switcher and styling toolbar utilizing Radix UI Toggle Group and Framer Motion spring sliding…
• Toggle GroupShadcn Dashboard · React
• Toggle GroupObsidianUI · React
• Toggle GroupShark UI · ReactToggle buttons for selecting a value.
• Toggle GroupWatermelon UI · React
• Glass Toggle Groupglasscn · ReactA segmented control with a sliding glass puck indicator supporting icons, text, or any React content.
• Toggle groupHextaUI · ReactA row of toggles for one choice or many, with a fill that slides to the picked item, joined or spaced items and…
• Toggle GroupCojeev UI · ReactGroups pressable choices that can allow one or several selected values.
• Mini Editor Group Togglesv-particles · Svelte
• Interest PickerSpaceUI · ReactA draggable row-packed interest picker with an emoji burst on select and a shake-to-explode clear action.
• Toggle Button GroupOUI · ReactReact aria components Toggle Button Group with shadcn characteristics.
• Toggle GroupD2Studio UI · ReactA set of two-state buttons that can be toggled on or off.
• ToolbarReactFrame · ReactAn accessible toolbar of icon buttons, toggles, radio-style toggle groups and separators with roving-focus arrow-key…
• Toggle Groupark-cn · ReactA shadcn-style toggle group component built with Ark UI primitives.
• Tailwind Toggle Button GroupReact Spectrum · React
• Toggle group for color themeReUI · ReactToggle group for color theme
• toggle-groupIntent UI · Reacttoggle-group
• Toggle Group 03 - Variants & SizesShadcn Space · ReactSingle and multiple selection toggle groups in default and outline variants, attached and spaced, small and large, and…
• Toggle GroupSpaceUI · ReactGroups multiple toggleable buttons together so users can select single or multiple options, ideal for text styling…
• Tailwind ToolbarReact Spectrum · React
• Toggle group for font sizeReUI · ReactToggle group for font size
• Toggle Group 04 - View SwitcherShadcn Space · ReactGrid, list, and board view switcher that always keeps one view selected and re-lays out a project list.
• Vanilla Toggle Button GroupReact Spectrum · React
• Toggle group for time range filterReUI · ReactToggle group for time range filter
• Toggle Group 06 - Chart Time RangeShadcn Space · ReactAnalytics card with a 24h, 7d, 30d, and 90d time range toggle that updates the total, trend, and bar chart.
• Vanilla ToolbarReact Spectrum · React
• Toggle group for notification channelsReUI · ReactToggle group for notification channels
• Toggle Group 07 - Product OptionsShadcn Space · ReactProduct variant picker with color swatch and size toggle groups, sold out sizes, low stock messages, and an add to…
• Toggle group for layout columnsReUI · ReactToggle group for layout columns
• Toggle group for sort directionReUI · ReactToggle group for sort direction
• Toggle group for pricing tierReUI · ReactToggle group for pricing tier
• Toggle group with outline variant.ReUI · ReactToggle group with outline variant.
• Toggle groups in different sizes.ReUI · ReactToggle groups in different sizes.
• Toggle group with custom spacing.ReUI · ReactToggle group with custom spacing.
• Toggle group with filter control.ReUI · ReactToggle group with filter control.
• Toggle group with vertical orientation.ReUI · ReactToggle group with vertical orientation.
• Toggle group for text alignmentReUI · ReactToggle group for text alignment
• Toggle group for view mode switchingReUI · ReactToggle group for view mode switching
• Vertical toggle group for settingsReUI · ReactVertical toggle group for settings

Libraries with Tailwind CSS toggle group components

• ReUI
• React Spectrum
• Shadcn Space
• SpaceUI
• Intent UI

Related categories

• Toggle Group Components
• React Toggle Group Components
• Animated Toggle Group Components
• shadcn/ui Toggle Group Components
• Tailwind CSS Input Components
• Tailwind CSS Text Input Components
• Tailwind CSS Select Components
• Tailwind CSS Form Field Components
• Tailwind CSS Form Components
• Tailwind CSS Textarea Components
• Tailwind CSS Checkbox Components
• Tailwind CSS Switch Components
• Tailwind CSS Slider Components
• Tailwind CSS Radio Components
• Tailwind CSS Combobox Components
• Tailwind CSS File Upload Components
• Tailwind CSS Search Input Components
• Tailwind CSS Date Picker Components
• Tailwind CSS Login Form Components
• Tailwind CSS Color Picker Components