Scattered Dots SVG element, flat

Scattered Dots SVG element, flat

Round dots of varied sizes are placed irregularly across the frame. Scatter them behind a greeting card message or across the cover of a children’s activity booklet.

Similar SVGs

More from Dots and grids, flat · Set 2

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/KtZKGkjmCgVx/amnt.svg" alt="Scattered Dots" 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="blue" data-name="Blue"><path d="M253 488c-18 2-34 9-48 19-77 58-28 182 68 172 125-13 107-202-20-191z" fill="#0179f1" stroke="#0179f1"/><path d="M219 53c-49 4-46 80 6 77 51-3 44-80-6-77z" fill="#0179f1" stroke="#0179f1"/><path d="M686 219c-48 6-39 80 10 73 47-5 39-79-10-73z" fill="#0179f1" stroke="#0179f1"/><path d="M614 770c-32 4-25 54 7 50s25-54-7-50z" fill="#0179f1" stroke="#0179f1"/><path d="M290 422c-30 5-22 50 8 46 31-4 22-50-8-46z" fill="#0179f1" stroke="#0179f1"/><path d="M849 689c-27 5-17 47 9 42 27-4 19-47-9-42z" fill="#0179f1" stroke="#0179f1"/><path d="M890 205c-26 3-21 43 5 40s21-43-5-40z" fill="#0179f1" stroke="#0179f1"/><path d="M492 133c-25 2-21 41 3 39 25-2 21-41-3-39z" fill="#0179f1" stroke="#0179f1"/><path d="M615 542c-24 5-13 44 11 37s13-42-11-37z" fill="#0179f1" stroke="#0179f1"/><path d="M298 894c-20 1-19 31 0 31 20 0 20-31 0-31z" fill="#0179f1" stroke="#0179f1"/><path d="M460 589c-17 4-11 31 7 27 17-3 10-30-7-27z" fill="#0179f1" stroke="#0179f1"/></g><g id="yellow" data-name="Yellow"><path d="M796 287c-113 11-100 186 19 176 19-2 35-10 49-22 66-57 17-162-68-154z" fill="#f9d604" stroke="#f9d604"/><path d="M318 325c-47 2-44 74 2 73 47-2 44-74-2-73z" fill="#f9d604" stroke="#f9d604"/><path d="M641 883c-46 4-39 75 6 72 47-4 42-76-6-72z" fill="#f9d604" stroke="#f9d604"/><path d="M507 501c-38 7-29 67 13 60 38-6 28-67-13-60z" fill="#f9d604" stroke="#f9d604"/><path d="M193 874c-39 6-28 67 11 60 38-6 28-66-11-60z" fill="#f9d604" stroke="#f9d604"/><path d="M604 172c-35 7-24 64 14 56 36-7 26-64-14-56z" fill="#f9d604" stroke="#f9d604"/><path d="M111 590c-34 6-24 59 10 53 35-6 27-59-10-53z" fill="#f9d604" stroke="#f9d604"/><path d="M330 695c-33 6-23 59 11 52 33-6 22-58-11-52z" fill="#f9d604" stroke="#f9d604"/><path d="M930 131c-34 1-33 53 1 52s32-53-1-52z" fill="#f9d604" stroke="#f9d604"/><path d="M915 753c-32 4-26 55 8 50 32-5 24-54-8-50z" fill="#f9d604" stroke="#f9d604"/><path d="M129 55c-22 4-15 38 7 35 23-4 15-39-7-35z" fill="#f9d604" stroke="#f9d604"/><path d="M796 532c-20 4-15 35 6 31 21-3 14-34-6-31z" fill="#f9d604" stroke="#f9d604"/></g><g id="red" data-name="Red"><path d="M236 150c-115 3-109 179 6 175 112-4 110-177-6-175z" fill="#fc2624" stroke="#fc2624"/><path d="M911 572c-61 8-50 103 12 96s52-103-12-96z" fill="#fc2624" stroke="#fc2624"/><path d="M404 462c-42 7-33 75 13 67 43-6 33-74-13-67z" fill="#fc2624" stroke="#fc2624"/><path d="M264 777c-41 5-31 67 9 62s31-67-9-62z" fill="#fc2624" stroke="#fc2624"/><path d="M928 259c-39 6-30 67 11 61 38-6 30-66-11-61z" fill="#fc2624" stroke="#fc2624"/><path d="M710 484c-29 2-25 47 3 45 29-2 25-47-3-45z" fill="#fc2624" stroke="#fc2624"/><path d="M538 858c-27 3-22 45 5 41 26-3 21-43-5-41z" fill="#fc2624" stroke="#fc2624"/><path d="M101 136c-24 5-15 43 9 38 25-5 16-43-9-38z" fill="#fc2624" stroke="#fc2624"/><path d="M638 313c-24 4-16 40 7 37 24-4 17-41-7-37z" fill="#fc2624" stroke="#fc2624"/><path d="M554 79c-20 3-15 34 5 31s14-33-5-31z" fill="#fc2624" stroke="#fc2624"/><path d="M403 352c-20 3-14 34 5 31 20-3 14-34-5-31z" fill="#fc2624" stroke="#fc2624"/><path d="M96 832c-19 4-13 33 6 30s14-33-6-30z" fill="#fc2624" stroke="#fc2624"/><path d="M753 910c-19 4-13 33 6 30s13-33-6-30z" fill="#fc2624" stroke="#fc2624"/></g><g id="green" data-name="Green"><path d="M711 585c-113 10-100 184 14 174 115-10 99-183-14-174z" fill="#1ea931" stroke="#1ea931"/><path d="M650 67c-58 9-46 98 13 90 60-8 48-98-13-90z" fill="#1ea931" stroke="#1ea931"/><path d="M163 377c-55 7-45 94 13 86 55-7 43-93-13-86z" fill="#1ea931" stroke="#1ea931"/><path d="M378 842c-52 4-48 84 6 80 52-4 46-83-6-80z" fill="#1ea931" stroke="#1ea931"/><path d="M69 210c-44 8-33 77 14 69 45-7 33-77-14-69z" fill="#1ea931" stroke="#1ea931"/><path d="M351 110c-40 4-33 67 7 63s33-67-7-63z" fill="#1ea931" stroke="#1ea931"/><path d="M889 470c-39 5-32 66 7 62s32-66-7-62z" fill="#1ea931" stroke="#1ea931"/><path d="M481 392c-25 5-16 44 9 39 2
…
CSS background-image
.scattered-dots {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/KtZKGkjmCgVx/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.scattered-dots {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/KtZKGkjmCgVx/amnt.svg") center / contain no-repeat;
}
React
import ScatteredDotsSvg from "./scattered-dots.jsx"; // from the React tab above

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

Tags

Made with AMNT

AMNT Draw 1.2 drew this from the words Scattered Dots: Round dots of varied sizes placed irregularly across the frame. A flat element. as part of the pack Dots and grids, 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