Skip to main content

Label

Deprecated

This node is deprecated and kept only so existing projects keep working. It is not offered in the node picker for new use.

Legacy text-label visual, hidden from the node picker — superseded by Text.

The original Label visual (an HTML label element with a text style), kept only so old projects load. Text supersedes it for all display text; for form-control captions the modern controls carry their own labels.

When to use it

Do not use in new graphs — use Text instead.

At a glance

CategoryVisual
Type nameLabel
Available inbrowser
SSR compatibilitysafe
Provided bynoodl-viewer-react

Inputs

Values

NameTypeDefaultDescription
alignXEnum (left, center, right)Horizontal alignment of this element within the space its parent gives it
alignYEnum (top, center, bottom)Vertical alignment of this element within the space its parent gives it
borderBottomColorColorColour of the bottom edge only, overriding Border Color
borderBottomLeftRadiusNumberRounds the bottom-left corner only, overriding Corner Radius
borderBottomRightRadiusNumberRounds the bottom-right corner only, overriding Corner Radius
borderBottomStyleEnum (none, solid, dotted, dashed)Line style for the bottom edge only, overriding Border Style; None hides that edge
borderBottomWidthNumberThickness of the bottom edge in pixels, and it adds to the element's size
borderColorColor#000000Colour of the border, which has no effect while Border Style is None
borderLeftColorColorColour of the left edge only, overriding Border Color
borderLeftStyleEnum (none, solid, dotted, dashed)Line style for the left edge only, overriding Border Style; None hides that edge
borderLeftWidthNumberThickness of the left edge in pixels, and it adds to the element's size
borderRadiusNumber0Rounds all four corners, except any corner that sets its own radius
borderRightColorColorColour of the right edge only, overriding Border Color
borderRightStyleEnum (none, solid, dotted, dashed)Line style for the right edge only, overriding Border Style; None hides that edge
borderRightWidthNumberThickness of the right edge in pixels, and it adds to the element's size
borderStyleEnum (none, solid, dotted, dashed)noneLine style for all four edges; None hides the border and leaves Border Width and Color inactive
borderTopColorColorColour of the top edge only, overriding Border Color
borderTopLeftRadiusNumberRounds the top-left corner only, overriding Corner Radius
borderTopRightRadiusNumberRounds the top-right corner only, overriding Corner Radius
borderTopStyleEnum (none, solid, dotted, dashed)Line style for the top edge only, overriding Border Style; None hides that edge
borderTopWidthNumberThickness of the top edge in pixels, and it adds to the element's size
borderWidthNumber2Thickness of the border in pixels, which adds to the element's size unless Box Sizing accounts for it
colorColorColour of the text itself, not of the element behind it
cssClassNameString``Extra CSS class names to put on this element, for styling from a stylesheet you supply
fontFamilyFontTypeface to render the text in, either a web-safe family name or a font file added to the project
fontSizeNumberHeight of the text, in pixels
forString
heightDimension100Height of the element; how the value is read depends on Size Mode
letterSpacingNumberAutoExtra space added between characters; leave as Auto to use the spacing built into the font
lineHeightNumberAutoVertical space each line of text occupies; leave as Auto to follow the font
marginBottomNumberSpace outside the element's bottom edge, between it and its neighbours
marginLeftNumberSpace outside the element's left edge, between it and its neighbours
marginRightNumberSpace outside the element's right edge, between it and its neighbours
marginTopNumberSpace outside the element's top edge, between it and its neighbours
maxHeightNumberLargest height the element may grow to, taking priority over Height
maxWidthNumberLargest width the element may grow to, taking priority over Width
minHeightNumberSmallest height the element may shrink to, taking priority over Height
minWidthNumberSmallest width the element may shrink to, taking priority over Width
mixBlendModeEnum (normal, multiply, screen, overlay, darken, lighten, color-dodge, color-burn, hard-light, soft-light, difference, exclusion, hue, saturation, color, luminosity)normalHow this element's colours blend with whatever is painted behind it
mountedBooleantrueRemoves the element from the page entirely when false, unlike Visible which leaves its space behind
opacityNumber1How opaque this element is, from 0 for invisible to 1 for solid
positionEnum (relative, absolute, sticky, fixed)relativeHow the element is placed: In Layout follows its siblings, Absolute ignores them, Sticky pins to the parent edge on overflow, Fixed stays put and takes no space
sizeModeEnum (explicit, contentWidth, contentHeight, contentSize)contentSizeWhether Width and Height are used as given, or the element sizes itself to fit its contents
styleCssString/* background-color: red; */Raw CSS declarations applied to this element, overriding the styling ports above
textString
textStyleTextStyleNoneApplies one of the project's saved text styles; the individual font ports below override whatever it sets
textTransformEnum (none, uppercase, lowercase, capitalize)noneForces the text to upper case, lower case or capitalised without changing the underlying value
transformOriginXNumber50Horizontal point the element rotates and scales around, as a fraction of its width
transformOriginYNumber50Vertical point the element rotates and scales around, as a fraction of its height
transformRotationNumber0Rotates the element clockwise in degrees, without affecting the layout
transformScaleNumber1Scales the element about its transform origin; 1 leaves it unscaled
transformXNumber0Moves the element right after layout, without moving its siblings
transformYNumber0Moves the element down after layout, without moving its siblings
variantStringName of a saved variant of this node type to apply, replacing the styling set here
visibleBooleantrueHides the element while keeping the space it occupies in the layout
widthDimension100Width of the element; how the value is read depends on Size Mode
zIndexNumberPaint order among overlapping siblings; higher numbers paint on top

