Global CSS API: Controls - Description

The following CSS custom properties are used for the control description UI, which includes field, validation, and consent descriptions.

Description Base

Properties used for base control description UI.

PropertyDescriptionDefault
--gf-ctrl-desc-colorColor.var(--gf-color-out-ctrl-dark)
--gf-ctrl-desc-font-familyFont family.var(--gf-font-family-tertiary)
--gf-ctrl-desc-font-sizeFont size.var(--gf-font-size-tertiary)
--gf-ctrl-desc-font-styleFont style.var(--gf-font-style-tertiary)
--gf-ctrl-desc-font-weightFont weight.var(--gf-font-weight-tertiary)
--gf-ctrl-desc-letter-spacingLetter spacing.var(--gf-letter-spacing-tertiary)
--gf-ctrl-desc-line-heightLine height.var(--gf-line-height-tertiary)

Validation Description

Properties used for control validation description UI.

PropertyDescriptionDefault
--gf-ctrl-desc-color-errorColor.var(--gf-color-danger)
--gf-ctrl-desc-font-family-errorFont family.var(--gf-ctrl-desc-font-family)
--gf-ctrl-desc-font-size-errorFont size.var(--gf-ctrl-desc-font-size)
--gf-ctrl-desc-font-style-errorFont style.var(--gf-ctrl-desc-font-style)
--gf-ctrl-desc-font-weight-errorFont weight.var(--gf-ctrl-desc-font-weight)
--gf-ctrl-desc-letter-spacing-errorLetter spacing.var(--gf-ctrl-desc-letter-spacing)
--gf-ctrl-desc-line-height-errorLine height.var(--gf-ctrl-desc-line-height)

Consent Description

Properties used for consent field control description UI.

PropertyDescriptionDefault
--gf-ctrl-desc-border-color-consentBorder color.var(--gf-color-out-ctrl-light-darker)
--gf-ctrl-desc-border-color-consent-focusBorder color when focused.var(--gf-ctrl-border-color-focus)
--gf-ctrl-desc-border-style-consentBorder style.solid
--gf-ctrl-desc-border-width-consentBorder width.1px
--gf-ctrl-desc-max-height-consentMaximum height.456px