AlignDev
Frontend conventions generator for the AI coding era · Generate team standards and SKILL.md in one flow
Build with AI. Ship with standards.
A 7-step visual wizard that generates a complete Markdown standards document and a SKILL.md that Claude Code, Cursor, GitHub Copilot, and other coding agents can read directly.
📖 About AlignDev
AlignDev is a frontend conventions generator built for the AI coding era.
When teams use Claude Code, Cursor, Copilot, Windsurf, and other AI agents at the same time, the biggest pain point is consistency: each agent writes code based on its own interpretation, so directory structure, naming, state management, and UI style drift apart. AlignDev turns team conventions into machine-readable and human-editable standards so every agent works from the same contract.
In about 3 minutes, you can get:
-
A complete Markdown standards document you can share with your team
-
A
SKILL.mdyou can place in the repository root so AI agents can load it automatically
✨ Features
Module Capability Details
🎯 7-step visual wizard Core stack / UI / state / toolchain / directories / naming / tokens Preview selections instantly, no config file required
🧠 Multi-framework support Next.js · React (Vite) · Vue · Nuxt · SvelteKit Options adapt to the selected framework to avoid invalid combinations
🎨 49 UI styles minimalism / glassmorphism / neumorphism / brutalism / aurora / cyberpunk … Each style includes preset Design Tokens
🌈 Live Design Tokens preview Color depth (3 / 5 tiers), spacing (4px/8px), type scale (four ratios) Visualize instantly and export as CSS Variables / JS Object
♿ WCAG contrast checks
Automatically calculates foreground/background contrast ratios
Built in lib/wcag-utils.ts, with AA / AAA level hints
📦 Live npm version sync
Fetches latest major versions for 30+ mainstream packages via app/api/versions
Falls back to FALLBACK_VERSIONS on failure
📄 Two output artifacts
Full standards document + SKILL.md
Copy or download in one click
🤖 AI-agent friendly Output optimized for Claude Skill / Cursor Rules Drop it into your repo and agents can follow it automatically
🌐 i18n / RTL aware
next-intl · i18next · vue-i18n · @nuxtjs/i18n
Supports ltr / rtl / bidi text directions
🔒 TypeScript first
Strict mode, fully typed options
See types/wizard.ts
📄 License
MIT © AlignDev
Keywords: AI frontend conventions · AI coding standards · frontend conventions generator · SKILL.md generator · Claude Code · Claude Skill · Cursor Rules · GitHub Copilot rules · Next.js conventions · React conventions · Vue conventions · Nuxt conventions · SvelteKit conventions · shadcn/ui · Design Tokens · TypeScript conventions · AI developer tools
If AlignDev is useful to you, a ⭐ Star is the best support.