Component Gallery

Signature pill-first action control with physics-based spring squash interaction (0.98 scale on press).

Concentric circular action button strictly optimized for Phosphor Thin icons with mandatory accessible labeling.

Grouped capsule action bar where child buttons share outer bounds and internal 1px hairline dividers.

Base structural container supporting concentric radius inheritance and Apple HIG Liquid Glass floating layers.

Apple HIG calibrated Geist Sans typography system restricted strictly to light weights (200, 300, 400).

Restrained architectural text field (6-8px radius, 12px optical padding) avoiding stadium pill shapes.

Persistent structural wrapper binding labels, helper annotations, and error callouts to input controls.

Architectural multi-line text input with smooth auto-expansion, character limit tracking, and hairline borders.

Restrained geometric square checkbox with crisp Phosphor Thin checkmark and indeterminate state support.

Apple HIG calibrated sliding toggle with physics spring release and native haptic click feedback.

Precision track slider with Apple spring thumb response, live value tooltip, and discrete stop ticks.

Sliding pill segmented group with animated indicator and spring squash transition across items.

Top navigation chrome featuring adaptive scroll elevation for Navbar and permanent Liquid Glass for GlassBar.

Background-less architectural sidebar navigation with collapsible rail mode, groups, and soft dividers.

Accessible view switcher supporting pill capsule and sliding hairline underline modes with roving keyboard focus.

Centered modal surface with background scrim, focus restoration, focus trapping, and Apple spring dismissal.

Slide-over drawer on web and gesture-driven bottom sheet with tactile drag handle on React Native.

Hairline contextual action menu with openOnHover option, keyboard navigation, groups, and shortcuts.

Architectural custom listbox on web and native picker sheet on Expo with dynamic radius matching global tokens.

Global quick-launcher overlay triggered by ⌘K with keyboard arrow navigation and categorized action groups.

Compact status indicator with acid accent tones, subtle neutral styles, and optional live pulse dot.

Inline semantic status callout with Phosphor Thin icons, crisp 1px perimeter border, and restrained fill.

Outer-rounded hairline bordered table with tabular numbers, clean row highlighting, and horizontal containment.

Apple-grade fluid grid disclosure (zero instant snappy jumps) with 280ms cubic-bezier transitions and spring caret rotation.

Circular avatar with graceful image loading, typographic initial fallbacks, and overlapping grouped clustering.

Zero-dependency isomorphic syntax highlighted code block in Geist Mono with copy micro-action and line numbering.