HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/VremY-VP1qFY/amnt.svg" alt="Dashed Line" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024"><g id="black" data-name="Black"><path d="M490 496c-13 4-7 15 4 17 8 1 25 2 32 0 12-5 6-15-4-17-8-1-24-2-32 0z" fill="#202529" stroke="#202529"/><path d="M620 496c-13 5-7 15 4 17 7 1 25 2 32 0 12-4 6-15-4-17-7-1-25-2-32 0z" fill="#202529" stroke="#202529"/><path d="M37 496c-3 1-5 3-6 6-6 15 35 13 42 11 13-4 7-15-4-17-7-1-25-2-32 0z" fill="#202529" stroke="#202529"/><path d="M944 496c-3 1-5 3-6 6-4 17 40 12 44 10 12-5 3-15-6-16-7-1-25-3-32 0z" fill="#202529" stroke="#202529"/><path d="M295 496c-3 1-6 4-6 7-3 14 36 12 42 10 12-4 6-15-4-17-7-1-25-2-32 0z" fill="#202529" stroke="#202529"/><path d="M815 496c-13 4-7 15 4 17 8 1 25 2 32 0 12-4 5-15-4-17-7-1-25-2-32 0z" fill="#202529" stroke="#202529"/><path d="M880 496c-3 1-6 3-7 6-4 15 35 14 43 11 3-1 5-3 6-6 6-15-35-13-42-11z" fill="#202529" stroke="#202529"/><path d="M555 496c-13 5-7 15 4 17 8 1 25 2 32 0 12-4 5-15-4-17-7-1-25-2-32 0z" fill="#202529" stroke="#202529"/><path d="M230 496c-3 1-5 3-6 6-4 15 36 14 43 11 3-1 5-3 6-6 4-15-35-14-43-11z" fill="#202529" stroke="#202529"/><path d="M360 496c-12 4-5 15 4 17 7 1 25 2 32 0 12-4 6-15-4-17-7-1-25-2-32 0z" fill="#202529" stroke="#202529"/><path d="M166 496c-12 5-6 15 4 17 5 1 27 2 32 0 4-1 6-3 6-7 3-13-34-12-42-10z" fill="#202529" stroke="#202529"/><path d="M685 496c-12 4-6 15 4 17 7 1 25 2 32 0 3-1 6-4 7-7 2-13-36-12-43-10z" fill="#202529" stroke="#202529"/><path d="M750 496c-3 1-6 4-7 7-2 14 34 12 42 10 12-4 7-15-3-17-7-1-25-2-32 0z" fill="#202529" stroke="#202529"/><path d="M102 496c-11 4-7 15 3 17 7 1 25 2 32 0 4-1 6-3 7-7 3-14-34-13-42-10z" fill="#202529" stroke="#202529"/><path d="M425 496c-12 4-6 15 4 17 7 1 25 2 32 0 12-4 5-15-4-17-7-1-25-2-32 0z" fill="#202529" stroke="#202529"/></g></svg>
CSS background-image
.dashed-line {
background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/VremY-VP1qFY/amnt.svg");
background-size: contain;
}
CSS mask-image (takes the text colour)
.dashed-line {
width: 1.5em; height: 1.5em;
background-color: currentColor;
mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/VremY-VP1qFY/amnt.svg") center / contain no-repeat;
}
React
import DashedLineSvg from "./dashed-line.jsx"; // from the React tab above
<DashedLineSvg width={48} height={48} />
