Brand System

Components

A comprehensive library of UI components following Sonance brand guidelines. All components are theme-aware and adapt automatically to light and dark modes.

47

Components

6

Categories

2

Theme Modes

100%

Accessible

Forms

Input components for building forms with validation states.

Feedback

Components for communicating status, progress, and loading states.

Overlays

Modal dialogs, tooltips, popovers, and drawers.

Data Display

Components for displaying and organizing data.

Utilities

Helper components for layout, code display, and keyboard shortcuts.

Quick Start

Getting Started

Learn how to use these components in your project.

View Guidelines →

Color System

Explore the Sonance color palette and theme variables.

View Colors →

Typography

Learn about fonts, sizes, and text styles.

View Typography →