Lume Dark icon
thesvg-color:lume-dark
The Lume Dark icon (thesvg-color:lume-dark) is a free SVG icon from the theSVG Color set by thesvg.org. It is drawn on a 443 × 443 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
- 443 × 443
- Tags
- lumedark
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="443" height="443" viewBox="0 0 443 443"><g fill="none"><path fill="#d06b57" d="M281.777 255.5c0 67.103-60.5 121.5-60.5 121.5s-60.5-54.397-60.5-121.5s60.5-121.5 60.5-121.5s60.5 54.397 60.5 121.5"/><path fill="#fff" d="M347.08 168.186c43.132 51.403 31.753 131.963 31.753 131.963s-81.312-2.782-124.445-54.186S222.635 114 222.635 114s81.312 2.782 124.445 54.186"/><path fill="#fff" d="M188.167 245.963c-43.133 51.404-124.444 54.186-124.444 54.186s-11.38-80.56 31.753-131.963C138.608 116.782 219.92 114 219.92 114s11.38 80.559-31.753 131.963M164.878 0a47.5 47.5 0 0 1 47.501 47.501a4 4 0 0 1-8 0a39.5 39.5 0 0 0-30.041-38.35c.023.28.039.563.039.849c0 5.523-4.477 10-10 10s-10-4.477-10-10s4.477-10 10-10q.136 0 .27.006q.115-.006.231-.006m113.501 0c5.523 0 10 4.477 10 10s-4.477 10-10 10s-10-4.477-10-10q.001-.429.038-.849a39.5 39.5 0 0 0-18.471 10.418a39.5 39.5 0 0 0-11.569 27.932a4 4 0 0 1-8 0A47.504 47.504 0 0 1 277.878 0q.115 0 .229.006q.136-.005.272-.006"/><path fill="#fff" d="M261.377 65c0 22.091-17.909 70-40 70s-40-47.909-40-70s17.909-40 40-40s40 17.909 40 40"/><circle cx="221.877" cy="271.5" r="171.5" fill="url(#SVGKNxFocfc)" opacity=".6"/><path fill="#fff" d="M146.211 216.259c-56.906 35.559-135.098 13.078-135.098 13.078s14.072-80.133 70.978-115.692s135.098-13.078 135.098-13.078s-14.071 80.133-70.978 115.692m214.585-102.616c56.906 35.559 70.978 115.692 70.978 115.692s-78.192 22.481-135.098-13.078s-70.978-115.693-70.978-115.693s78.192-22.48 135.098 13.079"/><defs><radialGradient id="SVGKNxFocfc" cx="0" cy="0" r="1" gradientTransform="rotate(90 -24.811 246.689)scale(171.5)" gradientUnits="userSpaceOnUse"><stop stop-color="#d06b57"/><stop offset="1" stop-color="#d06b57" stop-opacity="0"/></radialGradient></defs></g></svg>How to use the Lume Dark icon
React
import { Icon } from "@iconify/react";
<Icon icon="thesvg-color:lume-dark" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="thesvg-color:lume-dark" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="thesvg-color:lume-dark" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[thesvg-color--lume-dark]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/thesvg-color -->
<div class="i-thesvg-color:lume-dark"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="thesvg-color:lume-dark"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/thesvg-color/lume-dark.svg" alt="Lume Dark icon" width="24" height="24">Related icons in theSVG Color
Lume Dark icon FAQ
Is the Lume Dark 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 Lume Dark icon in React?
Install @iconify/react and render <Icon icon="thesvg-color:lume-dark" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Lume Dark icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/thesvg-color/lume-dark.svg" alt="Lume Dark icon">, or paste the SVG code inline to style it with CSS.