design-system - Assessment visual identity and quality standards
Defines the shared colors, typography, layout, component specifications, chart palettes, and quality standards for interactive assessment artifacts and HTML/PDF reports.
Tags
Updated: 2026-10-16Capabilities
Typical Inputs
Typical Outputs
What this skill does
- Define semantic color tokens
- Specify typography and spacing
- Standardize component proportions
- Define chart color palettes
- Set visual quality standards
Inputs
- Assessment output artifacts
- Rendering context
Outputs
- Styled interactive CP artifacts
- Styled HTML/PDF reports
- Consistent visual identity
Requirements
- React 18
- Tailwind
- Shadcn
- Recharts
- Self-contained HTML
- Chart.js
- Inter font via Google Fonts CDN