kkunkunya/ai-frontend-design-kit

3 stars · Last commit 2026-04-24

AI-first frontend design toolkit for Claude Code and Codex: 7-stage flow with six-dimension research, dualround interview, visual anchors, motion spec, anti-slop gate, and kun 15-segment DESIGN.md contract. Constraints before generation.

PluginWorkflow & Automation Documentation Design & UI DevOps & Infra AI & Prompting Data & ML

README preview

# AI Frontend Design Kit

**English · [中文](./README.zh.md)**

> **Constraints before generation.** A 10-skill plugin for Claude Code and Codex that upgrades AI-assisted frontend design from "generate four options, pick one" to a rigorous 7-stage flow with taste-level design contracts.

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](./LICENSE)
[![Claude Code](https://img.shields.io/badge/Claude_Code-plugin-blue)](https://docs.claude.com/en/docs/claude-code)
[![Codex](https://img.shields.io/badge/Codex-plugin-green)](https://github.com/openai/codex)

---

## Why this exists

Most "AI frontend" tooling generates 2–4 page variants and asks you to pick one. That works for throwaway demos. It does not work when you actually care about the result — because AI cannot form your aesthetic judgment for you.

This kit inverts the loop:

1. **Form constraints first** (primary language, six-dimension taste mapping, dualround interview, moodboard anchor, motion spec)
2. **Generate inside those constraints** (visual references, code, iterations)

View full repository on GitHub →