Lumina Style Studio

A modern design system tool for creating, customizing, and exporting UI themes.

🎨 Overview

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.

✨ Features

• 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

🚀 Getting Started

Prerequisites

• Node.js (v16 or higher)

Installation

# 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

Running the Application

# Start the development server
npm run dev

The application will be available at http://localhost:3000

AI Theme Generation (Optional)

To enable AI theme generation:

1. Create a .env.local file in the project root
2. Add your Gemini API key: GEMINI_API_KEY=your_api_key_here

🛠️ Technologies Used

• 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

🤝 Contributing

Contributions are welcome! Feel free to submit issues and pull requests.

1. Fork the repository
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a pull request

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

🌟 Acknowledgments

• Inspired by modern design systems and artistic movements
• Built with the amazing open-source ecosystem