Platform Agnostic
Use the same tokens on web (Vue, Nuxt) and mobile (React Native). Choose your platform and follow the setup guide.
GrundtoneDesign System
Platform-agnostic design tokens and components for Vue, Nuxt, and React Native
Skip to content
Theme-First
Semantic color tokens (primary, background, text). Configure once with createTheme() – see Theme Configuration. Tokens flow to CSS vars (web) or StyleSheet (RN).
Type Safe
Full TypeScript support with autocomplete. Theme types, color presets, and component props all typed.
WCAG Compliant
Accessibility built-in. Semantic colors, contrast checking, and ARIA support.
Self-Hosting
Fork the repo, change the default colors in theme-preset.ts, rebuild, and every package ships your brand out of the box. See Theme Configuration.
Open Source
MIT licensed. Self-host on your own registry and customize colors, spacing, and components to match your brand.