Daisyui icon

logos:daisyui

The Daisyui icon (logos:daisyui) is a free SVG icon from the SVG Logos set by Gil Barbara. It is drawn on a 512 × 153 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: 512 × 153

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="153" viewBox="0 0 512 153"><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="M50.387 13.467c-1.952 2.876-3.504 6.212-4.526 10.009A31.72 31.72 0 0 1 23.476 45.86c-3.797 1.022-7.133 2.573-10.009 4.526c-4.076-21.319 15.601-40.996 36.92-36.92"/><path fill="#ffe029" d="M13.468 50.387c.652 3.414 1.914 6.87 3.876 10.278a31.72 31.72 0 0 1 0 31.657c-1.962 3.407-3.224 6.863-3.876 10.278c-17.957-12.193-17.957-40.02 0-52.213"/><path fill="#ffc141" d="M50.387 139.52c-1.952-2.876-3.504-6.213-4.526-10.01a31.72 31.72 0 0 0-22.385-22.384c-3.797-1.022-7.133-2.574-10.009-4.527c-4.076 21.32 15.601 40.996 36.92 36.92"/><path fill="#ffb655" d="M102.6 139.519c-3.414-.653-6.87-1.915-10.278-3.876a31.72 31.72 0 0 0-31.657 0c-3.407 1.961-6.863 3.224-10.278 3.876c12.193 17.957 40.02 17.957 52.213 0"/><path fill="#ffb35b" d="M139.52 102.6c-2.876 1.952-6.212 3.504-10.008 4.526a31.72 31.72 0 0 0-22.385 22.385c-1.022 3.796-2.574 7.133-4.527 10.008c21.319 4.076 40.996-15.6 36.92-36.92"/><path fill="#ffb656" d="M139.52 50.387c-.653 3.414-1.915 6.87-3.877 10.278a31.73 31.73 0 0 0 0 31.657c1.962 3.407 3.224 6.863 3.877 10.277c17.956-12.192 17.956-40.019 0-52.212"/><path fill="#ffc042" d="M102.6 13.467c1.953 2.876 3.505 6.212 4.527 10.009a31.73 31.73 0 0 0 22.385 22.385c3.796 1.022 7.132 2.573 10.008 4.526c4.076-21.319-15.601-40.995-36.92-36.92"/><path fill="#ffce2a" d="M50.387 13.467c3.415.653 6.87 1.915 10.278 3.877a31.72 31.72 0 0 0 31.657 0c3.408-1.962 6.864-3.224 10.278-3.877c-12.193-17.956-40.02-17.956-52.213 0"/></g><path fill="url(#SVGo2fMIbbC)" d="M45.862 23.475c1.022-3.796 2.573-7.132 4.526-10.008c3.414.653 6.87 1.914 10.277 3.876a31.72 31.72 0 0 0 31.657 0c3.408-1.962 6.864-3.223 10.279-3.876c1.952 2.876 3.504 6.212 4.526 10.008a31.72 31.72 0 0 0 22.385 22.385c3.796 1.023 7.133 2.574 10.008 4.527c-.652 3.414-1.914 6.87-3.876 10.277a31.72 31.72 0 0 0 0 31.658c1.962 3.407 3.224 6.863 3.876 10.277c-2.875 1.953-6.212 3.505-10.008 4.527a31.72 31.72 0 0 0-22.385 22.385c-1.022 3.796-2.574 7.133-4.526 10.008c-3.415-.652-6.87-1.914-10.279-3.876a31.73 31.73 0 0 0-31.657 0c-3.407 1.962-6.863 3.224-10.277 3.876c-1.953-2.875-3.504-6.212-4.526-10.008a31.72 31.72 0 0 0-22.385-22.385c-3.797-1.022-7.133-2.574-10.009-4.527c.653-3.414 1.914-6.87 3.876-10.277a31.72 31.72 0 0 0 0-31.658c-1.962-3.407-3.223-6.863-3.876-10.277c2.876-1.953 6.212-3.504 10.009-4.527a31.72 31.72 0 0 0 22.385-22.385"/><path fill="#ffa17a" d="m107.973 88.315l2.668 4.623a2.669 2.669 0 1 1-4.622 2.668l-2.668-4.622a2.669 2.669 0 0 1 4.622-2.669m-6.671.001l2.668 4.622a2.669 2.669 0 0 1-4.622 2.668l-2.668-4.622a2.669 2.669 0 1 1 4.622-2.668"/><path fill="#ffab89" d="m53.934 88.315l2.668 4.622a2.669 2.669 0 1 1-4.622 2.67l-2.669-4.623a2.669 2.669 0 1 1 4.623-2.669m-6.673 0l2.669 4.622a2.669 2.669 0 1 1-4.623 2.669l-2.668-4.622a2.669 2.669 0 1 1 4.622-2.669"/><path fill="#ffa17a" d="m103.308 56.673l5.155 1.381a2.669 2.669 0 0 1-1.381 5.156l-5.156-1.382a2.669 2.669 0 0 1 1.382-5.155"/><path fill="#ffab89" d="m44.55 58.054l5.156-1.381a2.669 2.669 0 1 1 1.381 5.155l-5.155 1.382a2.669 2.669 0 1 1-1.381-5.156"/><path stroke="#8b2c0c" stroke-opacity=".05" d="M70.66 86.004c1.407 1.56 3.904 2.669 6.005 2.669s4.596-1.11 6.004-2.669"/><path stroke="#d05b34" d="M70.66 85.337c1.407 1.56 3.904 2.669 6.005 2.669s4.596-1.11 6.004-2.669"/><g transform="translate(38.637 65.323)"><path d="m5.661 1.887l3.774 3.774a2.669 2.669 0 0 1-3.774 3.774L1.887 5.661a2.669 2.669 0 1 1 3.774-3.774"/><rect width="20.015" height="20.015" x="1.334" y="1.334" rx="10.007"/><rect width="20.015" height="20.015" x="1.334" y="2.001" fill-opacity=".05" rx="10.007"/><path fill="#784012" d="M3.79 14.01a8.01 8.01 0 0 1 15.101 0a8.01 8.01 0 0 1-15.1 0"/><path fill-opacity=".35" d="M18.027 15.748a8.006 8.006 0 1 0-13.618-.4a8 8 0 0 1 6.685-3.6a8 8 0 0 1 6.933 4"/><rect width="9.34" height="9.34" x="6.671" y="6.672" rx="4.67"/><circle cx="9.154" cy="6.612" r="4.003" fill="#fff"/><circle cx="16.669" cy="12.079" r="2.001" fill="#fff"/><circle cx="14.171" cy="16.244" r="1.334" fill="#fff"/></g><g transform="translate(93.343 65.323)"><path d="m19.53 5.66l-3.775 3.775a2.669 2.669 0 1 1-3.774-3.774l3.774-3.774A2.669 2.669 0 1 1 19.53 5.66"/><rect width="20.015" height="20.015" y="2.001" fill-opacity=".05" rx="10.007"/><rect width="20.015" height="20.015" y="1.334" rx="10.007"/><path fill="#784012" d="M2.47 14.047a8.009 8.009 0 0 1 15.162-.255a8.01 8.01 0 0 1-15.162.255"/><path fill-opacity=".35" d="M16.873 15.46a8.006 8.006 0 1 0-13.647.14a8 8 0 0 1 6.867-3.886a8 8 0 0 1 6.78 3.747"/><rect width="9.34" height="9.34" x="5.337" y="6.672" rx="4.67"/><circle cx="7.821" cy="6.612" r="4.003" fill="#fff"/><circle cx="15.335" cy="12.079" r="2.001" fill="#fff"/><circle cx="12.838" cy="16.244" r="1.334" fill="#fff"/></g><path d="M204.64 103.667q-7.269 0-13.02-3.597q-5.75-3.599-9.114-9.812q-3.255-6.215-3.255-13.956q0-7.849 3.255-14.064q3.364-6.214 9.006-9.812q5.75-3.598 13.129-3.598q5.642 0 10.09 2.29q4.557 2.289 7.27 6.432q2.82 4.034 3.038 9.158v18.753q-.217 5.123-2.93 9.266t-7.27 6.542t-10.198 2.398m2.388-13.192q4.013 0 6.944-1.744a12.44 12.44 0 0 0 4.665-5.015q1.736-3.27 1.736-7.523q0-3.9-1.538-6.929l-.198-.375q-1.627-3.271-4.665-5.015q-2.93-1.854-6.836-1.854q-4.014 0-7.052 1.854q-2.93 1.853-4.666 5.015q-1.627 3.162-1.627 7.304q0 4.253 1.627 7.523q1.736 3.162 4.774 5.015q3.038 1.744 6.836 1.744m26.691 12.102h-14.105V88.404l2.278-12.865l-2.387-12.647V25.787h14.214zm31.058 1.09q-7.161 0-12.911-3.597q-5.751-3.599-9.006-9.812q-3.255-6.215-3.255-13.956q0-7.849 3.255-14.064t9.006-9.812t12.911-3.598q5.642 0 10.091 2.29t7.053 6.432q2.712 4.034 2.929 9.158v18.97q-.217 5.234-2.93 9.267q-2.603 4.035-7.052 6.433q-4.45 2.29-10.09 2.29m2.604-13.192q5.968 0 9.657-3.925q3.69-4.033 3.689-10.357q0-3.9-1.538-6.929l-.198-.375q-1.532-3.079-4.313-4.805l-.353-.21q-2.929-1.854-6.944-1.854q-3.905 0-6.944 1.854q-2.93 1.743-4.665 5.015q-1.628 3.162-1.628 7.304q0 4.253 1.628 7.523q1.736 3.162 4.665 5.015q3.038 1.744 6.944 1.744m12.586 12.102V88.404l2.279-12.865l-2.279-12.647V51.364h14.106v51.213zm21.312 0V51.364H315.6v51.213zm7.16-60.437q-3.47 0-5.75-2.29q-2.278-2.397-2.278-5.887q0-3.38 2.278-5.778q2.28-2.398 5.75-2.398q3.582 0 5.751 2.398q2.28 2.4 2.28 5.778q0 3.49-2.28 5.888q-2.17 2.29-5.75 2.29m33.772 61.636q-4.448 0-8.789-1.199q-4.23-1.2-7.812-3.27q-3.58-2.181-6.184-5.234l8.463-8.612q2.712 3.051 6.293 4.578t7.92 1.527q3.472 0 5.208-.981q1.845-.982 1.845-2.944q0-2.18-1.953-3.38q-1.845-1.2-4.883-1.962l-4.195-1.212l-2.206-.642a40 40 0 0 1-6.293-2.725a14.7 14.7 0 0 1-4.991-4.688q-1.845-3.053-1.845-7.85q0-5.014 2.387-8.722q2.496-3.706 7.053-5.778t10.741-2.072q6.51 0 11.719 2.29q5.316 2.29 8.788 6.868l-8.571 8.613q-2.387-2.943-5.426-4.252q-2.93-1.308-6.401-1.308q-3.147 0-4.883.981q-1.627.981-1.627 2.726q0 1.962 1.844 3.053q1.953 1.089 4.991 1.962a85 85 0 0 1 6.293 1.853q3.364.982 6.293 2.835a14.34 14.34 0 0 1 4.648 4.53l.235.376q1.953 3.053 1.953 7.85q0 7.74-5.534 12.32q-5.534 4.47-15.081 4.47m45.489-.763L366.25 51.367h15.407l14.075 39.111l-5.93-.725l15.217-38.386h15.516l-22.741 51.65zm-16.64 25.083l18.05-37.402l8.68 12.32l-11.648 25.082zm88.323-24.429q-9.006 0-16.058-3.924q-6.944-4.035-10.959-11.012t-4.014-15.809V25.787h14.756v47.572q0 5.124 2.061 8.83q2.17 3.708 5.86 5.779q3.797 1.962 8.354 1.962q4.666 0 8.246-1.962q3.58-2.072 5.642-5.778q2.17-3.707 2.17-8.722V25.787h14.865v47.245q0 8.83-4.015 15.808q-4.014 6.869-10.958 10.903q-6.836 3.924-15.95 3.924m38.3-1.148V25.787h14.757v76.732z"/></svg>

How to use the Daisyui icon

React

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

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

Vue

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

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

Svelte

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

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

Tailwind CSS

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

UnoCSS

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

Web component

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

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

HTML image

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

Related icons in SVG Logos

Daisyui icon in other icon sets

Daisyui icon FAQ

Is the Daisyui 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 in React?

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

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

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

Browse all SVG Logos icons →