Skip to main contentDocumentation
Documentation
| CSS variable | Theme key | Default |
|---|---|---|
--c15t-primary | colors.primary | hsl(228, 100%, 60%) |
--c15t-primary-hover | colors.primaryHover | hsl(228, 100%, 55%) |
--c15t-surface | colors.surface | hsl(0, 0%, 100%) |
--c15t-surface-hover | colors.surfaceHover | hsl(0, 0%, 98%) |
--c15t-border | colors.border | hsl(0, 0%, 90%) |
--c15t-border-hover | colors.borderHover | hsl(0, 0%, 85%) |
--c15t-text | colors.text | hsl(0, 0%, 10%) |
--c15t-text-muted | colors.textMuted | hsl(0, 0%, 40%) |
--c15t-text-on-primary | colors.textOnPrimary | auto-derived from colors.primary when omitted |
--c15t-overlay | colors.overlay | hsla(0, 0%, 0%, 0.5) |
--c15t-switch-track | colors.switchTrack | hsl(0, 0%, 85%) |
--c15t-switch-track-active | colors.switchTrackActive | colors.primary |
--c15t-switch-thumb | colors.switchThumb | hsl(0, 0%, 100%) |
--c15t-font-family | typography.fontFamily | system-ui, -apple-system, sans-serif |
--c15t-font-size-sm | typography.fontSize.sm | 0.875rem |
--c15t-font-size-base | typography.fontSize.base | 1rem |
--c15t-font-size-lg | typography.fontSize.lg | 1.125rem |
--c15t-font-weight-normal | typography.fontWeight.normal | 400 |
--c15t-font-weight-medium | typography.fontWeight.medium | 500 |
--c15t-font-weight-semibold | typography.fontWeight.semibold | 600 |
--c15t-line-height-tight | typography.lineHeight.tight | 1.25 |
--c15t-line-height-normal | typography.lineHeight.normal | 1.5 |
--c15t-line-height-relaxed | typography.lineHeight.relaxed | 1.75 |
--c15t-space-xs | spacing.xs | 0.25rem |
--c15t-space-sm | spacing.sm | 0.5rem |
--c15t-space-md | spacing.md | 1rem |
--c15t-space-lg | spacing.lg | 1.5rem |
--c15t-space-xl | spacing.xl | 2rem |
--c15t-radius-sm | radius.sm | 0.25rem |
--c15t-radius-md | radius.md | 0.5rem |
--c15t-radius-lg | radius.lg | 0.75rem |
--c15t-radius-full | radius.full | 9999px |
--c15t-shadow-sm | shadows.sm | 0 1px 2px hsla(0, 0%, 0%, 0.05) |
--c15t-shadow-md | shadows.md | 0 4px 12px hsla(0, 0%, 0%, 0.08) |
--c15t-shadow-lg | shadows.lg | 0 8px 24px hsla(0, 0%, 0%, 0.12) |
--c15t-duration-fast | motion.duration.fast | 80ms |
--c15t-duration-normal | motion.duration.normal | 150ms |
--c15t-duration-slow | motion.duration.slow | 200ms |
--c15t-easing | motion.easing | cubic-bezier(0.4, 0, 0.2, 1) |
--c15t-easing-out | motion.easingOut | cubic-bezier(0.215, 0.61, 0.355, 1) |
--c15t-easing-in | motion.easingIn | cubic-bezier(0.55, 0.055, 0.675, 0.19) |
--c15t-easing-in-out | motion.easingInOut | cubic-bezier(0.645, 0.045, 0.355, 1) |
--c15t-easing-spring | motion.easingSpring | cubic-bezier(0.34, 1.56, 0.64, 1) |