taste-clean

name	taste-clean
description	Create sparse, matte, neutral compositions driven by oversized sans-serif hierarchy, generous empty space, strict alignment, soft rounded geometry, restrained value contrast, and isolated compact color.

taste-clean

Use this skill when

Use this skill when the work should rely on visible structure instead of decoration: large blank fields, strict typographic hierarchy, pale matte surfaces, soft rounded shapes, compact color accents, and disciplined spacing.

Apply it across interfaces, posters, covers, dashboards, documents, product pages, packaging, presentations, brand assets, and illustration-supported layouts only when the requested medium can support sparse structure, rounded geometry, restrained color, and neutral sans-serif typography.

Do not assume the output is a mobile app, dashboard, poster, or brand system unless the user asks for that medium. Transfer the visual system through spacing, type scale, value, alignment, color restraint, and soft geometry.

Core directive

Build the composition from a small number of large zones on a white, off-white, or very pale gray field. Make empty space an intentional, dominant element. Use one neutral sans-serif family, abrupt type-scale jumps, black or near-black anchors, pale secondary information, soft rounded containers, and at most one compact saturated accent hue.

Establish hierarchy in this order:

1. Scale.
2. Weight.
3. Value.
4. Opacity.
5. Spacing.
6. Alignment.
7. Color only after the previous tools are already working.

Preserve one strong focal peak per composition. Make it one of these:

• Oversized typographic mass.
• Decisive black or near-black mark.
• Dark terminal block.
• Isolated accent control.
• Single saturated rounded panel.

Do not add secondary focal systems. Do not decorate the void. Do not use style stereotypes such as luxury, futuristic, wellness, productivity, commerce, or operating-system visuals as the source of the look.

Visual grammar

Use these defaults:

• Dominant field: white, off-white, or very pale gray.
• Palette: 3–6 neutral values: white/off-white, pale gray, medium gray, charcoal, near-black, black.
• Accent color: one saturated hue at most, used as a compact punctuation mark, one selected state, one badge/control, or one isolated focal surface.
• Accent area: keep saturated color below roughly 10% of the visible interior area unless it is one deliberate focal rounded panel.
• Surfaces: smooth, matte, nearly textureless, defined by pale fills, tonal stepping, overlap, silhouette, spacing, and rare diffuse shadow.
• Shape language: rounded rectangles, capsules, pills, rounded squares, and circles.
• Corner radius: visibly soft and proportional to object scale.
  • Largest sheets: exaggerated radii.
  • Medium cards: medium radii.
  • Small controls and icon blocks: smaller radii.
  • Pills: fully rounded ends.
• Density: low to medium overall.
• Dense repetition: allow it only inside one bounded module such as a bottom tile grid, list block, keypad-like block, or row module.
• Icons: simple, geometric, rounded, filled or thick-stroked, subordinate to type.
• Depth: use layering, overlap, cropping, opacity, tonal separation, and large-radius silhouettes before shadows.

Keep the system architectural. Use broad panels and rounded fields as structural planes, not decorative boxes.

Composition and layout

Use large zones instead of scattered elements. Valid zones include:

• Open field.
• Typographic mass.
• Sheet or card plane.
• List block.
• Bounded dense module.
• Bottom action bar.
• Rounded tile field.
• Dark cap or frame.
• Isolated accent panel.

Keep broad outer gutters. Keep generous internal padding. Do not let text, icons, chips, or tiles crowd container edges.

Make inter-section spacing larger than spacing inside a card, row, chip, or control. Preserve large vertical pauses between hierarchy levels, especially between oversized type and lower controls or row modules.

Use alignment based on structure:

• Use a centered vertical axis only for ceremonial stacks.
  • Valid stack: faint upper mark or label, dominant type mass, lower pill/control/action.
  • Use center-aligned multi-line type only when the whole composition follows this central axis.
• Use strict left alignment for lists, editorial structures, dashboards, product information, documents, row modules, and scanning layouts.
• When combining both, place a centered upper hierarchy above a left-aligned modular lower area. Separate them with a large vertical pause.
• Use strong vertical rails in structured layouts:
  • Left marker/icon rail.
  • Primary text column.
  • Right-aligned value/control column.

For bottom-weighted layouts:

