How do I make a circle with CSS?

Set border-radius: 50% on an element with equal width and height. The percentage creates a radius relative to the element's dimensions, and 50% of both sides creates a perfect circle.

What is the slash syntax in border-radius?

The slash separates horizontal and vertical radii: border-radius: 50% 50% / 30% 70% creates different curvatures in each direction, enabling organic shapes.

What border-radius should I use for cards?

8px-16px is the most common range. 8px for compact, dense UIs. 12px-16px for spacious, modern designs. Use consistent values across all cards and containers in your design system.

How to Use CSS border-radius (Every Shape Possible)

⬜

Try Border Radius Lab

Free, no signup →