Cosmic UI is a set of beautifully-designed sci-fi components with customizable SVG shapes. Built for modern frameworks with accessible interactive logic. Open Source. Fully Customizable.
Cosmic UI is a set of beautifully-crafted, customizable UI components with a sci-fi aesthetic. Built to empower you to create interfaces with futuristic designs using SVG shapes as the foundation, while leveraging zag.js for interactive components.
This is not a traditional component library. It is a system to build your own sci-fi component library.
You know how most component libraries work: you install a package, import the components, and use them as they are. But when you want a UI with a distinctive sci-fi style – sharp edges, frames, holographic panels – you often end up writing complex custom SVG or CSS code from scratch.
This is what Cosmic UI aims to solve. It is built around the following principles:
- SVG First: Components use customizable SVG shapes to achieve a truly sci-fi look.
- Selective zag.js Integration: Interactive components are powered by zag.js for accessibility and state management.
- Full Control: You own and customize every component’s markup, SVG paths, and styles.
- Beautiful Sci-Fi Defaults: Carefully designed shapes, frames, and layouts that work out-of-the-box for sci-fi themed apps, dashboards, and games.