• Push the active content cluster into the lower portion of the frame.
• Leave the upper half or upper majority quiet.
• Do not rebalance the upper void with icons, labels, metadata, patterns, navigation, or decorative imagery.
• Use bottom anchors as wide rounded pills, dense rounded rectangles, near-full-width action bars, pale capsules, or black rounded terminal blocks.
• Stop bottom anchors short of the outer edge unless deliberately cropped.

For lists:

• Use tall, breathable rows.
• Use consistent rails, row heights, spacing, size, and radius.
• Use a left icon/mark or fixed visual container, middle primary label/text stack, and right value/control/badge.
• Keep the space between rows larger than the gap between primary and secondary text within a row.
• Do not wrap every row in its own bordered card by default.
• Use alignment, spacing, value, opacity, and pale grouping surfaces instead of heavy containers.
• Use dotted or dashed hairline separators only when rhythm is needed; keep them faint.
• Avoid solid dark dividers inside pale sparse systems.

For tile and control modules:

• Keep repeated tiles equal in size, radius, gap, and alignment.
• Use center icons above labels inside equal-width pictogram-caption tiles.
• Use circle / pill / circle rhythms for compact symmetrical control rows.
• Confine dense repeated modules to one bounded zone.

For cropping and disruption:

• Permit one controlled disruption per composition, such as one cropped card, one lateral offset, one selected outline, one truncated type element, or one saturated badge.
• Make cropping deliberate. A major surface may extend beyond the viewport.
• Do not accidentally clip primary text unless truncated typography is the intended graphic device.
• Do not crop multiple unrelated elements.

For banded compositions:

• Separate horizontal bands by value and density, such as dark cap, white open plane, pale-gray dense base.
• When a white foreground sheet rises over a dark field, use a hard tonal boundary with oversized rounded corners. Do not use a gradient fade.

Typography and lettering

Use one clean neutral sans-serif family. Do not use multiple typefaces to create hierarchy.

Create typographic variety through:

• Size.
• Weight.
• Value.
• Opacity.
• Line spacing.
• Alignment.

Use oversized bold or heavy sans-serif type as a primary visual mass when typography leads the composition. Treat large numerals, short words, headlines, and wordforms as architectural shapes.

Use abrupt type-scale jumps:

• Pair tiny labels, captions, peripheral marks, or microcopy with very large display type.
• Avoid unnecessary middle-tier sizes when a binary hierarchy is intended.
• Use very large secondary words if needed, but lower their importance through pale gray value, reduced opacity, or lighter weight.

Use color and value in type this way:

• Use black or near-black for primary display type, decisive row anchors, and scan anchors.
• Use pale gray, medium gray, or reduced opacity for secondary text, ghosted typographic layers, support phrases, inactive labels, captions, and atmospheric background text.
• Do not make all text equally dark.
• Do not make all secondary information tiny by default. Lower contrast can be more important than shrinking.

Use alignment correctly:

• Center multi-line type only in central-axis ceremonial stacks.
• Left-align multi-line type for lists, dashboards, documents, editorial layouts, product information, and bottom-anchored content.
• Align baselines in rows.
• Control text widths.
• Preserve consistent rails and repeated row heights.

Allowed typographic emphasis:

• Scale jump.
• Weight change.
• Value shift.
• Opacity shift.
• Word-level value shifts inside oversized type while keeping the same type family and size system.

Forbidden typographic emphasis:

• Serif display type.
• Script lettering.
• Retro condensed type.
• Italics as style.
• Ornamental casing systems.
• Decorative type effects.
• Outlines.
• Drop shadows.
• Gradients.
• Decorative strokes.
• Distortion.

Use tiny pale labels, ghosted marks, and low-contrast captions as subordinate structure. Do not let them become extra focal points.

Use compact circular marks, black filled circles, dense black glyphs, or near-black icon marks only as compositional stops. Do not scatter them as decoration.

Color and value

Use a narrow neutral palette by default:

• White.
• Off-white.
• Very pale gray.
• Pale gray.
• Medium gray.
• Charcoal.
• Near-black.
• Black.

Keep most compositions high-key. The dominant surface must be white, off-white, or very pale gray unless the design intentionally uses:

• A dark cap.
• A dark outer frame.
• One controlled colored focal panel.
• A hard dark field behind a pale sheet.

Keep most surface differences subtle. Pale cards and panels should sit only one or two value steps away from the ground.

Reserve darkest values for:

