This feature is in beta. This means it might at any time be changed, withdrawn from your account, or become part of a paid add-on module. You might also experience interruptions of this service, degradation of user experience or faulty behavior even in critical processes such as automations and sendouts. Voyado welcomes feedback on beta features, and encourages you to try them, but you should not build business critical logic on beta features. Only when a feature reaches its full release can you trust it to function reliably with no further breaking changes.
:root. Override them to match your brand.
:root {
/* Colors */
--voyado-rating: #66C1BF; /* Filled star / accent */
--voyado-neutral: #D8D8D5; /* Empty star / dividers */
--voyado-text: #333333; /* Body text */
--voyado-cta-color: #437984; /* CTA button background */
--voyado-cta-text-color: #FFFFFF; /* CTA button label */
--voyado-review-interactions-color: #A7A7A7;
--voyado-trophy-color: #E1C32E;
--voyado-select-bg: #FFFFFF;
--voyado-select-border-color: #E5E5E5;
/* Typography */
--voyado-font-family: "Helvetica", sans-serif;
--voyado-font-size-large: 28px;
--voyado-font-size-medium: 22px;
--voyado-font-size-small: 16px;
--voyado-font-size-micro: 12px;
/* Star sizes */
--voyado-star-size-large: 40px;
--voyado-star-size-small: 16px;
/* Spacing */
--voyado-spacing-xs: 5px;
--voyado-spacing-sm: 10px;
--voyado-spacing-md: 20px;
--voyado-spacing-lg: 40px;
/* Accessibility */
--voyado-focus-color: #005fcc;
--voyado-focus-ring-width: 2px;
}
Brand override example
:root {
--voyado-rating: #ff6b35;
--voyado-cta-color: #4a90e2;
--voyado-font-family: "Inter", sans-serif;
}
/* Or scoped to a wrapper */
.my-product-page {
--voyado-rating: #FFD700;
}
CSS classes for overrides
| Class | Element |
|---|---|
.voyado-star--filled | Filled star SVG |
.voyado-star--half | Half-filled star |
.voyado-star--empty | Empty star SVG |
.voyado-ratings--value | Numeric score text |
.voyado-ratings--count | Review count text |
.voyado-badge--score | Large numeric score |
.voyado-cta | CTA button (Badge, Rate) |
.voyado-review--author | Reviewer name |
.voyado-review--text | Review body |
.voyado-review--interactions | Thumbs + comment row |
.voyado-reviews--select | Sort dropdown |
.voyado-summary--title | AI summary heading |