Content Blocks
Dark Spotlight
Premium dark spotlight testimonial cards with hover effects.
testimonialdarkspotlightpremium
Props
Customize the component with these props
| Property | Type | Default | Description |
|---|---|---|---|
testimonials | TestimonialItem[] | [] | Array of testimonial items with id, name, role, company, content/text, media, avatar/image. |
backgroundColor | string | #050505 | Background color of the component (hex, rgb, or hsl). |
badgeText | string | Excellence | Text displayed in the badge. |
badgeTextColor | string | #D4AF37 | Text color of the badge (hex, rgb, or hsl). |
title | string | Client Success Stories | Main title text. |
titleColor | string | #ffffff | Color of the title text (hex, rgb, or hsl). |
cardBgColor | string | rgba(23, 23, 23, 0.5) | Background color of the testimonial cards (hex, rgb, or hsl). |
cardBorderColor | string | #262626 | Border color of the testimonial cards (hex, rgb, or hsl). |
cardHoverBorderColor | string | rgba(212, 175, 55, 0.5) | Border color of cards on hover (hex, rgb, or hsl). |
spotlightColor | string | rgba(212, 175, 55, 0.1) | Color of the spotlight effect (hex, rgb, or hsl). |
spotlightSize | number | 600 | Size of the spotlight effect in pixels. |
quoteIconColor | string | #404040 | Color of the quote icon (hex, rgb, or hsl). |
quoteTextColor | string | #d4d4d4 | Color of the quote text (hex, rgb, or hsl). |
avatarGrayscale | boolean | true | Whether to apply grayscale filter to avatars. |
avatarOpacity | number | 0.7 | Opacity of avatar images (0-1). |
authorNameColor | string | #ffffff | Color of the author name text (hex, rgb, or hsl). |
authorRoleColor | string | #D4AF37 | Color of the author role text (hex, rgb, or hsl). |
dividerColor | string | #262626 | Color of dividers (hex, rgb, or hsl). |