aesthete

Designs, builds, and reviews WCAG 2.2-compliant web interfaces across marketing and product surfaces.

2|2|Updated Jun 21, 2026
One-click install
npx skills add https://github.com/BTreeMap/SKILLs --skill aesthete-btreemap
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: aesthete
Source: https://github.com/BTreeMap/SKILLs/tree/main/aesthete
Command: npx skills add https://github.com/BTreeMap/SKILLs --skill aesthete-btreemap

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Web interfaces built by AI agents often look templated, ignore accessibility requirements, and duplicate components. This Skill applies a disciplined design process with a strict precedence ladder, a WCAG 2.2 accessibility floor, and a catalogue of generated-looking patterns to avoid. ## Core Features & Use Cases - Seven workflow verbs: design, build, review, audit, refactor, teach, and help, each with its own procedure file covering new interfaces, existing screens, and whole-product sweeps. - Accessibility floor: pinned WCAG 2.2 AA values for contrast, target size, focus, and reflow that override any brand or supplied design document, with conflicts resolved by derivation and reported. - Craft references: dedicated guidance for typography, color, layout, motion, interaction states, component architecture, and platform capabilities, plus a preflight ship gate with mechanical counts. - Use Case: Ask it to redesign a landing page and it will state a design read, set variance/motion/density dials, fix a token spine, build with closed variant sets, and run a preflight checklist before declaring done. ## Quick Start Use the aesthete skill to review this dashboard screen for accessibility and consistency issues.

Frequently Asked Questions about aesthete

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

FAQPage Schema
How do I make a web interface WCAG 2.2 compliant?

Apply the WCAG 2.2 AA floor: 4.5:1 contrast for normal text, 3:1 for large text and control indicators, 24 by 24 CSS pixel pointer targets, and visible focus. The a11y reference pins these values and marks AAA criteria as recommendations only.

How to review an existing UI for design and accessibility issues?

Use the review verb for read-only findings on a screen or diff, or the audit verb for a ranked sweep of a whole product. Audits extract the implicit token system from code, cluster findings by cause, and rank fixes by leverage.

Does it work with an existing design system or brand palette?

Yes. A supplied palette overrides a supplied design document's colors, which override the repository's existing system, which override defaults. The brief reference maps palette colors to roles, verifies contrast, and reports every conflict resolution.

What makes AI-generated UI look templated and how to avoid it?

The tells reference catalogues generated-looking patterns: em-dashes in copy, uppercase micro-labels above every section, three identical cards, purple-to-blue gradients, and fabricated product screenshots. Each is banned as a default reach unless the brief justifies it.

When should I not use this design workflow?

It targets web interfaces on marketing and product surfaces. It does not cover native mobile app design, print, or brand identity creation, and it defers to the repository's existing stack rather than imposing a new framework.