• Primary type.
• Key marks.
• Selected inverse states.
• Terminal action blocks.
• Dark caps or frames.

In high-key compositions, allow only 1–3 elements to reach deep black or charcoal.

Use saturated color with strict limits:

• Use at most one main saturated accent hue.
• Keep accent color compact and isolated.
• Do not distribute accent color evenly across rows, chips, icons, tabs, or modules.
• Do not create rainbow accents, multicolor category coding, or colorful default interface palettes.
• A second accent hue is allowed only as a tiny counter-accent dot, icon, or isolated mark.

Supported accent roles:

• Tiny dot.
• Small circular mark.
• Compact icon.
• Badge.
• Selected chip.
• One action button.
• One isolated rounded focal surface.

Supported accent families:

• Saturated blue.
• Electric purple.
• Green.
• Red or coral.
• Warm yellow.
• Orange.
• Oxblood.

If using one saturated focal panel, surround it with neutral low-contrast elements so the color field reads as singular.

For selected and inactive states:

• Inactive chips and controls: white or pale surfaces, hairline outlines, low-contrast borders, pale fills, or reduced opacity.
• Selected states: solid black, near-black, saturated fill with reversed light text, quiet pale value shift, outline shift, or bolder type.
• Prefer value, opacity, fill, outline, and type-weight changes before adding new colors.
• Reduce opacity across an entire inactive row or unit rather than inventing a new color treatment.

For dark-background zones:

• Use white for primary type.
• Use muted gray for secondary type.
• Keep the boundary between dark and light surfaces decisive and high contrast.
• Do not use gradients to transition between dark field and pale sheet.

Imagery, shape, texture, and material

Use rounded geometry as the main shape system:

• Rounded rectangles.
• Capsules.
• Pills.
• Circles.
• Rounded squares.

Avoid hard rectangular corners on primary surfaces, cards, panels, sheets, buttons, chips, tiles, image frames, and controls.

Repeat the same rounded geometry across:

• Panels.
• Tiles.
• Handles.
• Buttons.
• Icon containers.
• Selected states.
• Bottom bars.
• Chips.
• Marks.

Define surfaces through:

• Pale filled areas.
• Tonal stepping.
• Overlap.
• Silhouette.
• Spacing.
• Rare pale borders.
• Occasional broad low-opacity shadows.

Do not use high-contrast outlines as a general border system. Use borders only as thin, pale, rare accents for inactive chips, quiet secondary anchors, or delicate selected states.

Use dotted or dashed hairline separators only as faint cadence or texture. Do not convert them into solid dark rules.

Keep material treatment flat:

• Matte.
• Smooth.
• High-resolution.
• Nearly textureless.

Do not add:

• Visible grain.
• Paper texture.
• Noisy overlays.
• Confetti.
• Decorative patterns.
• Abstract background blobs.
• Glossy gradients.
• Internal glass effects.
• Bevels.
• Plastic shine.
• Glow.
• Chrome.
• Neumorphic swelling.
• Heavy skeuomorphic depth.
• Heavy cast shadows.

Use shadows only when needed to clarify elevation or contact. If used, make them diffuse, broad, low-opacity, and secondary to tonal separation.

Use nested containment sparingly and clearly:

• White ground.
• Near-white panel.
• Pale-gray card.
• White inner tile.
• Smaller pill, control, or mark.

For imagery:

• Keep photographic, pictorial, or textured imagery muted, cropped, low-contrast, and subordinate.
• Contain images inside rounded tiles, pale rounded-square frames, or soft containers.
• Center small images inside larger pale frames so detailed content reads as a curated object, not the main driver.
• Normalize thumbnails and image-bearing blocks to identical size, radius, and alignment.
• Keep image thumbnails smaller than their containing frames, leaving internal breathing space.
• Do not let photos, portraits, thumbnails, or decorative illustrations dominate unless the user explicitly requests image-led work.

If frosted or translucent pale layers appear, use them sparingly as atmospheric background entries or quiet control groups. Do not turn the system into full glassmorphism.

Content and subject treatment

Let the aesthetic come from structure, not from subject matter.

Use transferable visual roles:

• Hero headline.
• Small label.
• Row item.
• Icon rail.
• Value column.
• Badge.
• Selected state.
• Bottom anchor.
• Pale card.
• Rounded tile.
• Dark mark.
• Accent dot.
• Focal rounded panel.
• Quiet caption.
• Dense bounded module.

