Skip to content
Vibe Coding Starter Pack

Vibe Coding Starter Pack for Designers

A guided, project-based path for designers who want to build real things with the help of AI. No computer science degree required. No boring tutorials. Just you, your design instincts, and an AI coding partner.
Get Started View on GitHub

What You’ll Build

Section titled “What You’ll Build”

Phase 1: Color Palette Generator

Build a working design tool in ~1 week. Generate, lock, copy, and save color palettes.

Phase 2: Product Landing Page

Build a polished marketing page for your tool in ~2 weeks. Responsive, animated, accessible.

Phase 3: Design Portfolio

Build a multi-page portfolio showcasing your projects in ~2 weeks. Your professional presence.

Resources & Next Steps

Where to go after the starter pack. Keep building, go deeper, or level up your career.

How It Works

Section titled “How It Works”
  1. Describe what you want in plain language
  2. Review what the AI gives you
  3. Refine by giving more specific feedback
  4. Repeat until it looks and works the way you want

That’s vibe coding. You already know how to do this — you give creative direction every day.

Created by Ginny Mones & Kiro. Licensed under CC BY-NC 4.0.