Rokkit Libraries
Rokkit consists of several focused libraries that work together to provide a complete development experience:
@rokkit/core
Core utilities and shared functionality
@rokkit/icons
Unified icon system with UnoCSS
@rokkit/actions
Svelte actions for enhanced functionality
@rokkit/states
State management utilities
@rokkit/ui
Data-driven UI components
@rokkit/layout
Layout and structural components
@rokkit/themes
Theming system and utilities
Setup Instructions
âšī¸Prerequisites
You'll need to have basic familiarity with Svelte/SvelteKit to use Rokkit effectively.
1 Add UnoCSS to your SvelteKit project
Rokkit uses UnoCSS for styling. Follow the official UnoCSS integration guide for SvelteKit:
UnoCSS SvelteKit Integration Guide â2 Clone the Quick Start Template
The fastest way to get started is to use our pre-configured template:
3 Try Your First Component
Add this code to your +page.svelte file:
Try it out:
What's Next?
Now that you have Rokkit set up, explore the different types of components and learn how to build powerful data-driven applications: