design-check
Audit UI code against the Mediatheca design system. Checks F# (Fable/Feliz) view files and CSS for violations of glassmorphism rules, typography hierarchy, theme tokens, DesignSystem.fs usage, backdrop-filter nesting, spacing/layout conventions, animation standards, and DaisyUI 5 patterns. Use when the user asks to "design check", "check design", "audit styles", "review UI code", "check glassmorphism", or any request to verify UI code follows the design system.
99
100%
Does it follow best practices?
Impact
99%
2.82xAverage score across 3 eval scenarios
Passed
No known issues
Evaluation results
99%
67%Design Audit: Movie Detail Panel
Glassmorphism and backdrop-filter nesting
Modal opaque background flagged
0%
100%
Glass class suggested for modal
0%
100%
Backdrop-filter nesting flagged
100%
100%
Nesting fix described
100%
100%
Dropdown glass class suggested
0%
100%
Missing modal backdrop-filter noted
0%
100%
Missing inset highlight noted
0%
87%
DaisyUI 4 pattern flagged
0%
100%
Severity correctly classified
0%
100%
Report format correct
80%
100%
100%
67%Design Audit: Search Results View
Typography, color tokens, and DesignSystem helpers
Hardcoded gray-100 flagged
100%
100%
Hardcoded gray-400 flagged
100%
100%
Disallowed opacity /60 flagged
0%
100%
Missing heading font-display flagged
0%
100%
Missing uppercase/tracking-wider on h1 flagged
0%
100%
pageTitle helper suggested for h1
0%
100%
cardTitle or sectionHeader suggested for h3
0%
100%
Hardcoded padding flagged
0%
100%
Badge reimplementation flagged
0%
100%
Raw Tailwind pill flagged
50%
100%
Report format correct
80%
100%
100%
60%Design Audit: Media Catalog Browse Page
Responsive grids, animations, and DaisyUI 5 patterns
Non-responsive poster grid flagged
100%
100%
Correct poster grid columns specified
37%
100%
movieGrid helper suggested
0%
100%
Stats grid violation flagged
100%
100%
statsGrid helper suggested
0%
100%
Inline transition style flagged
100%
100%
Non-standard animation duration flagged
62%
100%
Missing entrance animations flagged
0%
100%
DaisyUI 4 button pattern flagged
0%
100%
DaisyUI 4 loading pattern flagged
0%
100%
Missing poster shadow flagged
0%
100%
- Repository
- heimeshoff/Mediatheca
- Commit
38245b8
- Evaluated
- Agent
- Claude Code
- Model
- Claude Sonnet 4.6
Table of Contents
Is this your skill?
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.