Skip to main content

Label ready

Labels are used to create text labels for items in an interface.

Open in new window
<duet-label for="identifier">Label text</duet-label>

Properties #

Property Attribute Description Type Default
for for ID of the component that the label is labelling. string undefined
margin margin Controls the margin of the component. Can be one of: "auto", "small", "none". string "auto"
size size Controls the size of the label. Can be one of: "medium", "small". string "medium"
theme theme Theme of the label. Can be one of: "default", "turva". string ""

Dependencies #

Used by #

Graph #

graph TD;
duet-input --> duet-label
duet-range-slider --> duet-label
duet-select --> duet-label
duet-textarea --> duet-label
duet-toggle --> duet-label
style duet-label fill:#f9f,stroke:#333,stroke-width:4px


For integration, event and theming guidelines, please see Using Components. This documentation explains how to implement and use Duet’s components across different technologies like Angular, React or Vanilla JavaScript.


Follow these practical tutorials to learn how to build simple page layouts using Duet’s CSS Framework, Web Components and other features:


Building Layouts


Server Side Rendering


If you experience any issues while using a component, please head over to the Support page for more guidelines and help.