Area Chart SVG icon, line

<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/ZtiK0Rp9cTcc/amnt.svg" alt="Area Chart" width="48" height="48">

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024"><g id="navy" data-name="Navy"><path d="M120 240c7 7 15 18 27 13 27-11-34-60-42-60-8 1-67 49-40 60 12 5 19-6 26-14 5 26-1 54 0 80 1 30 0 59 0 89 0 58 0 117 0 175 0 29 1 58 1 87 0 7 2 17-1 24-2 3-5 3-6 5-12 11-16 24-11 39 6 18 28 26 45 19 5-1 8-7 13-9 11-4 71-2 87-2 121 0 242 0 364 0 60 0 120 0 180 0 27 0 164-4 180 2-21 20-5 36 11 27 8-4 13-13 19-19 4-5 13-10 15-16 7-16-16-30-25-39-21-19-36 3-18 17h-17v-121c51-27 21-83-27-63l-83-68c7-32-15-51-46-44-6-12-18-22-27-33-22-25-43-50-64-75-3-3-12-10-13-15 0-4 2-7 3-11 2-16-5-32-21-38-29-11-53 16-45 44-18 19-55 45-76 62-13 11-26 21-39 32-2 2-7 8-11 9-10 1-19-12-38 2s-10 28-13 38c-2 3-7 6-10 8-13 10-26 19-39 29-27 20-53 41-80 60-21-11-50-1-53 25-1 5 3 13 2 17-2 7-29 28-35 34-31 28-62 57-92 87zm512 24c22-5 33 29 10 34-22 6-32-28-10-34zm-14 46l11 5v403h-161v-256c24-13 30-22 25-50zM757 435c-14 24 1 41 21 53v230h-134v-402c2-2 6-3 9-2 3 0 43 50 49 57 18 21 34 46 55 64zM457 409c22-4 32 29 10 34-25 7-32-29-10-34zm327 26c22-1 26 34 3 36-22 2-26-34-3-36zM440 453l14 8v257h-166c0-33 1-68-1-101 0-31 4-14 19-32 15-19 1-28 11-39 11-10 24-18 36-27 21-15 41-31 62-46 8-6 19-12 25-20zm364 29l84 70c-7 23 7 35 25 45v121h-121c4-15 0-43 0-59 0-57 1-114 1-171zM277 545c23-3 29 32 6 35-23 4-29-32-6-35zm641 0c23-2 28 33 5 35-23 3-28-32-5-35zM262 592l11 6v120h-134l-2-8zM103 708c23-3 28 33 5 35-22 3-27-32-5-35z" fill="#021b43" stroke="#021b43"/></g><g id="turquoise" data-name="Turquoise"><path d="M618 310l-125 102c5 28-1 37-25 50v256h161v-403z" fill="#01b2aa" stroke="#01b2aa"/><path d="M757 435c-21-18-37-43-55-64-6-7-46-57-49-57-3-1-7 0-9 2v402h134v-230c-20-12-35-29-21-53z" fill="#01b2aa" stroke="#01b2aa"/><path d="M440 453c-6 8-17 14-25 20-21 15-41 31-62 46-12 9-25 17-36 27-10 11 4 20-11 39-15 18-19 1-19 32 2 33 1 68 1 101h166v-257z" fill="#01b2aa" stroke="#01b2aa"/><path d="M804 482l-11 6c0 57-1 114-1 171 0 16 4 44 0 59h121v-121c-18-10-32-22-25-45z" fill="#01b2aa" stroke="#01b2aa"/><path d="M262 592l-125 118 2 8h134v-120z" fill="#01b2aa" stroke="#01b2aa"/></g><g id="amber" data-name="Amber"><path d="M457 409c-22 5-15 41 10 34 22-5 12-38-10-34z" fill="#fdcc05" stroke="#fdcc05"/><path d="M277 545c-23 3-17 39 6 35 23-3 17-38-6-35z" fill="#fdcc05" stroke="#fdcc05"/><path d="M632 264c-22 6-12 40 10 34 23-5 12-39-10-34z" fill="#fdcc05" stroke="#fdcc05"/><path d="M918 545c-23 3-18 38 5 35 23-2 18-37-5-35z" fill="#fdcc05" stroke="#fdcc05"/><path d="M784 435c-23 2-19 38 3 36 23-2 19-37-3-36z" fill="#fdcc05" stroke="#fdcc05"/><path d="M103 708c-22 3-17 38 5 35 23-2 18-38-5-35z" fill="#fdcc05" stroke="#fdcc05"/></g></svg>

.area-chart {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/ZtiK0Rp9cTcc/amnt.svg");
  background-size: contain;
}

.area-chart {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/ZtiK0Rp9cTcc/amnt.svg") center / contain no-repeat;
}

import AreaChartSvg from "./area-chart.jsx"; // from the React tab above

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