jakubkrehel

Design engineering principles for making interfaces feel polished. Use when building UI components, reviewing frontend code, implementing animations, hover states, shadows, borders, typography, icons, micro-interactions, enter/exit animations, or any visual detail work. Supports quick and full review modes. Triggers on UI polish, design details, "make it feel better", "feels off", stagger animations, border radius, optical alignment, font smoothing, tabular numbers, image outlines, box shadows, icons, icon stroke weight, icon states, motion restraint.

Polishes surfaces, icons and motion with exact values for border radius, optical alignment, shadows, icon states and animation.

Sets and reviews how text renders, from the type scale and spacing to font features, wrapping, truncation and punctuation.

Builds and checks color systems by generating palettes, naming semantic tokens, converting between formats and measuring contrast.

Sets grouping, alignment, reading order, responsive structure and room for translated text, so a layout holds up when it is resized, translated or mirrored.

Reviews a screen, flow or whole interface across accessibility, layout, writing, typography, color and UI polish, and returns one ranked report.

Reviews and fixes keyboard and focus behavior, ARIA, accessible names, forms, screen-reader announcements, motion and zoom against WCAG 2.2.

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.

Reviews a branch, pull request or uncommitted change for the interface problems it introduced or regressed, across accessibility, layout, writing, typography, color and UI.

Builds multiple variants of a component you're working on and helps you iterate and pick one.

Explains how a website, a visual effect or an animation was built, from a live URL or a screenshot.

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

OKLCH color space for web projects. Convert hex/rgb/hsl to oklch, generate palettes, check contrast, handle gamut boundaries, and theme with Tailwind v4. Triggers on oklch, color conversion, palette generation, contrast ratio, gamut, display p3, design tokens, hue drift, chroma, dark mode colors.

Renders every state of a component you choose on a throwaway page, with mock data and a switcher, so you can work on each state.

Builds UI from a Figma file or a design image so it matches the design, using the project's existing tokens and components.

Creates precise static technical drawings of physical objects, with coherent views and fine linework.

Creates technical illustrations of physical objects and of how things work, such as display pixels or interface layers, with coherent views, fine linework and part fills.