CSS: testimonial

div[class~="instui-testimonial"] — Visualització de cita o testimoni amb atribució i imatge opcional.

✅ Utilitza Testimonial quan:

• Mostrar testimonis i cites de clients o usuaris

• Vols destacar una declaració amb èmfasi visual

• L'atribució i el context (nom, càrrec, imatge) són importants 🚫 No facis servir Testimonial quan:

• Mostrar cites en línia dins del text — utilitza en canvi un element blockquote

• La declaració és el focus principal — utilitza en canvi Hero o Card

Accessibilitat

• Utilitza <blockquote> semànticament per a la cita
• Assegura't que l'atribució sigui clara i estigui associada a la cita
• Si s'utilitzen imatges, proporciona text alternatiu

Ús

@import "@pantoken/plugin-layouts/layouts.css";

Exemples

Parts

Part	Descripció
.instui-author	Nom de l'autor per a l'atribució.
.instui-avatar	Imatge de perfil de l'autor (opcional).
.instui-content	Contenidor per a la cita i l'atribució.
.instui-quote	El text citat.
.instui-title	Càrrec o afiliació de l'autor (opcional).

Estats

Estat	Descripció
:optional	—

Tokens consumits

Token	Tipus	Valor
--instui-color-background	—	—
--instui-color-primary	—	—
--instui-color-surface	—	—
--instui-color-text-primary	—	—
--instui-color-text-secondary	—	—
--instui-font-size-small	<length>	—
--instui-font-weight-semibold	—	—
--instui-radius-medium	—	—
--instui-space-large	—	—
--instui-space-medium	—	—
--instui-space-small	—	—

Relacionat

• card