ferrox-design-init

Generate a nine-section DESIGN.md design contract from repository context or UI evidence.

21|9|Updated Jul 21, 2026

Search Tags:#accessibility #frontend #design system #ui planning #design contract #interview workflow

Ready to run

npx skills add https://github.com/FerroxLabs/ferrox-factory --skill ferrox-design-init

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: ferrox-design-init
Source: https://github.com/FerroxLabs/ferrox-factory/tree/main/skills/ferrox-design-init
Command: npx skills add https://github.com/FerroxLabs/ferrox-factory --skill ferrox-design-init

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill prevents UI work from drifting by turning the project’s visual decisions into a binding design contract before implementation begins.

Core Features & Use Cases

Design Contract Creation: Produces a DESIGN.md file with nine concrete sections covering theme, colors, typography, spacing, components, motion, voice, accessibility, and non-goals.
Interview or Existing-UI Modes: Can either guide a short recommendation-first interview or derive the contract from an existing codebase’s observed UI patterns.
Use Case: A team starting a new frontend feature can use this Skill to lock in consistent visual rules so designers, developers, and agents all build against the same standard.

Quick Start

Use the ferrox-design-init skill to create a DESIGN.md contract for this repository using the default interview flow.

Frequently Asked Questions about ferrox-design-init

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I create a UI design contract for a frontend project?▼

To create a UI design contract, this Skill generates a structured DESIGN.md file from your repository context, locking in visual rules across nine sections before implementation begins.

What is the best way to document a design system for agentic workflows?▼

Documenting a design system for agentic workflows requires an explicit design contract. This Skill produces a nine-section DESIGN.md with concrete values and accessibility safeguards so agents build against the same standard.

Can I generate a design contract from an existing codebase's UI patterns?▼

Yes, you can generate a design contract from an existing codebase. The Skill operates in existing-UI mode, deriving structured visual rules by inspecting your repository's observed interface evidence.

Does the generated design contract include accessibility safeguards?▼

Yes, the generated design contract includes accessibility safeguards. The output DESIGN.md explicitly covers accessibility as one of its nine concrete sections to ensure frontend compliance.

What sections are included in a DESIGN.md design contract?▼

A DESIGN.md design contract includes nine concrete sections: theme, colors, typography, spacing, components, motion, voice, accessibility, and non-goals to prevent UI drift.

Do I need to complete an interview to set up UI planning rules?▼

You do not need to complete an interview to set up UI planning rules. The Skill offers a recommendation-first interview flow, but can also derive rules directly from existing interface evidence.