Workspace
Documentation

Basics

Getting Started

Set up the app and generate your first DESIGN.md from a PDF, PowerPoint deck, Figma file, or website URL.

What this product does

FT DesignSpec turns a brand artifact (PDF brand guide, PowerPoint deck, Figma file, or — as a last resort — a website URL) into a structured DESIGN.md document with sections for tokens, components, and implementation guidance.

Local setup

  1. Install dependencies:
npm install
  1. Create local environment values:
cp .env.example .env.local
  1. Add your Gemini API key:
GOOGLE_API_KEY=your_key_here
  1. Start development:
npm run dev

Generate your first run

  1. Open /.
  2. Pick a source type. Sources are ordered by signal strength: PDF, PowerPoint, Figma, then Website URL.
  3. Upload the file (or enter the Figma/URL details).
  4. Click Run generator.
  5. Review output in Preview, Raw, Visual, or Site tabs.

Save behavior

  • Every run is saved to history.
  • A run can be Public or Private before generating.
  • Private runs still contribute to total run counters.

Next steps

  • Read Sources docs for extraction behavior per input type.
  • Read Features docs for private runs, exports, and trending.
  • Read Authoring docs to customize and expand generated output quality.

Next

DESIGN.md Schema