Collection · published

Jakub Krehel — practical interface design skills

Jakub Krehel — practical interface design skills. Repository install documented for the set.

Shared by Jakub Krehel · View source

npx skills add jakubkrehel/skills

In this collection

• better-accessibility
  Checks keyboard, screen-reader, form, motion, and zoom behavior against accessibility standards.

  /better-accessibility in Claude Code after a direct install

  Source
• better-colors
  Creates semantic color palettes and evaluates them for consistency and readable contrast.

  /better-colors in Claude Code after a direct install

  Source
• better-interface
  Evaluates screens and user flows across accessibility, layout, copy, typography, color, and visual polish.

  /better-interface in Claude Code after a direct install

  Source
• better-layout
  Refines grouping, reading order, responsiveness, and translation support across screen sizes.

  /better-layout in Claude Code after a direct install

  Source
• better-typography
  Improves type scale, spacing, font features, wrapping, and truncation for readable interfaces.

  /better-typography in Claude Code after a direct install

  Source
• better-ui
  Polishes interface details such as icons, surfaces, shadows, and motion with concrete design values.

  /better-ui in Claude Code after a direct install

  Source
• better-writing
  Makes interface messages clearer and more useful across labels, errors, empty states, and confirmations.

  /better-writing in Claude Code after a direct install

  Source
• break
  Renders a component you choose under every scenario that can reach it on a temporary page and stress tests it.

  /break in Claude Code after a direct install

  Source
• build-design
  Turns a visual reference into interface code while respecting the project’s existing components and tokens.

  /build-design in Claude Code after a direct install

  Source
• explain-interface
  Explains how a site or visual effect works using a live page or screenshot as evidence.

  /explain-interface in Claude Code after a direct install

  Source
• interface-review
  Finds interface regressions in a branch or change across accessibility and visual design concerns.

  /interface-review in Claude Code after a direct install

  Source
• state-machine
  Displays every component state with mock data so teams can inspect edge cases in context.

  /state-machine in Claude Code after a direct install

  Source
• teardown
  Creates technical illustrations that show how physical objects and interface components are put together.

  /teardown in Claude Code after a direct install

  Source
• variant
  Creates and compares multiple component directions to help select the strongest design.

  /variant in Claude Code after a direct install

  Source

Sharing note: Source collection: Jakub Krehel. Repository install documented for the set.