Daisyui Icon icon

logos:daisyui-icon

The Daisyui Icon icon (logos:daisyui-icon) is a free SVG icon from the SVG Logos set by Gil Barbara. It is drawn on a 256 × 256 grid. SVG Logos icons are released under the CC0 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: SVG Logos
Author: Gil Barbara
License: CC0-1.0
Size: 256 × 256
Tags: daisyuiicon

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256"><defs><radialGradient id="SVGo2fMIbbC" cx="-.044%" cy="-.044%" r="141.466%" fx="-.044%" fy="-.044%"><stop offset="0%" stop-color="#ffe600"/><stop offset="100%" stop-color="#ffa573"/></radialGradient></defs><g opacity=".7"><path fill="#ffd819" d="M84.315 22.535c-3.267 4.812-5.864 10.394-7.575 16.748A53.08 53.08 0 0 1 39.283 76.74c-6.353 1.71-11.936 4.307-16.748 7.575c-6.82-35.674 26.106-68.6 61.78-61.78"/><path fill="#ffe029" d="M22.536 84.314c1.092 5.713 3.204 11.497 6.486 17.199a53.08 53.08 0 0 1 0 52.973c-3.283 5.702-5.394 11.485-6.486 17.198c-30.048-20.402-30.048-66.967 0-87.37"/><path fill="#ffc141" d="M84.315 233.463c-3.267-4.811-5.864-10.394-7.575-16.747a53.08 53.08 0 0 0-37.457-37.458c-6.353-1.71-11.936-4.307-16.748-7.575c-6.82 35.674 26.106 68.6 61.78 61.78"/><path fill="#ffb655" d="M171.685 233.463c-5.713-1.092-11.496-3.204-17.198-6.486a53.08 53.08 0 0 0-52.973 0c-5.702 3.282-11.486 5.394-17.199 6.486c20.403 30.048 66.968 30.048 87.37 0"/><path fill="#ffb35b" d="M233.465 171.684c-4.812 3.268-10.394 5.863-16.748 7.574a53.08 53.08 0 0 0-37.457 37.458c-1.71 6.353-4.307 11.936-7.575 16.747c35.673 6.82 68.6-26.106 61.78-61.78"/><path fill="#ffb656" d="M233.465 84.315c-1.093 5.713-3.204 11.496-6.487 17.198a53.09 53.09 0 0 0 0 52.973c3.283 5.702 5.394 11.485 6.487 17.198c30.047-20.402 30.047-66.966 0-87.37"/><path fill="#ffc042" d="M171.685 22.535c3.268 4.812 5.864 10.394 7.575 16.748a53.09 53.09 0 0 0 37.457 37.457c6.354 1.71 11.936 4.307 16.748 7.574c6.82-35.673-26.107-68.599-61.78-61.78"/><path fill="#ffce2a" d="M84.315 22.535c5.713 1.093 11.496 3.204 17.199 6.487a53.08 53.08 0 0 0 52.972 0c5.703-3.283 11.486-5.394 17.199-6.487c-20.403-30.047-66.967-30.047-87.37 0"/></g><path fill="url(#SVGo2fMIbbC)" d="M76.742 39.282c1.71-6.353 4.307-11.935 7.575-16.747c5.712 1.092 11.496 3.204 17.197 6.486a53.08 53.08 0 0 0 52.973 0c5.702-3.283 11.486-5.394 17.199-6.486c3.267 4.812 5.864 10.394 7.574 16.747a53.08 53.08 0 0 0 37.458 37.458c6.353 1.71 11.935 4.307 16.747 7.574c-1.092 5.713-3.203 11.497-6.487 17.198a53.09 53.09 0 0 0 0 52.974c3.284 5.701 5.395 11.485 6.487 17.198c-4.812 3.268-10.394 5.863-16.747 7.574a53.08 53.08 0 0 0-37.458 37.458c-1.71 6.353-4.307 11.936-7.574 16.747c-5.713-1.092-11.497-3.203-17.199-6.486a53.09 53.09 0 0 0-52.973 0c-5.701 3.283-11.485 5.394-17.197 6.486c-3.268-4.811-5.865-10.394-7.575-16.747a53.08 53.08 0 0 0-37.458-37.458c-6.353-1.71-11.935-4.307-16.747-7.575c1.092-5.712 3.203-11.496 6.486-17.197a53.09 53.09 0 0 0 0-52.974c-3.283-5.701-5.394-11.484-6.486-17.197c4.811-3.268 10.394-5.864 16.747-7.575a53.08 53.08 0 0 0 37.458-37.458"/><path fill="#ffa17a" d="m180.675 147.783l4.465 7.734a4.466 4.466 0 0 1-7.734 4.466l-4.466-7.735a4.466 4.466 0 0 1 7.735-4.465m-11.163-.001l4.466 7.734a4.466 4.466 0 0 1-7.735 4.466l-4.465-7.735a4.466 4.466 0 0 1 7.734-4.465"/><path fill="#ffab89" d="m90.249 147.782l4.465 7.735a4.466 4.466 0 0 1-7.734 4.465l-4.466-7.734a4.466 4.466 0 0 1 7.735-4.466m-11.164.001l4.465 7.734a4.466 4.466 0 0 1-7.734 4.466l-4.466-7.735a4.466 4.466 0 0 1 7.735-4.465"/><path fill="#ffa17a" d="m172.87 94.833l8.626 2.312a4.466 4.466 0 0 1-2.312 8.627l-8.626-2.312a4.466 4.466 0 0 1 2.311-8.627"/><path fill="#ffab89" d="m74.548 97.145l8.627-2.312a4.466 4.466 0 0 1 2.312 8.627l-8.627 2.311a4.466 4.466 0 1 1-2.312-8.626"/><g stroke-linecap="round" stroke-width="12"><path stroke="#8b2c0c" stroke-opacity=".05" d="M118.24 143.915c2.355 2.61 6.532 4.466 10.048 4.466c3.514 0 7.692-1.857 10.047-4.466"/><path stroke="#d05b34" d="M118.24 142.799c2.355 2.61 6.532 4.465 10.048 4.465c3.514 0 7.692-1.856 10.047-4.465"/></g><g transform="translate(64.653 109.307)"><path d="m9.473 3.158l6.315 6.315a4.466 4.466 0 1 1-6.315 6.315L3.158 9.473a4.466 4.466 0 0 1 6.315-6.315"/><rect width="33.491" height="33.491" x="2.232" y="2.233" rx="16.746"/><rect width="33.491" height="33.491" x="2.232" y="3.349" fill-opacity=".05" rx="16.746"/><path fill="#784012" d="M6.343 23.443c1.84-5.203 6.801-8.93 12.634-8.93s10.795 3.728 12.635 8.932c-1.84 5.202-6.802 8.93-12.634 8.93c-5.834 0-10.796-3.729-12.635-8.932"/><path fill-opacity=".35" d="M30.166 26.352a13.33 13.33 0 0 0 2.21-7.373c0-7.4-5.999-13.397-13.397-13.397S5.582 11.58 5.582 18.979c0 2.442.654 4.732 1.796 6.704a13.39 13.39 0 0 1 11.187-6.024c4.956 0 9.284 2.692 11.6 6.693"/><rect width="15.629" height="15.629" x="11.163" y="11.164" rx="7.815"/><circle cx="15.319" cy="11.064" r="6.698" fill="#fff"/><circle cx="27.893" cy="20.212" r="3.349" fill="#fff"/><circle cx="23.714" cy="27.182" r="2.233" fill="#fff"/></g><g transform="translate(156.196 109.307)"><path d="m32.679 9.473l-6.316 6.315a4.466 4.466 0 1 1-6.315-6.315l6.315-6.315a4.466 4.466 0 1 1 6.316 6.315"/><rect width="33.491" height="33.491" y="3.349" fill-opacity=".05" rx="16.746"/><rect width="33.491" height="33.491" y="2.233" rx="16.746"/><path fill="#784012" d="M4.134 23.505c1.732-5.394 6.789-9.296 12.757-9.296c5.81 0 10.757 3.699 12.613 8.87c-1.732 5.393-6.79 9.296-12.757 9.296c-5.81 0-10.757-3.699-12.613-8.87"/><path fill-opacity=".35" d="M28.235 25.871a13.33 13.33 0 0 0 1.907-6.892c0-7.399-5.998-13.397-13.397-13.397S3.349 11.58 3.349 18.979c0 2.619.751 5.062 2.05 7.126a13.39 13.39 0 0 1 11.49-6.504c4.78 0 8.975 2.503 11.346 6.27"/><rect width="15.629" height="15.629" x="8.931" y="11.164" rx="7.815"/><circle cx="13.087" cy="11.064" r="6.698" fill="#fff"/><circle cx="25.661" cy="20.212" r="3.349" fill="#fff"/><circle cx="21.482" cy="27.182" r="2.233" fill="#fff"/></g></svg>

How to use the Daisyui Icon icon

React

import { Icon } from "@iconify/react";

<Icon icon="logos:daisyui-icon" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="logos:daisyui-icon" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="logos:daisyui-icon" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[logos--daisyui-icon]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/logos -->
<div class="i-logos:daisyui-icon"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="logos:daisyui-icon"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/logos/daisyui-icon.svg" alt="Daisyui Icon icon" width="24" height="24">

Related icons in SVG Logos

Daisyui Icon icon FAQ

Is the Daisyui Icon icon free for commercial use?

Yes. SVG Logos icons are released under the CC0 license, which allows use in personal and commercial projects.

How do I use the Daisyui Icon icon in React?

Install @iconify/react and render <Icon icon="logos:daisyui-icon" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Daisyui Icon icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/logos/daisyui-icon.svg" alt="Daisyui Icon icon">, or paste the SVG code inline to style it with CSS.

Browse all SVG Logos icons →