Skip to main content

Inline Message

Inline messages are ideally used as help text for from elements after validation.

Variants

There are 4 different sized varients of inline messages provided in GEL. Info, Success, Warning and Danger

Inline message types

Demo

Inline message demo

Guidance

  • Inline messages should be displayed underneath the input fields/select/input numbers when validation fails for that component.
  • One field can have a maximum of one inline message at any instance.

When to use

  • Use inline messages to inform the user of validations applied to the form elements.

Designer assets

figma
Hey Designers, please find the Figma assets here. If you want permission to access the file, please contact Experience Design CoP.

Developer API

Code

Inline message is a custom component specific to GEL and is not available in PrimeVue.