Toggle

Free + Pro

Enhanced two-state button component with smooth animations, multiple variants, and improved accessibility. Perfect for toggling options, settings, and formatting tools.

Unlock Advanced Toggle Features

Get access to powerful pro features that enhance your toggle component with advanced capabilities, premium styling options, and optimized performance.

9 color variants including gradient
6 size options (xs to xl)
4 shape variants

Pro Features

Unlock advanced capabilities with the Pro version

9 Color Variants

Primary, secondary, success, warning, danger, and gradient options

6 Size Options

From extra small to extra large for any use case

4 Shape Variants

Default, square, rounded, and pill shapes

Loading States

Built-in loading spinner for async operations

Badge Support

Display counts or labels with customizable badges

Dynamic Icons

Switch between icons based on toggle state

Installation

Install via CLI

moonui add toggle

Usage

Basic Usage

Pro Required

Pro Usage

PRO

Pro Required

Examples

Basic Toggle

Simple toggle with icon

Sizes

Different toggle sizes

Variants

Different visual styles

Controlled

Controlled toggle with state

Not pressed

Audio Toggle

Toggle with dynamic icons

Audio is unmuted

Formatting Toolbar

Multiple toggles for text formatting

PRO

Pro Examples

Color Variants

PRO

Multiple color options for different use cases

Pro Required

Size Variants

PRO

Six size options from XS to XL

Pro Required

Shape & Badge

PRO

Different shapes with badge support

Pro Required

Icons & Loading

PRO

Dynamic icons with loading states

Pro Required