NPS Field - Flex Demo

NPS, CSAT, and Likert scale inputs with three visual variants.

NpsField

Survey and Likert scale inputs with optional color coding.

Standard NPS (0-10)

Not likely at all Extremely likely

Color Coded NPS (0-10)

Detractor Promoter

5-Point Scale (1-5)

Poor Excellent

Textual Likert Scale

No pre-selected value — default is null until the user chooses.

Pills (empty)

Not likely Very likely

Segments (empty)

Emojis (empty)

When the field is not required, clicking the active option again clears the selection.

Optional pills — click again to clear

Optional segments — click again to clear

Optional emojis — click again to clear

Configurable border radius via rounding() and size via size().

How would you rate your experience? (sm, full radius)^*

Medium segments (md, default radius)^*

Large segments (lg, full radius)^*

Medium rounding (md radius)^*

How are you feeling today? (webp images)^*

Custom Hugeicons

Small emojis (sm)

Large emojis (lg)

Small Size (sm)

Medium Size (md)

Large Size (lg)