Menu

Beta
Sign in
Sale Badge SVG icon, gradient

Sale Badge SVG icon, gradient

A sale badge highlights a reduced price or promotional item. Place it on a retailer’s product listing and in a seasonal deals section of a shopping app.

Free · from Online Shopping Icons, Gradient

Similar SVGs

More from Online Shopping Icons, Gradient

Whole pack

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/Q-EuZjVc9sDG/amnt.svg" alt="Sale Badge" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="64" height="64"><defs><linearGradient id="g0" gradientUnits="userSpaceOnUse" x1="10" y1="11" x2="55" y2="54"><stop offset="0" stop-color="#8237e8"/><stop offset="1" stop-color="#1676ff"/></linearGradient></defs><g id="layer-1" data-name="Shape 1"><path d="M32 5L39 10L47.5 9.5L50 17.5L57 22L54.5 30L57 38L50 42.5L47.5 50.5L39 50L32 55L25 50L16.5 50.5L14 42.5L7 38L9.5 30L7 22L14 17.5L16.5 9.5L25 10Z" fill="url(#g0) #1676ff" stroke="#673bd9" stroke-width="2" stroke-linejoin="round"/></g><g id="layer-2" data-name="Shape 2"><path d="M18 18L24 14M20 12L25 12" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-opacity="0.35"/></g><g id="layer-3" data-name="Shape 3"><path d="M23 40L41 20" fill="none" stroke="#ffffff" stroke-width="4" stroke-linecap="round"/></g><g id="layer-4" data-name="Circle 4"><path d="M28 23C28 25.21 26.21 27 24 27C21.79 27 20 25.21 20 23C20 20.79 21.79 19 24 19C26.21 19 28 20.79 28 23Z" fill="none" stroke="#ffffff" stroke-width="3"/></g><g id="layer-5" data-name="Circle 5"><path d="M44 38C44 40.21 42.21 42 40 42C37.79 42 36 40.21 36 38C36 35.79 37.79 34 40 34C42.21 34 44 35.79 44 38Z" fill="none" stroke="#ffffff" stroke-width="3"/></g><g id="layer-6" data-name="Circle 6"><path d="M52.5 47C52.5 48.93 50.93 50.5 49 50.5C47.07 50.5 45.5 48.93 45.5 47C45.5 45.07 47.07 43.5 49 43.5C50.93 43.5 52.5 45.07 52.5 47Z" fill="#ff766d"/></g></svg>
CSS background-image
.sale-badge {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/Q-EuZjVc9sDG/amnt.svg");
  background-size: contain;
}
React
import SaleBadgeSvg from "./sale-badge.jsx"; // from the React tab above

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

Tags

salebadgediscountpromotion

Made with AMNT

AMNT SVG 1.1 drew this from the words Sale badge. bold simple silhouette, smooth shading from violet to electric blue with a small coral accent, subtle highlights, crisp edges, no background, readable at small size. as part of the pack Online Shopping Icons, Gradient. 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