Menu

Beta
Sign in
Cake Fillings SVG element, line

Cake Fillings SVG element, line

Six capsule-shaped fields in two columns create a compact layout for cake filling choices, with room for a heading and footer. Place it in an online order form or share it in a bakery story.

Free · from Home Bakery Story Frames

Similar SVGs

More from Home Bakery Story Frames

Whole pack

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/xCMZqQ9TttAQ/amnt.svg" alt="Cake Fillings" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 1024" width="512" height="1024"><g id="layer-1" data-name="Rectangle 1"><path d="M52 28L460 28C473.25 28 484 38.75 484 52L484 972C484 985.25 473.25 996 460 996L52 996C38.75 996 28 985.25 28 972L28 52C28 38.75 38.75 28 52 28Z" fill="none" stroke="#694735" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-2" data-name="Rectangle 2"><path d="M102 302L204 302C224.99 302 242 319.01 242 340L242 340C242 360.99 224.99 378 204 378L102 378C81.01 378 64 360.99 64 340L64 340C64 319.01 81.01 302 102 302Z" fill="none" stroke="#694735" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-3" data-name="Rectangle 3"><path d="M308 302L410 302C430.99 302 448 319.01 448 340L448 340C448 360.99 430.99 378 410 378L308 378C287.01 378 270 360.99 270 340L270 340C270 319.01 287.01 302 308 302Z" fill="none" stroke="#694735" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-4" data-name="Rectangle 4"><path d="M102 426L204 426C224.99 426 242 443.01 242 464L242 464C242 484.99 224.99 502 204 502L102 502C81.01 502 64 484.99 64 464L64 464C64 443.01 81.01 426 102 426Z" fill="none" stroke="#694735" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-5" data-name="Rectangle 5"><path d="M308 426L410 426C430.99 426 448 443.01 448 464L448 464C448 484.99 430.99 502 410 502L308 502C287.01 502 270 484.99 270 464L270 464C270 443.01 287.01 426 308 426Z" fill="none" stroke="#694735" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-6" data-name="Rectangle 6"><path d="M102 550L204 550C224.99 550 242 567.01 242 588L242 588C242 608.99 224.99 626 204 626L102 626C81.01 626 64 608.99 64 588L64 588C64 567.01 81.01 550 102 550Z" fill="none" stroke="#694735" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-7" data-name="Rectangle 7"><path d="M308 550L410 550C430.99 550 448 567.01 448 588L448 588C448 608.99 430.99 626 410 626L308 626C287.01 626 270 608.99 270 588L270 588C270 567.01 287.01 550 308 550Z" fill="none" stroke="#694735" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-8" data-name="Shape 8"><path d="M204 770L284 741L314 778L234 807Z" fill="none" stroke="#694735" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-9" data-name="Shape 9"><path d="M204 770L204 810L234 847L234 807" fill="none" stroke="#694735" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-10" data-name="Shape 10"><path d="M234 807L234 847L314 818L314 778" fill="none" stroke="#694735" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-11" data-name="Shape 11"><path d="M204 795L234 832L314 803" fill="none" stroke="#694735" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-12" data-name="Shape 12"><path d="M246 801L301 781" fill="none" stroke="#694735" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g></svg>
CSS background-image
.cake-fillings {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/xCMZqQ9TttAQ/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.cake-fillings {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/xCMZqQ9TttAQ/amnt.svg") center / contain no-repeat;
}
React
import CakeFillingsSvg from "./cake-fillings.jsx"; // from the React tab above

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

Tags

cakefillingschoicesorderbakery

Made with AMNT

AMNT SVG 1.1 drew this from the words Draw one vertical 1:2 SVG story frame for a home bakery cake filling list. Use cocoa-brown monoline outlines, a thin rounded outer border, six blank capsule-shaped fields arranged in two columns, and a small cut cake-slice ornament centered below them. Reserve empty heading and footer spaces with generous margins; transparent interiors, editable vector shapes, no text, photos, shading, or logos. as part of the pack Home Bakery Story Frames. Want one like it? Make your own in the SVG studio.

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

Settings