Streaming live at 10am (PST)

Help to create this component

Hello everyone!
I am creating this topic to get help about this idea that I am trying to create on Webflow, already try a lot of approachs and researchs but nothing that I could apply.

My idea is to create this Circle Component:

The big problem is positioning this little circles and I need in my vision to have this little circles as elements because the general idea is have a hover effect connecting two opposite circles and make and image appear, this little circles also have words together, another reason that I am having problems to position them.

Thats the overall experience, circle with options, when hovering the options connects and an image appears (in this example is me hahaha)

Its important that I dont want the final answear, I only looking for a guidance then I can make it happen and every help, helps a lot!

Thank you everyone :smiley:

In a div you put your circle. You create 7 elements like the red ones here and you position them vertically in the center with position absolute. One on top of the others like the one having the As inside. Then math, divide 360 by the number of dots, rotate the element with the Bs with the obtained value and repeat. Make your elements symbols to begin with and change them with symbole content override, that’s going to be easier.

1 Like

Niiiiiiceeee tip!
I will try here and soon give you some feedback, I am not so familiarize with symbols, so I will study about them, the insight of use the two dots as a unique element and just change the rotation was awesome, I will try here, thaaank you

I’d hire you.

Post must be at least 20 characters, but I just wanted to say that.