⚠️ Mobile is not supported yet.
Search for a command to run...
Agent-native design system for the shadcn CLI: 51 base components with a full variant, tone and size matrix on an OKLCH token layer, plus 307 styled variations. MIT.
Two-state toggle button on radix-ui with 2 variants (default, outline), 3 sizes and 2 tones (neutral, brand). Pressed state uses the accent token (neutral) or brand-soft (brand).
Usage example for the ai2 toggle component.
Single or multiple selection toggle group on radix-ui. Inherits variant/size/tone from the group via context; outline variant renders as a segmented control.
Usage example for the ai2 toggle-group component.
Styled toggles: the essentials set. 5 decorative toggles variations (IOSToggle, SquareToggle, IconToggle, GlowToggle, LabeledToggle) on the ai2 token system, powered by framer-motion, reduced-motion aware and sized sm to xl. Part of the free styled layer.
Styled calendar: the Tone set. 5 decorative calendar variations (InfoCalendar, SuccessCalendar, WarningCalendar, DangerCalendar, MutedCalendar) on the ai2 token system, driven by CSS token transitions and sized sm to xl. Part of the free styled layer.
Styled checkbox: the Tone set. 5 decorative checkbox variations (InfoCheckbox, SuccessCheckbox, WarningCheckbox, DangerCheckbox, MutedCheckbox) on the ai2 token system, powered by framer-motion, reduced-motion aware and sized sm to xl. Part of the free styled layer.
Styled combobox: the Tone set. 5 decorative combobox variations (InfoCombobox, SuccessCombobox, WarningCombobox, DangerCombobox, MutedCombobox) on the ai2 token system, powered by framer-motion, reduced-motion aware and sized sm to xl. Part of the free styled layer.
Styled kbd: the Tone set. 5 decorative kbd variations (InfoKbd, SuccessKbd, WarningKbd, DangerKbd, MutedKbd) on the ai2 token system, driven by CSS token transitions and sized sm to xl. Part of the free styled layer.
Styled label: the Tone set. 5 decorative label variations (InfoLabel, SuccessLabel, WarningLabel, DangerLabel, MutedLabel) on the ai2 token system, driven by CSS token transitions and sized sm to xl. Part of the free styled layer.
Styled menubar: the Tone set. 5 decorative menubar variations (InfoMenubar, SuccessMenubar, WarningMenubar, DangerMenubar, MutedMenubar) on the ai2 token system, powered by framer-motion, reduced-motion aware and sized sm to xl. Part of the free styled layer.
Styled popover: the Tone set. 5 decorative popover variations (PrimaryPopover, SuccessPopover, WarningPopover, DangerPopover, InfoPopover) on the ai2 token system, powered by framer-motion, reduced-motion aware and sized sm to xl. Part of the free styled layer.
Styled select: the Tone set. 5 decorative select variations (InfoSelect, SuccessSelect, WarningSelect, DangerSelect, MutedSelect) on the ai2 token system, powered by framer-motion, reduced-motion aware and sized sm to xl. Part of the free styled layer.
Styled separator: the Tone set. 5 decorative separator variations (InfoSeparator, SuccessSeparator, WarningSeparator, DangerSeparator, MutedSeparator) on the ai2 token system, driven by CSS token transitions and sized sm to xl. Part of the free styled layer.
Styled slider: the Tone set. 5 decorative slider variations (InfoSlider, SuccessSlider, WarningSlider, DangerSlider, MutedSlider) on the ai2 token system, powered by framer-motion, reduced-motion aware and sized sm to xl. Part of the free styled layer.
Styled textarea: the Toolbar set. 5 decorative textarea variations (FormatTextarea, ActionsTextarea, FooterTextarea, HeaderTextarea, SplitTextarea) on the ai2 token system, driven by CSS token transitions and sized sm to xl. Part of the free styled layer.
Tooltip on radix-ui with portal, arrow, directional slide/zoom animations and 2 content sizes (sm, md). Tooltip wraps its own Provider, so a single import works out of the box.
Usage example for the ai2 tooltip component.
Styled tooltips: the essentials set. 5 decorative tooltips variations (GlassTooltip, GradientTooltip, ArrowTooltip, DarkTooltip, SlideTooltip) on the ai2 token system, driven by CSS token transitions and sized sm to xl. Part of the free styled layer.
Styled inputs: the Typewriter set. 5 decorative inputs variations (TypewriterInput, CyclePlaceholderInput, CaretInput, GhostInput, MorphLabelInput) on the ai2 token system, powered by framer-motion, reduced-motion aware and sized sm to xl. Part of the free styled layer.
Styled accordion: the Underline set. 5 decorative accordion variations (SweepAccordion, CenterAccordion, GrowAccordion, DoubleAccordion, DashedAccordion) on the ai2 token system, powered by framer-motion, reduced-motion aware and sized sm to xl. Part of the free styled layer.
Styled collapsible: the Underline set. 5 decorative collapsible variations (SweepCollapsible, CenterCollapsible, GrowCollapsible, DoubleCollapsible, DashedCollapsible) on the ai2 token system, powered by framer-motion, reduced-motion aware and sized sm to xl. Part of the free styled layer.
Styled field: the Validation set. 5 decorative field variations (ValidField, InvalidField, WarningField, HintField, LiveField) on the ai2 token system, driven by CSS token transitions and sized sm to xl. Part of the free styled layer.
Styled inputs: the Validation set. 5 decorative inputs variations (SuccessInput, ErrorInput, LiveInput, StrengthInput, CharCountInput) on the ai2 token system, driven by CSS token transitions and sized sm to xl. Part of the free styled layer.
Styled textarea: the Validation set. 5 decorative textarea variations (ValidTextarea, InvalidTextarea, WarningTextarea, HintTextarea, LiveTextarea) on the ai2 token system, driven by CSS token transitions and sized sm to xl. Part of the free styled layer.
Styled carousel: the Vertical set. 5 decorative carousel variations (SlideCarousel, FadeCarousel, CardsCarousel, DotsCarousel, StackCarousel) on the ai2 token system, powered by framer-motion, reduced-motion aware and sized sm to xl. Part of the free styled layer.
Styled separator: the Vertical set. 5 decorative separator variations (LineVSeparator, GradientVSeparator, DashedVSeparator, DotVSeparator, TallVSeparator) on the ai2 token system, driven by CSS token transitions and sized sm to xl. Part of the free styled layer.
Styled slider: the Vertical set. 5 decorative slider variations (LineVSlider, ThickVSlider, TicksVSlider, FillVSlider, CompactVSlider) on the ai2 token system, powered by framer-motion, reduced-motion aware and sized sm to xl. Part of the free styled layer.
Styled tabs: the Vertical set. 5 decorative tabs variations (LeftTabs, RightTabs, CardTabs, RailTabs, CompactTabs) on the ai2 token system, powered by framer-motion, reduced-motion aware and sized sm to xl. Part of the free styled layer.
Styled calendar: the Week set. 5 decorative calendar variations (WeekCalendar, DaysCalendar, AgendaCalendar, StripCalendar, RowCalendar) on the ai2 token system, driven by CSS token transitions and sized sm to xl. Part of the free styled layer.