Design System Documentation
This showcase is now organized into page-based docs similar to established UI libraries. Use the sidebar to move through component categories while keeping one persistent theme experience.
Checking Inter font load...
How To Use This Showcase
- Use the sidebar to navigate by component category.
- Switch between light and dark modes using the persistent theme toggle.
- Treat each page as a focused visual contract for a category of tokens and patterns.
Browse Docs Sections
Foundations
Installation
Package usage and integration guidance for Wintermuted UI Theme.
Theme Gallery
Repositories in the Wintermuted account currently using this theme package.
Typography
Type scale, body hierarchy, links, and inline code.
Cards
Surface patterns, density variants, and container composition.
Inputs and Actions
Buttons
Five variants, two sizes, disabled state, and link buttons.
Tags
Neutral and accent pills, bullet lists, and separators.
Forms
Inputs, selects, textareas, and grouped control states.
Navigation and Structure
Navigation
Sidebar nav with active state and sticky positioning.
Modal
Dialog surfaces for interruption, confirmation, and focused workflows.
Layout
Page structures and architecture patterns, including full-page mocks.
Visual Data
Code Block
Syntax-highlighted samples with language header and copy button.
Mermaid
Diagram syntax, rendering setup, and docs-friendly architecture patterns.
Data Display Overview
Summary metrics and stat-card patterns for dense dashboards.
Tables
Responsive tabular layouts for scanning merchants, amounts, and status.
Charts
Chart containers, token mapping, and empty-state patterns.
Gallery
Responsive screenshot grids with hover captions and lift.