Styling contract
The component-safe styling surface is the <tng-label> host plus the semantic tokens consumed by the internal label. Use wrapper classes for field layout and host-level custom properties for per-instance tone changes.
| Surface | Use from consumer CSS? | Purpose |
|---|---|---|
tng-label host | Yes | Per-instance token overrides and layout placement. |
--tng-semantic-foreground-primary | Yes | Label text color. |
--tng-semantic-accent-danger | Yes | Required marker color. |
.tng-label, .tng-label-required | No, not from component-scoped CSS | Internal implementation detail. Use headless or ownable if you need direct selector ownership. |
Suggested CSS baseline
Keep the same label API and swap only the surrounding styling layer.