MMCPMarkets
JS

jakubkrehel/skills

Developer tools

이 페이지는 AI로 자동 번역되었습니다. 기술적인 세부 사항은 원문을 확인하세요. 원문 보기

1.1만 stars 품질 73 트렌드 95MIT
Repository Install

jakubkrehel/스킬은 [[T0]에서 가져온 에이전트 스킬 후보입니다.

개요

jakubkrehel/스킬은 [[T0]에서 가져온 에이전트 스킬 후보입니다.

개요(AI 번역)

UI, 타이포그래피, 색상, 접근성, 레이아웃, 제품 작성 등을 아우르는 에이전트 기술 모음으로, 훌륭한 인터페이스를 구축하는 데 도움을 줍니다.

이 기술들은 제가 개인 웹사이트와 디자인 엔지니어링 잡지 Interfaces에 글을 쓰는 주제들을 포함합니다.

훌륭한 인터페이스를 만드는 데 도움이 되는 기술

  • better-interface: 접근성, 레이아웃, 글쓰기, 타이포그래피, 색상, UI 광택 등 모든 better-* 기술을 하나의 리뷰로 통합합니다.
  • better-ui: 프로젝트 내 표면, 아이콘, 움직임을 테두리 반경, 광학 정렬, 그림자, 아이콘 상태, 애니메이션에 대한 정확한 값으로 다듬어줍니다.
  • better-typography: 제품 내 텍스트 렌더링 방식을 설정하고 검토하며, 타입 축척과 간격부터 글꼴 특징, 감싸기, 절단, 구두점까지 포함합니다.
  • better-colors: 프로젝트에 맞는 색상 시스템을 구축하고 점검하는 데 도움을 줍니다. 팔레트 생성**, 의미 토큰 이름 지정, 형식 변환 및 대비 측정 기능을 수행합니다.

이 페이지는 AI로 자동 번역되었습니다. 기술적인 세부 사항은 원문을 확인하세요.

README

원문 README의 일부입니다. 원문 보기.

A collection of agent skills that cover UI, typography, colors, accessibility, layout, product writing and help you build a great interface.

These skills cover topics that I write about on my personal website and my design engineering magazine, Interfaces.

Skills that help build great interfaces

  • better-interface: Reviews a screen, flow or whole interface across accessibility, layout, writing, typography, color and UI polish, and returns one ranked report.
  • better-ui: Polishes surfaces, icons and motion with exact values for border radius, optical alignment, shadows, icon states and animation.
  • better-typography: Sets and reviews how text renders, from the type scale and spacing to font features, wrapping, truncation and punctuation.
  • better-colors: Builds and checks color systems by generating palettes, naming semantic tokens, converting between formats and measuring contrast.
  • better-accessibility: Reviews and fixes keyboard and focus behavior, ARIA, accessible names, forms, screen-reader announcements, motion and zoom against WCAG 2.2.
  • better-layout: Sets grouping, alignment, reading order, responsive structure and room for translated text, so a layout holds up when it is resized, translated or mirrored.
  • better-writing: Writes and reviews interface copy, from labels and errors to empty states and confirmations, so it matches the product’s voice and tells people what to do next.
  • interface-review: Reviews a branch, pull request or uncommitted change for the interface problems it introduced or regressed, across accessibility, layout, writing, typography, color and UI. User-invoked.
  • explain-interface: Explains how a website, a visual effect or an animation was built, from a live URL or a screenshot. User-invoked.
  • break: Renders a component you choose under every scenario that can reach it on a temporary page and stress tests it. User-invoked.
  • build-design: Builds UI from a Figma file or a design image so it matches the design, using the project’s existing tokens and components.
GitHub에서 전체 README 보기

추천 도구

다른 키워드를 입력하거나 필터를 제거해 보세요.

설치

npx skillfish add jakubkrehel/skills
MCP 초보자라면? mcpskill.org 가이드부터 시작하세요 →