Orbiting Icons

The Orbiting Icons is a Container Element that can be used to create an arbitrary number of animated orbits with an arbitrary number of custom icons. Clean, versatile, and fully customizable, it allows you to create all kinds of visually interconnected ( or not ) animated orbits.

Content Tab

Content:

• Orbits: Orbits are abstracted in an Orbiting Icons Item element. See the relevant section below of a description of the settings

Center Icon:

• Icon: An icon that will be placed in the center of the container element

Content Tab

• Icons: The list of icons that belong to this orbit
  • Icon: The icon to use
  • Style Overrides: Override the default style set in the Design Tab for Icons. Any setting set here only affects the particular icon in question
    • Size: Icon size
    • Color: Icon color
    • Background: Icon’s container background color
    • Borders: Icon’s container border styling
    • Padding: Icon’s container padding

Design Tab

Icons:

• Size: Default icon size
• Color: Default icon color
• Background: Default icon’s container background color
• Borders: Default icon’s container border styling
• Padding: Default icon’s container padding

Circle Path:

• Radius: Orbit’s radius. The effective size of the orbit will be Radius * 2
• Stroke Color: Orbit’s stroke color
• Stroke Width: Orbit’s stroke width
• Apply Glow: Apply a glow effect to the orbit’s line ( For use with dark backgrounds )

Animation:

• Direction: The  animation direction for the icons
• Duration: The duration it takes for an icon to make one full revolution

Position:

• Position: The position of the orbit within the Orbiting Icons container