Skip to main content
The stars toolbar appears when you click on a star rating element in a section. Star ratings are commonly used in testimonial sections, review highlights, and social proof blocks. The toolbar lets you quickly switch between star styles.

Opening the Toolbar

Click on any star rating element in the canvas. The toolbar appears above the stars with a smooth slide-in animation. It positions itself to stay within the viewport boundaries.
The toolbar closes when you click outside of it or press the Escape key.

Star Style Options

The toolbar presents two star style options side by side, each with a visual preview:

Regular Stars (Phosphor)

The Regular option uses Phosphor Icons’ filled star icons. These are simple, clean five-pointed stars rendered in the star color defined for the element.
  • Stars are rendered using the Phosphor Star icon with the fill weight.
  • The star color is customizable per element (defaulting to gold/yellow #F6BE00).
  • This style works well for generic review displays and custom-branded testimonials.

Trustpilot Stars

The Trustpilot option uses the official Trustpilot star rating graphic. This displays the recognizable green Trustpilot stars that consumers associate with verified reviews.
  • Uses the official Trustpilot 5-star SVG asset.
  • Ideal when referencing Trustpilot reviews specifically.
  • Provides instant visual credibility through brand recognition.
Use Trustpilot stars when your testimonials or reviews actually come from Trustpilot. For general reviews or custom testimonials, regular stars give you more design flexibility with your brand colors.

How to Switch Styles

1

Click on the star rating

Click any star rating element in your section. The stars toolbar appears.
2

Select a style

Click either the Regular or Trustpilot button. The currently active style has a highlighted border. The change applies immediately in the canvas.
3

Close the toolbar

Click the X button or click anywhere outside the toolbar to close it.

Star Color

The star color for Regular (Phosphor) stars is configured per element in the section configuration. The default color is a warm gold (#F6BE00), which is the conventional color for star ratings across e-commerce.
Trustpilot stars use their official green color scheme and cannot be recolored, as they represent the Trustpilot brand.

Responsive Positioning

The toolbar uses smart positioning to prevent overflow:
  • It appears above the star element by default.
  • If the stars are near the top of the screen, the toolbar shifts below them.
  • Horizontal positioning is constrained to keep the toolbar fully visible within the viewport.
  • The toolbar repositions dynamically if you scroll or resize the browser window.

Where Stars Appear

Star rating elements are available in several section types:

Testimonial sections

Display customer review ratings alongside testimonial text.

Hero sections

Show aggregate ratings near headlines for social proof.

Product sections

Display product review scores near pricing and CTA buttons.

Stats sections

Highlight customer satisfaction metrics with visual star ratings.