Skip to content

Tag: toggle

Components tagged with "toggle".

9 component(s)

Icon Buttons with Ripple – Pure CSS icon buttons preview

Icon Buttons with Ripple

Round icon buttons with a Material-style ripple, toggle states and tooltips: standard, filled, tonal and outlined variants in three sizes.

Day/Night Toggle – Pure CSS toggles & switches preview

Day/Night Toggle

Animated pure CSS day and night toggle switch where the sun turns into a cratered moon, clouds drift away and stars appear.

iOS Style Toggle Switch – Pure CSS toggles & switches preview

iOS Style Toggle Switch

Pure CSS iOS style toggle switches built on real checkboxes, in a grouped settings list with three sizes, five colors and a disabled state.

Pricing Cards with Billing Toggle – Bootstrap 5 pricing tables preview

Pricing Cards with Billing Toggle

Bootstrap 5 pricing cards with a Monthly / Annual segmented switch that updates prices, savings and yearly totals, plus a highlighted featured plan.

Custom Checkboxes and Switches – Bootstrap 5 checkboxes & radios preview

Custom Checkboxes and Switches

Restyled Bootstrap 5 checkboxes, large switches, select-all with indeterminate state, radio cards and colored checkbox chips.

Light/Dark Theme Toggle – Tailwind CSS theme toggles preview

Light/Dark Theme Toggle

Tailwind CSS dark mode toggle with an animated sun/moon switch that follows the system preference, remembers the choice and can reset to system.

Segmented Control – Tailwind CSS button groups preview

Segmented Control

Tailwind CSS segmented control with a sliding thumb, built on native radio inputs for single-choice view, range and billing toggles.

Plus/Minus Accordion – Tailwind CSS accordions preview

Plus/Minus Accordion

Tailwind CSS accordion with a rotating plus/minus icon, smooth height animation, keyboard navigation and a switch for single-open or multi-open mode.