Documentation Index
Fetch the complete documentation index at: https://docs.vibeflow.ai/llms.txt
Use this file to discover all available pages before exploring further.
Accessing Design Systems
- Click Design Systems in the left sidebar navigation
- You’ll see a grid view of all your design systems
Creating Your First Design System
There are three ways to create a design system:Generate with AI
The fastest way to get started. Use the prompt bar at the top of the Design Systems page to describe your visual style and let AI generate a complete design system for you.- Type a description into the prompt bar (e.g., “Minimalist fintech app with neon green accents”)
- Click “Generate”
- AI will create a design system with a name, color palette, typography scale, and component guidelines
- You’ll be taken to the detail page to review and customize the result
Start from a Community Template
Browse pre-built design systems shared by the community and use them as a starting point.- Switch to the “Community Library” tab
- Browse available templates
- Click “Use Template” on one you like
- A copy is added to your library, ready to customize
Create Blank
Start from scratch with an empty design system.- Click the “Create Blank” button in the top right
- Enter a Name (e.g., “Material Design”, “Stripe UI”, “iOS HIG”)
- Add a Description explaining what the design system is for
- Click “Create”
Managing Design Systems
Design System Card
Each design system displays:- Thumbnail: Visual preview of the design system
- Name & Description: Quick identification
- Tags: Categorization labels (e.g., “SaaS”, “Minimal”, “Dark Mode”)
- Last Updated: When the system was last modified
- Actions Menu: Edit or delete the design system
Searching & Filtering
Use the search bar to filter design systems by:- Name
- Description
- Tags
Deleting a Design System
- Click the three-dot menu on a design system card
- Select “Delete”
- Confirm the deletion