Uilora
Uilora.
Uilora
Uilora.
Content Blocks
Playground

Bento Mosaic

Bento mosaic testimonial grid with expandable cards.

testimonialbentomosaicexpandable

Props

Customize the component with these props

PropertyTypeDefaultDescription
testimonials
TestimonialItem[][]Array of testimonial items with id, name, role, company, content/text, media, avatar/image.
backgroundColor
string#f5f5f5Background color of the component (hex, rgb, or hsl).
headerCardBgColor
string#4f46e5Background color of the header card (hex, rgb, or hsl).
headerCardBlurColor
stringrgba(255,255,255,0.1)Blur effect color for the header card (hex, rgb, or hsl).
headerTextColor
string#ffffffText color of the header (hex, rgb, or hsl).
headerText
stringWhat people are saying.Header text content.
card1BgColor
string#ffffffBackground color of card 1 (hex, rgb, or hsl).
card1TextColor
string#525252Text color of card 1 (hex, rgb, or hsl).
card2BgColor
string#facc15Background color of card 2 (hex, rgb, or hsl).
card2TextColor
string#000000Text color of card 2 (hex, rgb, or hsl).
card2QuoteColor
string#000000Quote text color of card 2 (hex, rgb, or hsl).
card2CompanyColor
stringrgba(0,0,0,0.6)Company text color of card 2 (hex, rgb, or hsl).
card3BgColor
string#000000Background color of card 3 (hex, rgb, or hsl).
card3AvatarBorderColor
string#404040Avatar border color of card 3 (hex, rgb, or hsl).
card3QuoteColor
string#ffffffQuote text color of card 3 (hex, rgb, or hsl).
card3QuoteItalic
booleantrueWhether to display quotes in italic on card 3.
card3AuthorColor
string#ffffffAuthor name color of card 3 (hex, rgb, or hsl).
card3RoleColor
string#737373Author role color of card 3 (hex, rgb, or hsl).
statCardBgColor
string#ffffffBackground color of stat cards (hex, rgb, or hsl).
statValueColor
string#4f46e5Value text color of stat cards (hex, rgb, or hsl).
statLabelColor
string#737373Label text color of stat cards (hex, rgb, or hsl).
card5BgColor
string#faf5ffBackground color of card 5 (hex, rgb, or hsl).
card5HoverBgColor
string#f3e8ffBackground color of card 5 on hover (hex, rgb, or hsl).
card5TextColor
string#581c87Text color of card 5 (hex, rgb, or hsl).
card5IconColor
string#9333eaIcon color of card 5 (hex, rgb, or hsl).
card5AuthorColor
string#6b21a8Author name color of card 5 (hex, rgb, or hsl).
card6BgColor
string#ffffffBackground color of card 6 (hex, rgb, or hsl).
card6IconBgColor
string#f5f5f5Icon background color of card 6 (hex, rgb, or hsl).
card6IconColor
string#eab308Icon color of card 6 (hex, rgb, or hsl).
card6TextColor
string#525252Text color of card 6 (hex, rgb, or hsl).
Bento Mosaic - Content Blocks Component | UILora