Rotating badge

A standalone rotating circular badge you can position over the join between two sections.

Content

  • Badge text - runs once around the edge of the circle. Around 45 characters fills it; badges smaller than 150px fit fewer.
  • Font style - Display or Body.
  • Size
  • Center image
  • Link - makes the badge clickable.

Animation

  • Rotation behavior - Always rotate, Pause on hover, Rotate on hover, or Rotate on scroll. "Rotate on scroll" turns the element as the page scrolls; browsers that don't support scroll animation fall back to always rotating.
  • Animation speed - the badge stays still for visitors who prefer reduced motion.
  • Animation direction

Position

  • Horizontal position - 1 is the left content edge, 50 is centered, 100 is the right content edge.
  • Vertical offset - moves the badge up or down from the join between sections.

Styling

  • Color scheme

This section has no blocks and doesn't use Content style or Framing text.