I built Styleframe to address these problems. It’s a TypeScript-native way to build type-safe, composable, and scalable design systems.
Key features:
- Type-safe CSS: Write selectors, variables, utilities, themes and tokens in TS and have compile-time checking (no silent runtime CSS bugs).
- Composable design systems: Build tokens, themes, selectors and utilities as reusable pieces, combine modules cleanly, share across projects.
- Rich design tokens and theming: Variables for color, spacing, typography, breakpoints, border-radius and shadows; theme overrides for light/dark/brand variants; output optimized CSS.
- Framework-agnostic usage: Works with React, Vue, Svelte, Solid, Astro, any bundler.
In large teams or systems, styling becomes a fragile surface area: styles leak, tokens diverge, themes multiply, build complexity increases, and developer experience suffers. By writing styling in a typed API, Styleframe aims to make CSS first-class and manageable in modern TS-driven design systems.
What I’m looking for
I’d appreciate feedback from the HN community — especially if you:
- Are maintaining or have built design systems in TypeScript-heavy stacks
- Have experienced pain with CSS scalability, theming or token drift
- Are interested in typed styling APIs or trying out Styleframe in your stack
Happy to answer questions, walk through how the core engine works, or compare to existing solutions. Thanks for reading — looking forward to your thoughts.
— Alex