Colours and style

Every picture in the library follows these, and so does every download.

Colour of single-colour icons
Palette for colourful pictures
As drawn
100%
Dashed Line SVG element, flat

Dashed Line SVG element, flat

Evenly spaced dashes form a horizontal divider that stretches nearly the full width. Use it between sections of a worksheet or beneath headings in a newsletter.

Similar SVGs

More from Horizontal Rules, Flat · Set 2

How to use it

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} />

Tags

Made with AMNT

AMNT Draw 1.2 drew this from the words Dashed Line: Evenly spaced horizontal dashes extend nearly the full width. A flat element. as part of the pack Horizontal Rules, Flat · Set 2. 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