How to create an ellipse in CSS

widget

Draw a simple rectangle. Your choice of height and width, of the rectangle, will dictate the size and shape of the ellipse.

The border-radius refers to the curvature at the corners of the ​shape; it should be set to a very high value (50% to 100%).

An ellipse has been created!

To draw a circle (a special case of ellipses) keep the height and width equal.

New on Educative
Learn to Code
Learn any Language as a beginner
Develop a human edge in an AI powered world and learn to code with AI from our beginner friendly catalog
🏆 Leaderboard
Daily Coding Challenge
Solve a new coding challenge every day and climb the leaderboard

Free Resources

Copyright ©2025 Educative, Inc. All rights reserved