Lumina Style Studio is a powerful design system tool that allows you to create, customize, and export UI themes. With a wide variety of pre-built themes inspired by popular design systems and artistic movements, you can quickly prototype and iterate on your designs.
-
Pre-built Themes: Over 20 professionally designed themes including:
- Tech giants (Apple, Notion, Claude-inspired)
- Artistic styles (Impressionism, Abstract Expressionism)
- Modern trends (Brutalism, Vaporwave)
- Luxury and high-end designs
-
Customization: Fine-tune every aspect of your theme:
- Color palettes with live preview
- Typography settings
- UI components (border radius, shadows, etc.)
-
AI Generation: Describe a mood or concept in natural language and let AI generate a unique theme for you
-
Export Options: Export your themes in multiple formats:
- CSS variables
- Tailwind CSS configuration
- JSON theme files
- Node.js (v16 or higher)
# Clone the repository
git clone https://github.com/cclank/lumina-style-studio.git
# Navigate to the project directory
cd lumina-style-studio
# Install dependencies
npm install# Start the development server
npm run devThe application will be available at http://localhost:3000
To enable AI theme generation:
- Create a
.env.localfile in the project root - Add your Gemini API key:
GEMINI_API_KEY=your_api_key_here
- React 19 - Modern UI library
- Vite - Lightning fast build tool
- Tailwind CSS - Utility-first CSS framework
- Lucide React - Beautiful SVG icons
- Google Gemini API - AI-powered theme generation
Contributions are welcome! Feel free to submit issues and pull requests.
- Fork the repository
- Create your feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a pull request
This project is licensed under the MIT License - see the LICENSE file for details.
- Inspired by modern design systems and artistic movements
- Built with the amazing open-source ecosystem