Typography-first SaaS UI/UX workflow for internal product screens and components. Use when designing or refactoring dashboards, settings pages, editors, builders, tables, or modals where typography hierarchy, flex/grid layout, spacing rhythm, and premium neutral surfaces need to be the main organizing system. Also use when a UI feels cramped, visually noisy, misaligned, or inconsistent.
Installation
Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.
Typography-first SaaS UI/UX workflow for internal product screens and components. Use when designing or refactoring dashboards, settings pages, editors, builders, tables, or modals where typography hierarchy, flex/grid layout, spacing rhythm, and premium neutral surfaces need to be the main organizing system. Also use when a UI feels cramped, visually noisy, misaligned, or inconsistent.
SaaS UI UX Designer Skill Typography Flex
Overview
Use this skill to design calm, premium SaaS UI where typography and flex/grid layout carry the hierarchy. Favor readable product structure over decorative styling.
Workflow
Define the screen purpose, main action, and primary vs secondary zones.
Start with layout first:
flex vs grid
sticky vs flowing regions
main vs supporting panels
desktop vs mobile stacking
Establish typography hierarchy before decoration.
Apply neutral surfaces, restrained accent use, and consistent card rhythm.
