Dashy icon
thesvg-color:dashy
The Dashy icon (thesvg-color:dashy) is a free SVG icon from the theSVG Color set by thesvg.org. It is drawn on a 848 × 848 grid. theSVG Color icons are released under the MIT license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.
- Icon set
- theSVG Color
- Author
- thesvg.org
- License
- MIT
- Size
- 848 × 848
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="848" height="848" viewBox="0 0 848 848"><defs><linearGradient id="SVGr5flAcRR" x1="0" x2="1" y1="0" y2="1"><stop offset="0" stop-color="#00f5a0"/><stop offset="1" stop-color="#00d9f5"/></linearGradient></defs><path fill="url(#SVGr5flAcRR)" d="M11505 11650c-232-9-615-52-730-82c-22-6-65-14-95-18c-93-13-292-65-505-133c-138-44-334-116-400-147c-11-5-49-21-85-36c-36-14-139-64-229-110c-176-90-179-91-219-70c-46 25-291 126-305 126c-5 0-23 7-40 15c-18 8-54 21-82 29c-27 8-75 21-105 31c-118 36-381 92-515 110c-60 9-132 20-160 25c-67 12-739 13-803 0c-28-5-91-14-139-20c-137-16-380-67-503-104c-25-7-72-22-105-31c-235-69-606-234-835-372c-516-309-969-752-1297-1266c-35-54-63-100-63-102s-22-41-48-87c-47-81-107-200-151-303c-12-27-26-59-31-70c-105-229-204-589-267-970c-27-163-27-922 0-1070c48-264 69-367 93-450c14-49 31-112 38-140c8-27 20-66 26-85c7-19 18-51 25-70c250-714 670-1292 1312-1806c200-159 630-405 873-498c41-16 84-32 95-37c85-38 344-116 495-149c52-12 111-25 130-30c91-23 409-61 568-68c1228-54 2366 445 3161 1388c113 134 248 319 316 432c146 245 213 378 315 623c29 69 95 269 124 375c62 229 69 259 116 575c36 236 39 679 6 910c-25 175-56 353-72 411c-8 28-14 58-14 68c0 18-61 231-86 300c-8 22-21 59-29 81c-31 93-98 255-127 312c-23 43-23 43 64 215c156 314 275 613 341 863c84 314 95 365 147 690c11 72 39 421 47 601c7 154 9 153-252 144m-159-507c-15-239-90-643-120-643c-7 0-42 35-77 78c-95 116-299 322-432 435c-130 111-138 127-67 140c25 4 74 14 110 22s90 17 120 20c30 4 73 11 95 17c47 12 248 35 323 37l54 1zm-3508-123c144-10 317-31 417-51c28-5 82-16 120-24c102-20 294-73 365-100c19-8 47-16 61-19c15-3 37-15 50-26c24-20 24-20 4-36c-11-8-76-57-145-109c-126-94-256-204-415-350l-87-79l-61 31c-232 117-380 153-637 153c-389 0-681-121-956-395c-241-240-347-464-400-847c-25-180-22-184 129-153c159 33 458 12 574-41c17-8 35-14 40-14c16 0 191-107 238-145c57-47 61-61 30-126c-32-70-34-64 31-159c73-108 71-96 31-197c-35-88-84-233-127-371c-27-87-28-85 69-205c85-105 87-92-46-213c-430-393-854-682-1218-830c-33-14-69-29-80-34c-48-22-247-80-276-80c-5 0-33 35-64 79c-185 264-487 410-796 384c-84-7-89-3-89 79c0 154-112 312-284 404c-98 52-98 52-124 219s-17 343 26 510c6 22 20 78 32 125c246 961 881 1761 1774 2234c81 43 358 166 374 166c6 0 23 6 39 14c92 45 552 166 635 166c18 0 53 5 78 11c123 30 467 44 688 29m2381-93c165-129 250-204 436-391c194-195 259-269 378-427c68-90 68-88 16-214c-58-142-58-142-150-330c-349-713-929-1369-1577-1782c-48-30-103-65-122-78s-62-37-95-55s-64-36-70-40c-19-14-266-140-275-140c-30 0-364 268-559 449c-240 224-621 679-621 743c0 42 177 368 304 558c514 776 1265 1391 2101 1723c143 57 140 57 234-16m-2464-923c111-36 165-59 170-72c3-8-17-39-43-71c-128-149-361-483-457-654c-21-38-44-71-51-74c-8-3-58 24-112 60c-53 36-124 78-157 92c-33 15-69 31-80 35c-80 36-292 90-350 90c-69 0-73 18-27 104c145 269 430 473 707 507c98 12 343 2 400-17m3173-1315c14-41 31-88 38-106c8-17 14-40 14-52c0-11 6-35 14-53c29-68 88-355 113-553c25-193 25-615-1-800c-111-823-430-1478-995-2046c-361-363-673-576-1106-759c-55-23-120-51-145-62c-25-10-61-23-80-28s-55-16-80-25c-53-20-191-56-345-92c-78-18-151-27-252-30c-180-7-189-5-204 49c-61 226-240 440-461 550c-31 15-62 28-68 28c-7 0-26 7-43 15c-18 8-74 21-125 29s-96 17-101 20c-4 3-6 62-3 131c5 135-9 200-64 287c-58 91-179 178-291 207c-40 11-43 14-43 46c0 19 4 44 9 57s21 64 36 113c99 333 352 759 702 1180c131 158 303 345 318 345c3 0 39-28 82-63c130-106 123-103 196-82c98 28 189 57 225 71c18 8 38 14 44 14s51 16 99 35c115 45 115 45 221-22c90-57 90-57 137-39c97 38 103 37 164-46c186-249 238-488 184-833c-23-142-21-143 134-125c215 26 342 62 514 146c327 159 560 427 689 794c53 152 78 460 49 615s-33 171-58 240c-15 39-29 79-32 90c-4 11-24 53-45 93c-43 81-44 78 22 149c180 193 327 369 425 508c75 108 79 108 113 4m-3098-940c102-102 213-210 248-239c68-58 75-76 36-90c-61-24-100 5-355 261c-242 242-273 290-232 349c17 24 17 24 67-36c28-32 134-143 236-245m2242-1c56-162 60-182 59-343c-1-84-5-165-11-180s-15-48-21-74c-53-241-257-489-512-621c-48-25-49-25-63-6c-8 11-14 31-14 45c0 161-120 472-251 647c-36 48-32 61 24 93c70 39 269 163 312 193c68 49 277 205 350 263c92 72 97 71 127-17M5493 9653c-41-45-41-49 3-95c44-48 55-47 104 2s49 46-2 92c-52 47-64 47-105 1m-452-1367c-44-90-80-128-161-163c-82-36-88-65-18-83c90-25 142-75 189-185c33-77 46-76 80 10c36 89 106 157 181 175c71 17 64 44-22 88c-86 43-125 84-159 167c-15 38-32 70-38 72s-29-34-52-81m1242-284c-15-21-44-50-65-65c-47-34-49-58-4-79c18-9 47-36 63-60c37-56 67-61 86-16c17 39 41 62 80 77c40 15 35 46-12 79c-22 15-49 44-61 65c-28 48-52 48-87-1m3162 2073c-5-1-46-11-90-20c-124-27-224-84-325-185c-84-84-92-95-174-269c-7-15-11-90-11-205c1-181 1-181 41-267c69-144 153-237 289-316c182-107 456-109 645-6c304 167 436 546 299 859c-88 199-264 342-485 393c-81 19-160 25-189 16m156-406c193-75 249-300 116-462c-81-99-248-125-361-57c-298 181-78 647 245 519M8300 6362c-11-9-33-39-48-67c-27-50-80-94-137-112c-47-15-44-40 8-62c60-26 114-75 142-131c37-73 67-77 85-12c12 47 69 103 140 139c67 35 71 48 23 64c-85 27-151 91-168 162c-9 36-19 40-45 19m663-1152c-23-42-50-70-91-92c-36-19-42-44-13-53c34-10 71-46 91-86c26-49 41-49 73 0c15 22 47 54 72 71c53 36 55 44 18 66c-16 9-51 42-80 73l-51 56zm-1041-53c-40-42-40-69-1-107c40-37 46-37 92 1s47 62 1 105c-44 42-52 42-92 1" transform="matrix(.1 0 0 -.1 0 1536)"/></svg>How to use the Dashy icon
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:dashy" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:dashy" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:dashy" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--dashy]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:dashy"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:dashy"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/thesvg-color/dashy.svg" alt="Dashy icon" width="24" height="24">Dashy icon FAQ
Is the Dashy icon free for commercial use?
Yes. theSVG Color icons are released under the MIT license, which allows use in personal and commercial projects.
How do I use the Dashy icon in React?
Install @iconify/react and render <Icon icon="thesvg-color:dashy" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Dashy icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/thesvg-color/dashy.svg" alt="Dashy icon">, or paste the SVG code inline to style it with CSS.