How do I achieve such gradient / fill in Figma?

I’ve come across this UI element

enter image description here

I tried to copy.. and realized I couldn’t.

  1. Do the semicircles use some sort of gradient?
  2. Is it possible to apply such gradient in Figma?


Yes you can do it in Figma. These are actually just simple linear gradients from top to bottom, and the semi-circles are actually regular circles.

The top color is close to the one in the background, and the bottom color is either the same as the background or just 100% transparent.

See below image, the objects are selected hence the blue outline.

enter image description here

And this is the same image when it’s not selected:

enter image description here

Source : Link , Question Author : Teafortwo , Answer Author : Luciano

Leave a Comment