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

# FAQ & Examples

> Frequently asked questions and example design system structure

## Frequently Asked Questions

**Q: How many design systems can I create?**

A: There's no limit to how many design systems you can create. AI-generated design systems use credits from your account balance.

**Q: Can I share design systems with my team?**

A: Currently design systems are private. Team sharing is coming soon.

**Q: Do I need to use all three tabs?**

A: No, but we recommend it. Guidelines help Vibe Agent generate better UIs, and components provide reusable building blocks.

**Q: Can I import components from other design systems?**

A: Not directly yet, but you can export as JSON, manually copy components, and import to another system.

**Q: How do I use a design system in my project?**

A: Reference it when generating features with Vibe Agent: "Use my Stripe UI design system to create a pricing page"

**Q: What happens if I delete a design system?**

A: It's permanently deleted along with all components and guidelines. This cannot be undone.

**Q: Can I edit guidelines while generating components?**

A: Yes, guidelines are available in real-time. Changes apply immediately to new generations.

***

## Example Design System Structure

**Name:** Modern SaaS UI

**Description:** Clean, minimal design system for B2B SaaS applications with dark mode support.

**Tags:** SaaS, Dark Mode, Minimal, Professional

**Guidelines:**

```markdown theme={null}
# Modern SaaS Design System

## Principles
- Clarity over cleverness
- Performance first
- Accessibility by default

## Colors
### Light Mode
- Primary: #0066FF
- Background: #FFFFFF
- Text: #1F2937

### Dark Mode
- Primary: #3B82F6
- Background: #0B0D0E
- Text: #F9FAFB

## Components
All components support both light and dark modes.
Use semantic color tokens, not hardcoded values.
```

**Components:**

* Button (Primary, Secondary, Danger variants)
* Input Field (Text, Email, Password)
* Card (Basic, Elevated, Outlined)
* Navigation Bar
* Pricing Table
* Feature Grid