Theme Playground

Commerce

ProductUSP

Single-line reassurance or benefit row for product detail and campaign surfaces.

Best for

reassurance listsbenefit rowseditorial product highlights

Import

import { ProductUSP } from "@enadhq/enad-react-sdk/client/storefront"

When to use it

Use ProductUSP for short pieces of reassurance or value framing near the main purchase decision. It works well beside price, buy-box content, or editorial product storytelling.

Composition notes

Keep the text short and specific. One strong reassurance per row is easier to scan than a dense sentence.

Behavior and theming guidance

Use the default variant for practical commerce information and editorial when the tone needs to feel more brand-led. Keep several USPs visually consistent when they appear as a list.

Examples

Live examples you can edit directly in the sandbox.

1 example

Commerce and editorial variants

Use the default variant for practical reassurance and the editorial variant when the tone should feel a little more expressive.

Component Sets

Preview the first example across the available component-set presets to compare tone, spacing, and structural defaults.

Props

PropTypeDefaultDescription
textstring
No description yet.
classNamestring
No description yet.
variantstringdefault
No description yet.