NUI / Components / Common

ColorBlock

ImplementedCommon / Display

ColorBlock renders a plain color-filled block.

Supported as a simple filled color block.

Overview

ColorBlock renders a plain color-filled block.

When to use

Swatches.
Background fills.
Placeholders.
Simple color indicators.

Children

Does not support children.

Basic syntax

nui

ColorBlock Swatch {
    color: "#2EC4B6"
    width: 24
    height: 24
}

Supported properties

Property	Type	Required	Default	Description
`color`	color	No	Default	Fill color.
`backgroundColor`	color	No	Default	Fill color alias used by visual components.
`width`	number	No	Auto	Desired width.
`height`	number	No	Auto	Desired height.
`minWidth`	number	No	Unset	Minimum width.
`minHeight`	number	No	Unset	Minimum height.
`maxWidth`	number	No	Unset	Maximum width.
`maxHeight`	number	No	Unset	Maximum height.
`opacity`	number	No	1	Render opacity.
`layer`	integer	No	Context default	Layer order inside layered parents.
`visible`	bool	No	true	Visibility flag.

Contextual properties

Contextual property rules

ColorBlock may receive stack, canvas, grid, wrap, or ExpandableArea slot properties only when it is authored as a direct child of the matching parent. See section 7.

Full syntax example

nui

ColorBlock Swatch {
    color: "#2EC4B6"
    width: 24
    height: 24
    minWidth: 12
    minHeight: 12
    maxWidth: 48
    maxHeight: 48
    opacity: 1
    layer: 1
    visible: true
}

Limitations

ColorBlock does not expose border or corner styling as normal public syntax. Use Rectangle for styled visual primitives.