Agential Skill

Autonomous Frontend Architecture & Editorial Output Design Engine for Coding Assistants

Specialized for Claude Code · Google Antigravity · VS Code (GitHub Copilot)

Quickstart

Run one command in the root of your project:

npx agential-skill init

The installer adds the canonical skill and platform adapters to the current project.

CLI Commands

Command	Description
npx agential-skill init	Launch the interactive setup wizard
npx agential-skill init -y	Install all supported adapters without prompts
npx agential-skill add react-nextjs	Add React / Next.js implementation guidance
npx agential-skill add vue-nuxt	Add Vue / Nuxt implementation guidance
npx agential-skill prompt	View the standalone system prompt
npx agential-skill --help	View CLI options

What This Does

AI coding models often generate generic SaaS UI: soft cards, shadows, glass panels, gradient buttons, dashboard widget piles, and long filler copy. Agential Skill replaces those defaults with a self-contained editorial output system.

The system produces:

• Image-first full-bleed planes, split stages, title/image plates, and visible 1px construction grids.
• Oversized neutral grotesque typography paired with small mono utility labels and short copy.
• Hard-edged rectangular framing, with no soft ornamental geometry.
• Black, white, charcoal, cream, and selective vermilion/red/orange imagery.
• No cards, bento, shadows, glass, blur, decorative gradients, equal feature grids, or generic SaaS templates.
• Real interaction state, WCAG 2.1 AA semantics, square focus outlines, reduced-motion support, and post-edit validation.

The Five Pillars

1. Memory — Read context.md first and persist visual decisions and milestones.
2. Editorial Output — Make the dominant image/type composition, hairline structure, sparse metadata, and minimal pacing unmistakable.
3. System Discipline — Use the same output language across sites, apps, portfolios, and framework presets.
4. Incremental Delivery — Deliver complete cohesive chunks rather than decorative fragments.
5. Post-Edit Review — Inspect diffs and run available validation after every change.

Design Specification

DESIGN.md contains the machine-readable token contract. SKILL.md is the complete specification. AGENTS.md is the compact operational rule set.

Supported Platforms

Platform	File
Claude Code	CLAUDE.md
Google Antigravity	AGENTS.md
VS Code / GitHub Copilot	.github/copilot-instructions.md
Cursor	.cursor/rules/agential-skill.mdc
Windsurf	.windsurfrules
Web LLMs	adapters/system-prompt/prompt.md

Repository Structure

agential-skill/
├── SKILL.md
├── AGENTS.md
├── DESIGN.md
├── context.md
├── presets/
├── references/
├── adapters/
├── .cursor/rules/
├── bin/cli.js
└── .github/workflows/

Author and License

Created by Talha Irfan (@talhairfandev). Licensed under MIT.