Do not depend on exact words, dates, prices, percentages, file names, icon meanings, brand names, app categories, workflows, or domain stereotypes to create the style.

When copy is generic or user-supplied:

• Preserve typographic scale.
• Preserve alignment.
• Preserve value hierarchy.
• Preserve spacing.
• Preserve soft geometry.
• Keep labels and captions short, quiet, and subordinate unless the user asks for text-led content.
• Use short lines, controlled widths, and ample pauses.
• Avoid dense copy blocks except inside one bounded module.

Treat icons as abstract glyphs or structural marks unless semantic accuracy is required by the task. Do not use the meaning of arrows, stars, calendars, files, playback controls, check marks, moons, suns, plants, clouds, media symbols, or similar icons as style rules.

Do not add functional interface chrome, badges, notifications, tabs, charts, filters, status bars, widgets, or controls unless the requested medium and content require them.

If rows, chips, controls, or modules appear, their exact quantity may change. Preserve their spacing, alignment, tonal hierarchy, radius, and containment behavior.

If brand assets are requested, do not invent crests, laurels, sparkles, ornamental emblems, or complex logos unless explicitly requested. Use simple geometric marks, type scale, value contrast, pale fields, and isolated chromatic punctuation.

Medium-specific rules

For interface screens:

• Use pale matte surfaces, broad gutters, large-radius panels, clear alignment rails, and restrained controls.
• Keep secondary navigation small, pale, edge-placed, and subordinate.
• Do not let navigation compete with hero type or primary actions.
• Do not add status bars, notches, home indicators, device hardware, or platform chrome as required style elements.

For interface lists:

• Use tall repeated rows.
• Use a left mark/icon zone, middle text stack, and right value/control zone.
• Keep rows breathable.
• Avoid wrapping every row in a bordered card.

For chips and badges:

• Use fully rounded pills.
• Use generous horizontal padding.
• Make inactive states pale or white with hairline outlines, low-contrast borders, pale fills, or reduced opacity.
• Make selected states solid black, saturated fill, quiet pale value shift, outline shift, or bolder type.

For action bars and bottom bars:

• Use near-full-width rounded rectangles or capsules pinned near the bottom.
• Stop them short of the edge unless deliberately cropped.
• Use dense rounded black blocks, pale gray capsules, or controlled circle/pill/circle arrangements depending on hierarchy.

For dashboards:

• Do not use dense default analytics layouts.
• Use a few large zones, oversized type anchors, pale grouped cards, and one bounded denser module.
• Use charts or values only if requested.
• When charts appear, render them with pale lines, restrained marks, and strict alignment instead of colorful chart defaults.

For posters and covers:

• Let one oversized sans-serif word, numeral, or short headline dominate.
• Use large white, off-white, or very pale gray fields.
• Add at most one small accent mark or decisive dark stop.

For editorial layouts and documents:

• Use strict left rails.
• Use dramatic type scale jumps.
• Use broad margins.
• Use pale dividers only if needed.
• Build sparse modular sections.

For product pages:

• Use one large type or product-information hierarchy.
• Use pale rounded image containers.
• Keep imagery muted.
• Use restrained accent controls.

For brand assets:

• Use simple geometric marks.
• Use black or near-black type.
• Use pale fields.
• Use isolated chromatic punctuation.
• Do not use ornate logos or decorative identities unless requested.

For packaging:

• Use large blank fields.
• Use bold sans-serif typographic mass.
• Use soft rounded label blocks.
• Use one compact accent mark.

For presentations:

• Use one idea per slide.
• Use large type.
• Use wide margins.
• Use few modules.
• Use pale tonal grouping.
• Use minimal accent color.

For illustration-supported layouts:

• Keep illustration contained, low-detail, rounded, muted, and subordinate to type and spacing.

For dark-background compositions:

• Use a hard contrast between dark cap/field and white sheet/card.
• Use muted secondary text.
• Avoid gradients.

For dense control modules such as keypads or tile grids:

• Place them in one bottom or bounded zone.
• Use uniform rounded rectangles.
• Keep gaps consistent.

For media containing thumbnails or images:

• Normalize all image containers to the same size, radius, and alignment.
• Keep image color low-contrast.
• Keep imagery subordinate to typography, spacing, and shape.

