Skip to main content
Back to Selected Work
Open SourceStrata Open Source CoreOngoing (2024 - Present)

Strata Multi-Brand UI Kit & CLI

Enterprise component library and CLI generator powering 12 internal digital products across web and desktop.

Strata Multi-Brand UI Kit & CLI

The Engineering Challenge

Engineering design tokens that allow instant brand theme swaps (light/dark/custom high-contrast) without generating bloat or class name collisions in large Monorepos.

The Architectural Solution

Designed a CSS custom-property powered token layer coupled with an NPX CLI utility that injects raw TypeScript source directly into consumer applications.

Key Architectural Decisions

Unstyled accessible primitives adhering strictly to WAI-ARIA guidelines.
Automatic dark-mode contrast calculation ensuring WCAG AAA standards.
Zero lock-in copy-paste code model popularized by shadcn/ui.
Built-in Framer Motion spring physics defaults for standard drawer and modal interactions.

Figma Design Spec vs. Live Rendered Code

Live Next.js Output
Live Next.js Output
Figma Spec Canvas
Figma Spec Canvas

Quantifiable Metrics & Impact

24k+

Weekly npm package downloads across enterprise teams.

1.8k★

Stars on GitHub with over 45 active open-source contributors.

-40%

Faster UI development velocity reported by adopting engineering teams.

Technology Stack & Bundle Footprint

TypeScript
Radix UI
Tailwind CSS v4
Node.js CLI