Cake FAQ SVG element, line

Cake FAQ SVG element, line

A small question bubble above a larger answer panel creates a clear layout for one cake-related frequently asked question. Add it to a bakery’s help page or share it in social media stories.

Similar SVGs

More from Home Bakery Story Frames

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/9Ddv2EZiaSnS/amnt.svg" alt="Cake FAQ" 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="M62 24L450 24C470.99 24 488 41.01 488 62L488 962C488 982.99 470.99 1000 450 1000L62 1000C41.01 1000 24 982.99 24 962L24 62C24 41.01 41.01 24 62 24Z" fill="none" stroke="#6b4637" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-2" data-name="Shape 2"><path d="M82 86L430 86C443.25 86 454 96.75 454 110L454 238C454 251.25 443.25 262 430 262L382 262L354 288L358 262L82 262C68.75 262 58 251.25 58 238L58 110C58 96.75 68.75 86 82 86Z" fill="none" stroke="#6b4637" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-3" data-name="Rectangle 3"><path d="M84 326L428 326C442.36 326 454 337.64 454 352L454 866C454 880.36 442.36 892 428 892L84 892C69.64 892 58 880.36 58 866L58 352C58 337.64 69.64 326 84 326Z" fill="none" stroke="#6b4637" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g><g id="layer-4" data-name="Group 4" transform="matrix(1 0 0 1 256 945)"><path d="M-7 6L-28 27" fill="none" stroke="#6b4637" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/><path d="M-10 2C-22 -5 -33 -18 -29 -29C-26 -37 -16 -37 -9 -31C1 -22 0 -11 -10 2Z" fill="none" stroke="#6b4637" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/><path d="M-10 2C-19 -9 -24 -21 -23 -31M-10 2C-13 -10 -13 -22 -9 -31" fill="none" stroke="#6b4637" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/><path d="M-31 30L-25 24" fill="none" stroke="#6b4637" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/><path d="M8 8L32 31" fill="none" stroke="#6b4637" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/><path d="M5 5L17 -29C18 -32 22 -33 24 -30L36 -18C39 -16 38 -12 35 -11L8 5Z" fill="none" stroke="#6b4637" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/><path d="M35 -11L40 -6L35 -1L30 -6" fill="none" stroke="#6b4637" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/><path d="M24 -30L29 -35L41 -23L36 -18" fill="none" stroke="#6b4637" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/></g></svg>
CSS background-image
.cake-faq {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/9Ddv2EZiaSnS/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.cake-faq {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/9Ddv2EZiaSnS/amnt.svg") center / contain no-repeat;
}
React
import CakeFAQSvg from "./cake-faq.jsx"; // from the React tab above

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

Tags

Made with AMNT

AMNT SVG 1.1 drew this from the words Draw one vertical 1:2 SVG story frame for a home bakery custom cake frequently asked question. Use cocoa-brown monoline outlines, a rounded outer border, a smaller blank speech-bubble panel above a larger blank answer panel, and a tiny whisk-and-piping-bag ornament centered at the bottom. Keep the reading areas spacious and transparent with generous inset margins; 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