Skip to content

Commit a3134eb

Browse files
committed
docs(skill): prefer min-w over hard width for fixed-width hug controls
get_design_context already surfaces layoutSizingHorizontal FIXED + width, and the grounding guide maps FIXED→explicit, so codegen pins the width rather than collapsing a button to its content (the failure other Figma MCP servers hit). Add the finer call: Figma has no native min-width, so a designer expresses "at least this wide, but let longer/i18n text grow" as a FIXED width on a control that would otherwise hug (button/badge/chip/tag). Emit those as min-w-*, reserving a hard w-* for genuinely fixed sizes (sidebars, fixed cards, avatars).
1 parent 24dc2d6 commit a3134eb

1 file changed

Lines changed: 7 additions & 0 deletions

File tree

skills/figma-codegen/references/grounding.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,13 @@ the obvious ones. These are ordered by how easily they're silently dropped.
6969
`verticalAlign``justify-self`/`align-self`); a child with **no** `gridChild` is auto-flowed — let
7070
the grid place it. A node's own `layoutSizingHorizontal`/`Vertical` (`FILL``flex-1`/stretch,
7171
`HUG`→fit-content, `FIXED`→explicit) + `layoutGrow` + `layoutAlign` decide how it fills its parent.
72+
A `FIXED` size is real intent, not the measured content size — emit it, don't let the element
73+
collapse to its content (e.g. a shadcn `Button` defaults to content width; a `FIXED` 220px button
74+
needs the width pinned or it comes out too narrow). **But on a control that would otherwise hug its
75+
content — a button/badge/chip/tag (auto-layout + a `FILL`/`layoutGrow` text child) whose `FIXED`
76+
width exceeds its content — prefer `min-w-*` over a hard `w-*`**: Figma has no native min-width, so a
77+
designer expresses "at least this wide, but let longer/i18n text grow" as `FIXED`. Reserve a hard
78+
`w-*` for things that are genuinely a fixed size (sidebars, fixed cards, avatars).
7279

7380
## Large designs: build section by section, and ground every section
7481

0 commit comments

Comments
 (0)