> ## 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.

# Getting Started

> Create and manage your first design system in VibeFlow

## Accessing Design Systems

1. Click **Design Systems** in the left sidebar navigation
2. 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.

1. Type a description into the prompt bar (e.g., "Minimalist fintech app with neon green accents")
2. Click **"Generate"**
3. AI will create a design system with a name, color palette, typography scale, and component guidelines
4. 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.

1. Switch to the **"Community Library"** tab
2. Browse available templates
3. Click **"Use Template"** on one you like
4. A copy is added to your library, ready to customize

### Create Blank

Start from scratch with an empty design system.

1. Click the **"Create Blank"** button in the top right
2. Enter a **Name** (e.g., "Material Design", "Stripe UI", "iOS HIG")
3. Add a **Description** explaining what the design system is for
4. Click **"Create"**

You'll be taken to the design system detail page where you can start adding guidelines and components.

## 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

1. Click the **three-dot menu** on a design system card
2. Select **"Delete"**
3. Confirm the deletion

**Warning**: This action cannot be undone and will permanently delete all components and guidelines.