NebulaKit is built on a modern stack chosen for clarity, reliability and speed. Every tool in the system supports the same principle that guides its design - structure over sprawl. Each of these tools was selected not to add complexity, but to preserve it - a stack built for speed, structure and long-term clarity.
The foundation of every component. React's declarative model and compositional nature align perfectly with NebulaKit's architecture, where small parts form larger structures with predictable behavior.
The library is written entirely in TypeScript to ensure strong typing, self-documenting code and early error detection. Props and internal utilities share consistent types, making the system safer and easier to extend.
Styling relies on native CSS with a layer of Sass for organization and variable management. Responsive props map directly to CSS properties, ensuring performance and simplicity. CSS variables handle color, scale and state, while Sass structures themes and utilities cleanly.
Development and build are powered by Vite, chosen for its speed, modularity and smooth TypeScript integration. It keeps the feedback loop fast and the configuration lightweight.
Icons come from Lucide, a clean, consistent icon set built with React. They scale naturally with typography and follow the same theming system as other components.
Quality is enforced on three levels:
tsd validates type definitions at build time
Vitest handles runtime testing for logic and rendering
Playwright verifies computed DOM values and accessibility in real browsers
Together, they ensure both the API and the rendered output stay stable across updates.
Linting and formatting are managed by ESLint and Prettier, keeping the codebase consistent and readable. Every component adheres to shared rules, minimizing noise and friction.