Properties

Generated by pnpm docs:reference from packages/core/src/properties/UiProperty.ts. Do not edit this page; edit the registry, or the notes in apps/docs/src/reference/property-notes.ts.

There are 140 properties. Every element accepts every one of them, because a property is a slot on a node rather than something a particular element declares. A property nothing sets costs nothing: it is not stored, and it resolves to the default below.

Default is what the property resolves to when no ancestor provides it and nothing sets it. unset means exactly that: the property holds no value, and whatever reads it decides what to do, which for a length usually means sizing from content. A default printed as plain words rather than in code is one whose real value is an object, described here because printing it would not help.

Inherited means the value is looked up through the environment rather than stopping at the node. 13 properties inherit, and they are all text style: set fontSize on a container and every text node below reads it. The properties in Environment are the other side of that, the ones that provide a value for a subtree.

Invalidates is what changing the value marks dirty, which decides how much work the next frame does. Paint repaints the node. Layout re-runs layout for the box and whatever depends on it. Content remeasures text. Transform moves what is already painted. Semantics republishes the accessibility record. Properties marks the value changed without scheduling any of those, for something the input or paint layer reads on demand. None means the runtime does no work at all, and something else reads the value when it needs it.

The groups are editorial. Within a group the order is the order the registry declares them in.

Size

What a box asks for. Nothing here is a promise: a min or a max, a parent, or the content can all overrule it.

Property	Default	Inherited	Invalidates	What it does
width	unset	no	Layout	Requested width, as a number of pixels or a length.
height	unset	no	Layout	Requested height, as a number of pixels or a length.
minWidth	unset	no	Layout	Floor on the width, applied after everything else has had its say.
maxWidth	unset	no	Layout	Ceiling on the width. Beats width, loses to minWidth.
minHeight	unset	no	Layout	Floor on the height.
maxHeight	unset	no	Layout	Ceiling on the height.
aspectRatio	unset	no	Layout	Width divided by height. Fills in whichever of the two is not otherwise decided.

Spacing

Space inside the box, space outside it, and space between children.

Property	Default	Inherited	Invalidates	What it does
padding	unset	no	Layout	Space inside the border on all four sides. A number, never a tuple.
paddingX	unset	no	Layout	Space inside the border, left and right. The idiom, over a pair of sides.
paddingY	unset	no	Layout	Space inside the border, top and bottom. The idiom, over a pair of sides.
paddingTop	unset	no	Layout	Overrides paddingY on the top edge. For one edge, not for an axis.
paddingRight	unset	no	Layout	Overrides paddingX on the right edge. For one edge, not for an axis.
paddingBottom	unset	no	Layout	Overrides paddingY on the bottom edge. For one edge, not for an axis.
paddingLeft	unset	no	Layout	Overrides paddingX on the left edge. For one edge, not for an axis.
paddingStart	unset	no	Layout	Space inside the border on the edge the reading starts at. The idiom for one horizontal edge.
paddingEnd	unset	no	Layout	Space inside the border on the edge the reading ends at. The idiom for one horizontal edge.
margin	unset	no	Layout	Space outside the box on all four sides. Margins do not collapse.
marginX	unset	no	Layout	Space outside the box, left and right. The idiom, over a pair of sides.
marginY	unset	no	Layout	Space outside the box, top and bottom. The idiom, over a pair of sides.
marginTop	unset	no	Layout	Overrides marginY on the top edge. For one edge, not for an axis.
marginRight	unset	no	Layout	Overrides marginX on the right edge. For one edge, not for an axis.
marginBottom	unset	no	Layout	Overrides marginY on the bottom edge. For one edge, not for an axis.
marginLeft	unset	no	Layout	Overrides marginX on the left edge. For one edge, not for an axis.
marginStart	unset	no	Layout	Space outside the box on the edge the reading starts at. The idiom for one horizontal edge.
marginEnd	unset	no	Layout	Space outside the box on the edge the reading ends at. The idiom for one horizontal edge.
gap	unset	no	Layout	Space between children, on both axes.
rowGap	unset	no	Layout	Overrides gap between rows.
columnGap	unset	no	Layout	Overrides gap between columns.

Flex

How a row or a column arranges its children, and how a child answers back.

Property	Default	Inherited	Invalidates	What it does
flex	unset	no	Layout	The CSS shorthand: flex={n} is grow n, shrink 1, basis 0.
flexWrap	unset	no	Layout	Whether children that do not fit start a new line.
alignContent	unset	no	Layout	How a wrapping container distributes its lines on the cross axis, and a grid its row tracks.
layout	unset	no	Layout	A layout the application wrote itself, which measures and places this node's children.
layoutData	unset	no	Layout	A value carried to the custom layout that arranges this node.
flexGrow	unset	no	Layout	Share of the space left over that this child takes.
flexShrink	unset	no	Layout	Share of any shortfall this child gives up. Defaults to 1 in a flex container.
flexBasis	unset	no	Layout	The size grow and shrink start from, before either applies.
x	unset	no	Layout	Alignment of children along the x axis. Axis-relative, so it does not flip with direction.
y	unset	no	Layout	Alignment of children along the y axis. Axis-relative, so it does not flip with direction.
selfX	unset	no	Layout	One child overriding the x alignment its parent set.
selfY	unset	no	Layout	One child overriding the y alignment its parent set.
direction	unset	no	Layout	Which way a flex or scroll container runs.

Grid

Track definitions on the container, placement on the item.

Property	Default	Inherited	Invalidates	What it does
columns	unset	no	Layout	The column tracks, as a list of sizes.
rows	unset	no	Layout	The row tracks, as a list of sizes.
autoColumns	unset	no	Layout	Size for columns the grid creates beyond the declared ones.
autoRows	unset	no	Layout	Size for rows the grid creates beyond the declared ones.
subgrid	unset	no	Layout	A nested grid taking its column tracks from the span it occupies in its parent. Column axis only.
autoFlow	unset	no	Layout	Which axis unplaced items fill first.
justifyContent	unset	no	Layout	How the column tracks are distributed when they do not fill the container.
column	unset	no	Layout	The column line this item starts at, counting from 1.
columnSpan	unset	no	Layout	How many columns the item covers.
row	unset	no	Layout	The row line this item starts at, counting from 1.
rowSpan	unset	no	Layout	How many rows the item covers.

Position

Taking a box out of flow, and putting it somewhere specific instead.

Property	Default	Inherited	Invalidates	What it does
position	unset	no	Layout	One of static, relative, absolute, sticky. Anything but static makes a containing block.
top	unset	no	Layout	Offset from the top edge of the containing block.
right	unset	no	Layout	Offset from the right edge.
bottom	unset	no	Layout	Offset from the bottom edge.
left	unset	no	Layout	Offset from the left edge.
zIndex	unset	no	Layout	Paint and hit-test order among siblings; higher paints later and is hit first.
lift	unset	no	Layout	Paints this node above the tree and outside every clip its ancestors impose, keeping their transforms and scrolling. For a shared element morphing into something that clips; see sharedElement.
liftBoundary	unset	no	Layout	How far a lifted descendant rises: to the end of this node rather than the end of the frame. Presence marks every layer with it, so a lift is held to its own screen.
anchor	unset	no	Layout	The node an absolute box is placed beside. Flips and shifts to stay inside its containing block.
placement	unset	no	Layout	Which side of the anchor to sit on, and how to align along it.
anchorOffset	unset	no	Layout	Gap between the anchor and the anchored box.
inset	unset	no	Layout	Shorthand for top, right, bottom and left at once.

Overflow and scrolling

Clipping, scroll containers, and what a wheel does when it reaches the end.

Property	Default	Inherited	Invalidates	What it does
overflow	unset	no	Paint, Layout	visible, hidden, or scroll and auto, which make the box a scroll container.
scrollX	unset	no	Transform	Current horizontal scroll offset. Readable and writable.
scrollBehavior	unset	no	None	Whether a wheel moves this container at once or animates it. Read by input, not by layout.
scrollY	unset	no	Transform	Current vertical scroll offset. Readable and writable.
overscrollBehavior	unset	no	None	What happens to a wheel delta this node cannot use: chain it to an ancestor, or keep it.

Paint

Fills, borders, shadows and everything else that changes pixels without changing boxes.

Property	Default	Inherited	Invalidates	What it does
backgroundColor	unset	no	Paint	Fill behind the content. Takes a theme token as well as a colour.
backgroundGradient	unset	no	Paint	A gradient over the background colour and under the image. Built with linearGradient or radialGradient.
borderColor	black	no	Paint	Colour of the border, drawn inside the box.
borderWidth	unset	no	Paint	Thickness of that border, in pixels.
borderRadius	no rounding	no	Paint	Corner rounding: one number, four, or a name in the theme's shape scale (borderRadius="medium"), resolved at paint against the theme the element is under. Clips the background, the image and overflow: hidden.
opacity	1	no	Paint	Applies to the whole subtree, not just this node.
boxShadows	none	no	Paint	Shadows behind the box, painted in order.
visible	true	no	Paint, Semantics	Hides the box and its subtree without taking it out of layout.
transform	unset	no	Paint, Transform	Translation, scale and rotation applied at paint time. Layout does not see it.
paint	unset	no	Paint, Layout	A painter given a drawing surface, the resolved box and the device scale, with the inputs it reads. Repainted when those change and not otherwise.
path	unset	no	Paint	A static vector shape, with its own fill rule, stroke, dash, caps and joins.
clipPath	unset	no	Paint	Clips this node to a path, in the same vocabulary path takes.
blur	unset	no	Paint	Blurs a painted node's own picture, in pixels. Not a backdrop blur.

Text

The text style properties are the inherited ones. Set them on a container and everything below reads them.

Property	Default	Inherited	Invalidates	What it does
color	black	yes	Paint	Text colour. Inherited, and a theme token resolves against the theme in scope.
fontFamily	sans-serif	yes	Paint, Layout	Font stack, as a CSS family list.
fontSize	14	yes	Paint, Layout	Size in pixels.
fontWeight	normal	yes	Paint, Layout	A number, a numeric string, or a CSS keyword.
lineHeight	16.8	yes	Paint, Layout	Line box height in pixels. The default is 1.2 times the default size.
letterSpacing	0	yes	Paint, Layout	Extra space between characters, in pixels.
textAlign	start	yes	Paint	How lines sit within the text box.
textDirection	ltr	yes	Paint	Base direction for bidirectional text.
fontStyle	normal	yes	Paint, Layout	Upright or sloped: normal, italic or oblique.
fontStretch	normal	yes	Paint, Layout	The width axis, as CSS keywords. Reaches a variable font's wdth.
fontVariant	normal	yes	Paint, Layout	The one variant a canvas font string carries: normal or small-caps.
fontKerning	auto	yes	Paint, Layout	Whether the shaper applies the font's kerning pairs.
textDecoration	none	yes	Paint	Lines drawn with the text: underline, line-through, or both. Paint only.
spans	unset	no	Content, Layout, Semantics	The paragraph as runs of { text, style } instead of one string. Set instead of text: the runs concatenated are the text, so offsets mean the same thing either way.
verticalAlign	unset	no	Paint	How a text run sits against the baseline of its line.
textWrap	unset	no	Paint, Layout	How text breaks into lines: word, char, or none.
maxLines	unset	no	Paint, Layout	Lines kept before the rest is dropped. Pairs with textOverflow.
textOverflow	unset	no	Paint, Layout	What happens to a line that does not fit: clip or ellipsis.
text	unset	no	Content, Layout, Semantics	The string a text node draws. Changing it remeasures and relayouts.

Editing

The properties an editable node adds. Set by TextInput and TextArea; usable directly.

Property	Default	Inherited	Invalidates	What it does
value	unset	no	Content, Layout, Semantics	The text of an editable node. Write the reported value back to get a controlled field.
placeholder	unset	no	Paint, Layout	Shown while the value is empty.
multiline	unset	no	Properties	Whether Enter inserts a newline or is left for the app.
readOnly	unset	no	Properties	Selectable and focusable, but not editable.
caretColor	unset	no	Paint	Colour of the caret. Falls back to the text colour.
selectionColor	unset	no	Paint	Fill behind selected text.
matchColor	unset	no	Paint	Fill behind a find match.
placeholderColor	unset	no	Paint	Colour of the placeholder text.
editor	unset	no	Properties	The editable text model backing this node, when the app supplies its own.

Interaction

Whether a node can be hit, focused, selected, or used at all.

Property	Default	Inherited	Invalidates	What it does
cursor	unset	no	Properties	CSS cursor shown over this node. Resolved on hover and applied to the canvas by the shell.
selectable	unset	no	Properties	Whether the pointer may select text in this subtree. Read up the ancestor chain, like user-select.
pointerEvents	unset	no	Properties	Whether the node takes pointer input, or lets it through to what is behind.
focusable	unset	no	Properties	Whether focus can land here, by tab or by click.
disabled	unset	no	Properties, Semantics	Blocks input and publishes the disabled state to the mirror.
hitTestable	unset	no	Properties	Whether hit testing considers this node at all.
visualState	normal	no	Paint	Hover, press, focus, disabled. Written by interactive and read by whatever paints.

Semantics

What the node publishes to the accessibility mirror, since a canvas has no DOM to read.

Property	Default	Inherited	Invalidates	What it does
role	unset	no	Semantics	What the node is, as far as assistive technology is concerned. Validated on write.
label	unset	no	Semantics	The accessible name.
description	unset	no	Semantics	Longer detail, read after the name.
live	unset	no	Semantics	A live region: polite or assertive. Its text is announced when it changes.
states	unset	no	Semantics	Checked, expanded, busy, and the rest. Validated on write.
valueNow	unset	no	Semantics	Current value of a range widget.
valueMin	unset	no	Semantics	Lowest value that range accepts.
valueMax	unset	no	Semantics	Highest value that range accepts.
valueText	unset	no	Semantics	A human reading of the value, where the number alone would not do.
posInSet	unset	no	Semantics	Which item in a set this is, counting from 1.
setSize	unset	no	Semantics	How many items the set holds, including any not built yet.
level	unset	no	Semantics	How deep a tree item sits, 1 for a root. A tree is a flat list of rows, so nothing else carries this.

Media

Bitmaps and video frames, both resolved on the shell thread and drawn inside the box.

Property	Default	Inherited	Invalidates	What it does
image	unset	no	Paint	A decoded bitmap drawn inside the box, clipped by borderRadius.
video	unset	no	Paint	A video surface drawn where an image would be, under the same fit and clip.
objectFit	unset	no	Paint	How that bitmap or surface fills the box: fill, cover, contain, none.

Virtualization

What a virtualized container writes on its rows so the runtime can reason about the ones it cannot see.

Property	Default	Inherited	Invalidates	What it does
virtualIndex	unset	no	Properties	Which item in the full list this mounted row is.
virtualLead	unset	no	Properties	Space standing in for the rows above the window.
virtualWindow	unset	no	Properties	The range currently built, and the estimate for everything outside it.

Environment

Values provided at one node and inherited by everything under it.

Property	Default	Inherited	Invalidates	What it does
theme	unset	no	Environment	Provides a palette and a type scale to this subtree.
textStyle	unset	no	Environment	Provides one step of the type scale as the inherited text style.
contentColor	unset	no	Environment	Provides the colour that content on this surface should use.
containerSize	unset	no	Environment	Declares this node a size query container and provides its content size to the subtree.
insets	unset	no	Environment	Provides the registry a floating bar publishes into and a page reads.

Next

The API index is the other generated page: the names an application imports, rather than the properties it sets.