Layout
Active negative space
Empty space surrounds important elements and directs attention instead of filling the page.
SkillCodexOpen favorites and history
Established movement
Very few elements, generous negative space, and deliberate typographic hierarchy.
Also called: minimalist design, minimal web design
Definition and scope
Minimalism governs what remains on screen. It removes secondary functions, ornament, and messages until every remaining element has a clear role, then uses negative space to organize attention.
Scope: Minimalism concerns quantity and composition. Flat Design concerns surface rendering. A minimalist screen can retain shadows or depth, and a flat interface can remain crowded.
The four defining signals should remain visible without relying on the style name.
Layout
Empty space surrounds important elements and directs attention instead of filling the page.
Layout
Every control, message, and decoration must justify its presence.
Color
A short neutral range and one accent are enough to organize the screen.
Typography
Strong typographic hierarchy replaces much of the ornament.
Decisive difference with the closest neighbor
Understand → Recognize → Choose → Compare
Pre-written instruction by SkillCodex — your request is neither sent nor used to adapt this text; no content is generated, and copying executes nothing.
implementation
# Implement Minimalism in your agent ## Objective Create a minimalist interface around one primary goal, one primary action, and only necessary content. Use negative space, a limited palette, and clear typographic hierarchy to guide attention. ## Prerequisites - Inspect existing components, tokens, and brand constraints. - Confirm that this style fits the surface and content. - Preserve existing structure, semantics, and interactions. ## Behavior and surfaces - Active negative space — Empty space surrounds important elements and directs attention instead of filling the page. - Restricted element count — Every control, message, and decoration must justify its presence. - Limited palette — A short neutral range and one accent are enough to organize the screen. - Structural typography — Strong typographic hierarchy replaces much of the ornament. ## States - Cover existing default, hover, focus, active, disabled, loading, and error states. - Provide a static state when reduced motion is requested. ## Accessibility - Keep labels, help, errors, and confirmations even when they increase text quantity. - Do not use spacing as the only signal for grouping or hierarchy. - Maintain recovery paths and genuinely necessary secondary actions. ## Non-goals - Removing help and error information instead of removing redundancy. - Spreading little content over a very large surface without hierarchy or intent. ## Acceptance criteria - A page with one clear primary goal and few competing decisions. - A product where content quality allows decoration and repeated explanations to be removed.
sha256:bead55549020311d367b505cc1ba02ada76d83147ef6530f2b71eb8cf3ca515e
debugging
# Debug Minimalism in your agent ## Observed symptom [DÉCRIS ICI LE SYMPTÔME] ## Observable checks - Compare the surface with the documented visual signals. - Verify contrast, focus, reduced motion, and fallback behavior. - Isolate the visual layer without changing functional structure. ## Possible causes - The style hides hierarchy or reduces contrast. - The effect is applied to too many surfaces or depends on an unavailable API. - An interactive state is no longer perceivable. ## Bounded corrections Repair this minimalism if useful information disappeared. Restore necessary labels, help, errors, and states, then simplify composition without sacrificing understanding or error recovery. ## Final verification - Keep labels, help, errors, and confirmations even when they increase text quantity. - Do not use spacing as the only signal for grouping or hierarchy. - Maintain recovery paths and genuinely necessary secondary actions.
sha256:9010df91e8746619370149854d1251fbe3d25be04476b576272d82b8d31689ed
Pack digest: sha256:e7922a9b5d25408e0e3b0d64bb4951c2bca752c50882b7ee66818ddc91c5d2ef