The Design inspector composes only the property groups valid for the current visual-file selection. MCP get-style and update-style address the same stored style layers through a structured schema; unsupported fields can be dropped or warned rather than becoming arbitrary CSS.
Family: Position and stacking · Representative properties: position, top/right/bottom/left, z-index, order
Family: Size · Representative properties: width/height, min/max, aspect ratio, fixed/fill/relative/fit/max/auto/viewport/dynamic modes
Family: Layout · Representative properties: block/flex/grid, direction/wrap, gap/gap axes, padding, margin, alignment/justification, flex basis/shrink, grid row/column
Family: Overflow and interaction · Representative properties: overflow, pointer events, cursor
Family: Surface · Representative properties: background color/gradient/image/clip/repeat/size/position, opacity
Family: Border and corners · Representative properties: all/side borders, radius, corner shape
Family: Effects · Representative properties: box shadow, filter, backdrop filter
Family: Typography · Representative properties: font family/Template, size, weight/style, line/letter/word spacing, indentation, white space, word break, align, decoration, overflow
Family: Vector · Representative properties: fill, stroke, width, join, cap, dash
Family: Transform · Representative properties: translate/scale/rotate/skew/origin and native scale/rotation fields
Family: Transition · Representative properties: supported property list, duration, delay, easing
Family: Type-specific · Representative properties: Text, Input, Link, Image/SVG, Path, Component instance, IFrame, Mesh, Shader, Connection, attributes, refs, SEO
This is a family map, not a promise that every node accepts every property. The current selection matrix is authoritative.
A final value can come from base, responsive screen, Component variant/combination, hover/focus/active, a per-node style variant, or an ancestor context. Always name the intended layer before editing.
MCP style reads/writes accept relevant screenId, interaction state, and variant identities. The unset list actively removes seeded/stored properties; omission usually means “leave unchanged,” not “reset to browser default.”
Supported color, spacing, radius, font, and image fields can reference project or linked-library token IDs. Only Semantic Colors and Font/Image Templates vary by theme/layer. Resolve and Preview tokens under each affected theme.
A block container normally spans available width; a flex container can shrink to content.
Fill works on the relevant axis of a flex parent.
Relative represents a percentage; fixed represents pixels; fit/max follow content sizing.
Equal children in a row usually need fill on each child.
Base seeded styles can include a border, radius, background, line height, or word breaking that must be explicitly unset when unwanted.
Read the resolved stored layer, Preview at the intended screen/variant/theme/state, inspect computed style, then inspect generated SCSS. A schema-accepted value can still produce unintended layout in its parent.
The complete exact value enums and nested shapes belong to the connected update-style schema and current implementation—not a copied static list in visitor prose.