Forbidden shortcuts

Do not use vague instructions as visual decisions. Translate every request into concrete choices of field, spacing, type, value, alignment, radius, surface, and accent placement.

Do not add:

• Gold.
• Metallic gradients.
• Marble.
• Jewels.
• Luxury props.
• Ornamental flourishes.
• Brand-fashion styling.
• Glassmorphism.
• Glossy glare.
• Lens flares.
• Neon glows.
• Holograms.
• Sci-fi grids.
• Chrome.
• Generic futuristic effects.
• Heavy drop shadows.
• Stacked elevation.
• Bevels.
• Neumorphic depth.
• Glossy buttons.
• Skeuomorphic controls.
• Decorative gradients.
• Patterns.
• Abstract blobs.
• Grain.
• Confetti.
• Decorative illustrations.
• Extra metadata.
• Extra controls.

Do not replace the restrained palette with colorful default UI colors.

Do not create:

• Multicolor icon sets.
• Rainbow category systems.
• Saturated colors on every row, chip, tab, or module.
• Thick black outline systems.
• Solid dark dividers inside pale sparse layouts.
• Every object as a bordered card.
• Hard industrial rectangular primary containers.
• Mild default corner rounding on major surfaces.
• Dense dashboard defaults unless explicitly required.
• Chaotic clipping across unrelated elements.
• Platform-specific chrome unless requested.
• App-specific workflow widgets unless requested.
• Ornamental emblems unless requested.

Do not fill white or dark voids. Treat large blank areas as required compositional mass.

Do not reduce the system to generic minimalism by removing hierarchy. This visual system requires decisive black or near-black anchors, oversized type or strong row hierarchy, precise alignment, broad spacing, restrained color, and visibly soft geometry.

Generation checklist

Before finishing, verify each point:

1. Use white, off-white, or very pale gray as the dominant field unless a bounded dark field or single focal color plane is intentional.
2. Leave empty space visibly present. Do not fill it with decoration, extra labels, patterns, or controls.
3. Use mostly 3–6 neutral values.
4. Use no more than one main saturated accent hue.
5. Keep chromatic color compact and below roughly 10% of the interior area unless it is one deliberate focal rounded panel.
6. Reserve black or near-black for primary type, decisive marks, selected inverse states, dark caps, or terminal anchors.
7. Build hierarchy through scale, weight, value, opacity, spacing, and alignment before color.
8. Use one neutral sans-serif system.
9. Exclude decorative, serif, script, italic, retro, condensed, distorted, outlined, shadowed, or gradient type effects.
10. Include a clear typographic hierarchy: large display mass, strong primary row anchors, or decisive black headline.
11. Make secondary text lower contrast, lighter weight, or reduced opacity compared with primary text.
12. Use a central axis only for ceremonial stacks.
13. Use left rails for lists, documents, dashboards, product information, and structured content.
14. Build from a few large zones, not many scattered objects.
15. Keep outer gutters broad.
16. Keep internal padding generous.
17. Keep rows, chips, tiles, and cards breathable.
18. Use rounded rectangles, capsules, pills, rounded squares, and circles consistently.
19. Scale radii visibly with object size.
20. Keep borders rare, thin, and pale.
21. Use dividers only as faint dotted/dashed hairlines or very pale separators.
22. Use shadows only as broad, diffuse, low-opacity support.
23. Keep surfaces matte, smooth, and nearly textureless.
24. Exclude gloss, bevels, glows, chrome, grain, noisy texture, and heavy skeuomorphic depth.
25. Make icons simple, geometric, optically aligned, and subordinate to type.
26. Keep images muted, rounded, contained, and subordinate if images are present.
27. Confine dense repetition to one bounded zone.
28. Limit cropping to one controlled disruption or one major surface.
29. Make bottom anchors wide rounded pills or rounded blocks that stop short of the edge unless intentionally cropped.
30. Keep dark fields or frames as hard-contrast planes around flat pale interiors.
31. Do not introduce unsupported luxury, glass, neon, rainbow, decorative, or platform-default shortcuts.
32. Do not depend on exact copy, app category, icon meaning, device hardware, or workflow semantics for the aesthetic.
33. Confirm the result remains transferable across media through structure, spacing, type, value, color restraint, matte material, and rounded geometry.