Outputs

Values

NameTypeDefaultDescription
boundingHeightNumberHeight this element actually ended up with after layout, in pixels
boundingWidthNumberWidth this element actually ended up with after layout, in pixels
childIndexNumberThis element's position among its parent's children, counting from 0
childrenCountNumberHow many child elements are currently mounted inside this one
screenPositionXNumberDistance in pixels from the left edge of the window to this element's left edge
screenPositionYNumberDistance in pixels from the top edge of the window to this element's top edge
thisReferenceA reference to this node itself, for ports that take a node rather than a value

Signals

NameTypeDefaultDescription
didMountSignalFires once this element has been added to the page and can be measured
willUnmountSignalFires just before this element is removed from the page, while it still exists

Dynamic ports

This node's port list changes at runtime (declared-port-groups); the tables above may be incomplete for a given instance.

Declares conditional/expandable port groups whose visibility depends on parameter values (see declaredPortGroups).

ConditionInputs shownOutputs shown
sizeMode = explicit OR sizeMode = contentHeightwidth
sizeMode = explicit OR sizeMode = contentWidthheight
borderStyle = solid OR borderStyle = dashed OR borderStyle = dottedborderWidth, borderColor
borderLeftStyle = solid OR borderLeftStyle = dashed OR borderLeftStyle = dotted OR borderStyle = solid OR borderStyle = dashed OR borderStyle = dottedborderLeftWidth, borderLeftColor
borderTopStyle = solid OR borderTopStyle = dashed OR borderTopStyle = dotted OR borderStyle = solid OR borderStyle = dashed OR borderStyle = dottedborderTopWidth, borderTopColor
borderRightStyle = solid OR borderRightStyle = dashed OR borderRightStyle = dotted OR borderStyle = solid OR borderStyle = dashed OR borderStyle = dottedborderRightWidth, borderRightColor
borderBottomStyle = solid OR borderBottomStyle = dashed OR borderBottomStyle = dotted OR borderStyle = solid OR borderStyle = dashed OR borderStyle = dottedborderBottomWidth, borderBottomColor

Ports at runtime

Declared-port-groups gate width/height and border ports on parameter values; irrelevant for new work — the node is hidden from the picker.

Text

Generated

This page is generated from node-catalog-enriched.json. Do not edit it by hand — run npm run docs:nodes to regenerate, and fix the source enrichment instead.