Beta

Sphere SVG background, flat

Free
Sphere SVG background, flat

A cropped sphere at the far right uses curved colour bands to suggest volume. Place it on a landing page or a science handout.

Sign in to download. Free SVGs are free with any account.

sphereroundvolumebackground3dflat

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/VEbXsYyspZDs/amnt.svg" alt="Sphere" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1600 900" preserveAspectRatio="xMidYMid slice"><rect width="1600" height="900" fill="#E9F0ED"/><defs><clipPath id="sphere"><circle cx="1575" cy="450" r="530"/></clipPath></defs><g clip-path="url(#sphere)"><circle cx="1575" cy="450" r="530" fill="#B9D2CA"/><path d="M1070-80C1230 110 1295 325 1295 450S1230 790 1070 980H865V-80Z" fill="#D4E3DC"/><path d="M1270-80C1385 115 1430 325 1430 450S1385 785 1270 980H1110C1260 785 1325 585 1325 450S1260 115 1110-80Z" fill="#91B6AA"/><path d="M1510-80C1575 110 1605 305 1605 450S1575 790 1510 980H1350C1455 765 1490 580 1490 450S1455 135 1350-80Z" fill="#5F9187"/><path d="M1740-80C1710 115 1695 315 1695 450S1710 785 1740 980H1560C1625 770 1650 580 1650 450S1625 130 1560-80Z" fill="#39756F"/></g></svg>
CSS background-image
.sphere {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/VEbXsYyspZDs/amnt.svg");
  background-size: contain;
}
React
import SphereSvg from "./sphere.jsx"; // from the React tab above

<SphereSvg width={48} height={48} />

Made with AMNT

AMNT SVG 1.1 drew this from the words Sphere: One cropped sphere sits at the far right, with curved colour bands suggesting volume. as part of the pack 3D Backgrounds, Flat. Want one like it? Make your own in the SVG studio.

Rest of 3D Backgrounds, Flat

Whole pack

Similar SVGs

Licence: free. A Free account may use it for personal work; Pro and Max download it with a commercial licence, fixed at download, forever. No credit needed. Read the licence