Element Registry: The Override Key Format

Element overrides are stored in the elementOverrides block attribute as a flat object. Each key identifies exactly which element, variant, and control is being overridden.

Key Format

For variant elements: elementName.variant.controlName

For flat elements: elementName.controlName

Examples

{
    "heading.h2.fontSize":    "4xl",
    "heading.h2.fontWeight":  "bold",
    "description.color":      "muted",
    "description.textAlign":  "center",
    "button.primary.style":   "outline"
}

A value of "inherit" means: do not override, use the cascade (Layer 2 user default or Layer 3 system default). Any other value is an active override and wins at Layer 1.

The elementOverrides attribute must be declared in block.json:

"elementOverrides": { "type": "object", "default": {} }