KairaxisKairaxis
Freetaste skilllow risk

Capability · rank 1372

system-overview

Turn System Overview's palette, typography, spacing, radius, and composition rules into repeatable UI constraints.

A packaged design-system skill based on System Overview, providing reusable visual constraints for AI-generated product interfaces without bundling the original preview HTML.

Listed owner

Vanh DesignCode via Aura

Package source

Aura DESIGN.md

Category

Design Systems

Design Systems
$curl -fsS -X POST https://skillforge.kairaxis.com/api/v1/skills/system-overview/install
OverviewSandboxUsageExamplesLimitationsVersionsRelated Skills

Overview

A packaged design-system skill based on System Overview, providing reusable visual constraints for AI-generated product interfaces without bundling the original preview HTML. Review the sandbox comparison, limitations, permissions, and pinned version before install.

Outcome

Turn System Overview's palette, typography, spacing, radius, and composition rules into repeatable UI constraints.

Who it is for

Designers and builders who want an explicit visual system for AI-generated interfaces.

What it is not for

Pixel-identical recreation of the original Aura preview or unreviewed production brand replacement.

Runtime export

codex_skill · markdown_export

TASTE domain: ui_ux_taste

Sandbox comparison
Generic baseline vs system-overview on the same sample input · pinned v1.0.0

Sample input

Restyle a generic product interface using System Overview.

Model: gpt-4.1-mini · temp 0.2

Generic baseline

48/100
Use a polished modern layout with a generic gradient, rounded cards, and standard typography.

Skill-enhanced

88/100
- Treat System Overview as a constraint system, not a loose inspiration reference.
- Use the documented color roles consistently: primary #F76A1C, secondary #FFFFFF, accent #2044F4, background #FFFFFF, surface #FFFFFF, text-primary #111827, text-secondary #4B5563, border #E5E7EB.
- Preserve the type hierarchy: display-lg: Inter, 64px, weight 500, line-height 1.04; body-md: Inter, 16px, weight 400, line-height 1.6; label-md: JetBrains Mono, 12px, weight 600, line-height 1.2.
- Keep the spacing rhythm anchored to: base 8px, gap 16px, card-padding 24px, section-padding 80px.
- Use the declared corner system: card 16px, control 8px, pill 9999px.
- Preserve the source hierarchy, density, component geometry, and responsive stacking before adapting copy.
- Keep motion and atmospheric effects secondary to readability, accessibility, and interface performance.
- Do not flatten distinctive compositions into a generic SaaS card grid.

Rubric scores

+40 lift
Token fidelity1 → 5
Visual hierarchy3 → 5
Composition distinctiveness2 → 4
Responsive discipline2 → 4

Assumptions

  • The target interface can load compatible fonts or approved substitutes
  • The design system is adapted with accessibility and brand review

Comparison runs through the shared sandbox engine on registry sample cases (deterministic v0 path).

Usage

  1. 1. Inspect trust badges, limitations, and permissions on this page.
  2. 2. Run the sandbox comparison to see baseline vs skill-enhanced output.
  3. 3. Install the pinned version with the command below for your agent runtime.
  4. 4. Agents can also fetch /api/v1/skills/system-overview/manifest.
$curl -fsS -X POST https://skillforge.kairaxis.com/api/v1/skills/system-overview/install

Example prompts & use cases

1 / Prompt

Apply System Overview to a new landing page while preserving its design-token hierarchy

2 / Prompt

Restyle this dashboard using System Overview's palette, typography, and spacing

3 / Prompt

Audit this component set against the System Overview design-system constraints

Limitations

  • The package includes extracted design tokens and operating guidance, not Aura's original HTML preview.
  • Typography availability, accessibility, and brand fit must be verified in the target product.
  • Source popularity is a discovery signal, not evidence of conversion performance.

Audience

Designers and builders who want an explicit visual system for AI-generated interfaces.

Not for

Pixel-identical recreation of the original Aura preview or unreviewed production brand replacement.

Version history

v1.0.0

Jul 25, 2026current

Synced from Aura's public popular DESIGN.md collection (47a6711122b8c689).