better-ui

Topics in the source

• UI polish
• Concentric border radius
• Optical over geometric alignment
• Shadows for elevation, borders for structure
• Interruptible animations
• Split and stagger enter animations
• Subtle exit animations
• Contextual icon animations

Exact values for the small details that make an interface feel finished. Ported from jakubkrehel/skills better-ui (MIT). Use the numbers written here. When reviewing, slow the interface down. What feels off at 10% speed is what is subtly wrong at full speed. Keep the project's component library, tokens, and density, and match its motion language except where a rule below prescribes an exact interaction. Every duration, curve, scale, and blur below is a specific value, not a range to approximate. cubic-bezier(0.2, 0, 0, 1) is not cubic-bezier(0.4, 0, 0.2, 1), and 0.96 is not 0.95. Use what is written. Text wrapping, font rendering, tabular numbers, spacing, breakpoints, hit areas, focus, keyboard support, ARIA, and reduced motion belong to vd:uiuxdesign. Whether a motion should exist, which easing family to use, and how popovers, drawers, and drags behave belong to vd:design-eng. Posting review comments on a pull request belongs to vd:code-review. This skill owns the polish values and the polish-pass report. When both load, the numbers in this file win. Outer radius = inner radius + padding. Mismatched radii on nested elements is the most common thing that makes an interface feel of

This is an excerpt. Refer to the complete source and its current requirements.