Skip to content

feat: add comprehensive design system with CSS tokens, dark theme, and brand assets - Closes #19 - #34

Merged
KarenZita01 merged 1 commit into
EquipChain:mainfrom
Jokay1997:design/design-system-19
Jul 28, 2026
Merged

feat: add comprehensive design system with CSS tokens, dark theme, and brand assets - Closes #19#34
KarenZita01 merged 1 commit into
EquipChain:mainfrom
Jokay1997:design/design-system-19

Conversation

@Jokay1997

Copy link
Copy Markdown

Summary

Implement a complete design system for EquipChain frontend with CSS custom properties, comprehensive color palette, dark theme support, and brand assets.

Changes

Design Tokens (globals.css)

  • Brand colors: Full brand-50 through brand-950 blue palette
  • Status colors: success, warning, error, info with light/dark variants
  • Surface colors: surface, surface-secondary, surface-tertiary, border variants
  • Text colors: text-primary, text-secondary, text-muted, text-inverse
  • Typography: font-sans (Geist), font-mono (Geist Mono)
  • Shadows: shadow-sm through shadow-xl
  • Radii: radius-sm through radius-full

Dark Theme

  • Comprehensive dark mode using @media (prefers-color-scheme: dark)
  • All surface and text tokens have proper dark variants

Brand Assets

  • public/logo.svg — Full logo with icon and text
  • public/icon.svg — 32px favicon-style icon
  • public/logo-mark.svg — 24px standalone mark

Accessibility

  • Focus-visible ring style
  • Proper selection color

Documentation

  • src/lib/design/DESIGN_TOKENS.md — Complete token reference

@KarenZita01
KarenZita01 merged commit 356e4d2 into EquipChain:main Jul 28, 2026
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants