A non-layout child that describes the parent's complete paint and effect stack. Used when a node has multiple fills, complex borders, or multiple effects.

appearance

tagpaint & effects stack

A non-layout child that describes the parent's complete paint and effect stack. Used when a node has multiple fills, complex borders, or multiple effects.

All three stacks — fills, borders, effects — are ordered in document order. When <appearance> contains at least one <border>, the border shorthand on the parent is ignored.

Attr	Type	Description
`<fill>`	`child`	color, linear-gradient, radial-gradient, angular-gradient, image.
`<border>`	`child`	color, w, align (inside/center/outside), style, dash, cap, join.
`<effect>`	`child`	drop-shadow, inner-shadow, layer-blur, background-blur, glass.

Multi-fill + shadow

<frame w="320" h="180" radius="16">
  <appearance>
    <fill type="image" src="assets/hero.webp" fit="cover" />
    <fill type="linear-gradient" value="linear-gradient(180deg, #00000000 0%, #000000CC 100%)" />
    <effect type="drop-shadow" x="0" y="8" radius="24" color="#00000033" />
  </appearance>
</frame>