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.
Captures du projetÀ propos de ce Skill
A collection of 14 agent skills for interface reviews, UI implementation, component testing and technical illustration.
Pourquoi ce choix
An external listing linking to the author’s MIT-licensed repository.
Skills de cette collection
14 skills- Voir →
Better Accessibility
Review keyboard focus, ARIA, forms, screen readers, motion and zoom against WCAG 2.2.
- Voir →
Better Colors
Build and audit palettes, semantic color tokens and measured contrast.
- Voir →
Better Interface
Review a screen or flow across accessibility, layout, copy, typography, color and UI polish.
- Voir →
Better Layout
Review grouping, alignment, reading order and responsive layouts.
- Voir →
Better Typography
Set and review type scales, spacing, font features and text wrapping.
- Voir →
Better UI
Polish interface surfaces, icons and motion using the existing UI system.
- Voir →
Better Writing
Write and review interface labels, errors, empty states and confirmations.
- Voir →
Break: Component Stress Test
Render a chosen component in a temporary page under relevant stress scenarios.
- Voir →
Build Design
Implement UI from Figma or an image with the project’s existing components and tokens.
- Voir →
Explain Interface
Explain how a website, visual effect or animation works from a URL or screenshot.
- Voir →
Interface Review
Review a branch, pull request or uncommitted change for introduced UI regressions.
- Voir →
State Machine: Component States
Render a component’s states on a temporary page with mock data and a switcher.
- Voir →
Teardown: Technical Illustrations
Create technical illustrations with coherent views and an interactive export page.
- Voir →
Variant: UI Alternatives
Build multiple component variants in the real page and compare their tradeoffs.
À quoi il sert
- 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.
Avant de l’utiliser
- 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.
Agents compatibles
Sources et références
Les sources originales sont liées ci-dessous. Les pistes pratiques sont des suggestions de la rédaction de SkillHey.
