Install
Install from the original repository with the author’s command. Choose the skills and agent supported by your environment in the installer; related workflows can require other skills from the same repository.
Install the repository
Run this in a terminal.
npx skills add jakubkrehel/skills
Exploded technical illustration of a hard disk drive, with its cover, head assembly, platters, enclosure and circuit board.
Projekt-ScreenshotsÜber diesen Skill
A collection of 14 agent skills for interface reviews, UI implementation, component testing and technical illustration.
Warum wir es empfehlen
An external listing linking to the author’s MIT-licensed repository.
Skills in dieser Sammlung
14 Skills- Ansehen →
Better Accessibility
Review keyboard focus, ARIA, forms, screen readers, motion and zoom against WCAG 2.2.
- Ansehen →
Better Colors
Build and audit palettes, semantic color tokens and measured contrast.
- Ansehen →
Better Interface
Review a screen or flow across accessibility, layout, copy, typography, color and UI polish.
- Ansehen →
Better Layout
Review grouping, alignment, reading order and responsive layouts.
- Ansehen →
Better Typography
Set and review type scales, spacing, font features and text wrapping.
- Ansehen →
Better UI
Polish interface surfaces, icons and motion using the existing UI system.
- Ansehen →
Better Writing
Write and review interface labels, errors, empty states and confirmations.
- Ansehen →
Break: Component Stress Test
Render a chosen component in a temporary page under relevant stress scenarios.
- Ansehen →
Build Design
Implement UI from Figma or an image with the project’s existing components and tokens.
- Ansehen →
Explain Interface
Explain how a website, visual effect or animation works from a URL or screenshot.
- Ansehen →
Interface Review
Review a branch, pull request or uncommitted change for introduced UI regressions.
- Ansehen →
State Machine: Component States
Render a component’s states on a temporary page with mock data and a switcher.
- Ansehen →
Teardown: Technical Illustrations
Create technical illustrations with coherent views and an interactive export page.
- Ansehen →
Variant: UI Alternatives
Build multiple component variants in the real page and compare their tradeoffs.
Wobei es hilft
- Review and refine an existing product interface or implement a design in its codebase.
- Test component scenarios, compare alternatives or explain a visual effect.
Cover illustration
The cover is the supplied hard-drive teardown SVG from the author’s website, rasterized on white and compressed for this listing.
Vor der Nutzung
- An agent that can load SKILL.md files and access the relevant project. Browser-based checks need an available browser; report checks that could not be performed.
- Figma links in Build Design require a connected Figma MCP. Some review workflows use other skills in this repository.
Unterstützte Agents
Quellen und Referenzen
Die Originalquellen sind unten verlinkt. Praktische Einstiegsideen sind redaktionelle Vorschläge von SkillHey.
