luna logo

luna from Web3 Icons Branded by 0xa3k5 · Branded · MIT Free for personal and commercial use.

Name: luna
Set: Web3 Icons Branded
Style: Branded
Viewbox: 24×24
License: MIT

1 other variant in Web3 Icons Branded

Use the luna logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="#f2e373" d="M11.5 21a8 8 0 1 0 0-16a8 8 0 0 0 0 16"/><path fill="url(#SVGXifoSbhG)" d="M14 3c-.67 1-1.964 1.695-2.86 2.005a8 8 0 0 0-7.54 9.26c.72 2.2 2.216 3.7 4.276 3.815c2.15.125 4.244-.645 5.225-3.01c.79-1.9 2.18-2.455 2.774-2.57H20.5l-1.125-.8c-1.665-1.425-4.24-1.265-4.92-.675a3.7 3.7 0 0 1-2.09.88c-2.554 0-2.78-1.935-2.78-2.39v-.05c-.004-.52-.014-2.015 2.386-2.82a3.1 3.1 0 0 0 1.77-1.33h-.006c.51-.79.4-1.9.266-2.315"/><path fill="url(#SVG0NoLOP6B)" d="M18.04 17.61a8 8 0 0 1-14.41-3.184c.485 1.42 1.925 3.704 4.61 3.654c2.915-.05 4.36-1.87 4.75-2.88c.395-1 1.375-2.34 2.875-2.7c-.615.38-1.735 1.425-1.62 2.7c.135 1.555 1.39 2.585 3.795 2.41"/><defs><linearGradient id="SVGXifoSbhG" x1="7.101" x2="16.812" y1="5.898" y2="14.155" gradientUnits="userSpaceOnUse"><stop stop-color="#f5c859"/><stop offset="1" stop-color="#de3633"/></linearGradient><linearGradient id="SVG0NoLOP6B" x1="8.69" x2="11.525" y1="16.09" y2="21.045" gradientUnits="userSpaceOnUse"><stop stop-color="#f3be56"/><stop offset="1" stop-color="#e04437"/></linearGradient></defs></g></svg>

React

import type { SVGProps } from "react";

export function TokenBrandedLuna(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="#f2e373" d="M11.5 21a8 8 0 1 0 0-16a8 8 0 0 0 0 16"/><path fill="url(#SVGXifoSbhG)" d="M14 3c-.67 1-1.964 1.695-2.86 2.005a8 8 0 0 0-7.54 9.26c.72 2.2 2.216 3.7 4.276 3.815c2.15.125 4.244-.645 5.225-3.01c.79-1.9 2.18-2.455 2.774-2.57H20.5l-1.125-.8c-1.665-1.425-4.24-1.265-4.92-.675a3.7 3.7 0 0 1-2.09.88c-2.554 0-2.78-1.935-2.78-2.39v-.05c-.004-.52-.014-2.015 2.386-2.82a3.1 3.1 0 0 0 1.77-1.33h-.006c.51-.79.4-1.9.266-2.315"/><path fill="url(#SVG0NoLOP6B)" d="M18.04 17.61a8 8 0 0 1-14.41-3.184c.485 1.42 1.925 3.704 4.61 3.654c2.915-.05 4.36-1.87 4.75-2.88c.395-1 1.375-2.34 2.875-2.7c-.615.38-1.735 1.425-1.62 2.7c.135 1.555 1.39 2.585 3.795 2.41"/><defs><linearGradient id="SVGXifoSbhG" x1="7.101" x2="16.812" y1="5.898" y2="14.155" gradientUnits="userSpaceOnUse"><stop stopColor="#f5c859"/><stop offset="1" stopColor="#de3633"/></linearGradient><linearGradient id="SVG0NoLOP6B" x1="8.69" x2="11.525" y1="16.09" y2="21.045" gradientUnits="userSpaceOnUse"><stop stopColor="#f3be56"/><stop offset="1" stopColor="#e04437"/></linearGradient></defs></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none"><path fill="#f2e373" d="M11.5 21a8 8 0 1 0 0-16a8 8 0 0 0 0 16"/><path fill="url(#SVGXifoSbhG)" d="M14 3c-.67 1-1.964 1.695-2.86 2.005a8 8 0 0 0-7.54 9.26c.72 2.2 2.216 3.7 4.276 3.815c2.15.125 4.244-.645 5.225-3.01c.79-1.9 2.18-2.455 2.774-2.57H20.5l-1.125-.8c-1.665-1.425-4.24-1.265-4.92-.675a3.7 3.7 0 0 1-2.09.88c-2.554 0-2.78-1.935-2.78-2.39v-.05c-.004-.52-.014-2.015 2.386-2.82a3.1 3.1 0 0 0 1.77-1.33h-.006c.51-.79.4-1.9.266-2.315"/><path fill="url(#SVG0NoLOP6B)" d="M18.04 17.61a8 8 0 0 1-14.41-3.184c.485 1.42 1.925 3.704 4.61 3.654c2.915-.05 4.36-1.87 4.75-2.88c.395-1 1.375-2.34 2.875-2.7c-.615.38-1.735 1.425-1.62 2.7c.135 1.555 1.39 2.585 3.795 2.41"/><defs><linearGradient id="SVGXifoSbhG" x1="7.101" x2="16.812" y1="5.898" y2="14.155" gradientUnits="userSpaceOnUse"><stop stop-color="#f5c859"/><stop offset="1" stop-color="#de3633"/></linearGradient><linearGradient id="SVG0NoLOP6B" x1="8.69" x2="11.525" y1="16.09" y2="21.045" gradientUnits="userSpaceOnUse"><stop stop-color="#f3be56"/><stop offset="1" stop-color="#e04437"/></linearGradient></defs></g></svg>
</template>

CSS

.icon-luna {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22%23f2e373%22%20d%3D%22M11.5%2021a8%208%200%201%200%200-16a8%208%200%200%200%200%2016%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGXifoSbhG)%22%20d%3D%22M14%203c-.67%201-1.964%201.695-2.86%202.005a8%208%200%200%200-7.54%209.26c.72%202.2%202.216%203.7%204.276%203.815c2.15.125%204.244-.645%205.225-3.01c.79-1.9%202.18-2.455%202.774-2.57H20.5l-1.125-.8c-1.665-1.425-4.24-1.265-4.92-.675a3.7%203.7%200%200%201-2.09.88c-2.554%200-2.78-1.935-2.78-2.39v-.05c-.004-.52-.014-2.015%202.386-2.82a3.1%203.1%200%200%200%201.77-1.33h-.006c.51-.79.4-1.9.266-2.315%22%2F%3E%3Cpath%20fill%3D%22url(%23SVG0NoLOP6B)%22%20d%3D%22M18.04%2017.61a8%208%200%200%201-14.41-3.184c.485%201.42%201.925%203.704%204.61%203.654c2.915-.05%204.36-1.87%204.75-2.88c.395-1%201.375-2.34%202.875-2.7c-.615.38-1.735%201.425-1.62%202.7c.135%201.555%201.39%202.585%203.795%202.41%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGXifoSbhG%22%20x1%3D%227.101%22%20x2%3D%2216.812%22%20y1%3D%225.898%22%20y2%3D%2214.155%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23f5c859%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23de3633%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVG0NoLOP6B%22%20x1%3D%228.69%22%20x2%3D%2211.525%22%20y1%3D%2216.09%22%20y2%3D%2221.045%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23f3be56%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23e04437%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22%23f2e373%22%20d%3D%22M11.5%2021a8%208%200%201%200%200-16a8%208%200%200%200%200%2016%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGXifoSbhG)%22%20d%3D%22M14%203c-.67%201-1.964%201.695-2.86%202.005a8%208%200%200%200-7.54%209.26c.72%202.2%202.216%203.7%204.276%203.815c2.15.125%204.244-.645%205.225-3.01c.79-1.9%202.18-2.455%202.774-2.57H20.5l-1.125-.8c-1.665-1.425-4.24-1.265-4.92-.675a3.7%203.7%200%200%201-2.09.88c-2.554%200-2.78-1.935-2.78-2.39v-.05c-.004-.52-.014-2.015%202.386-2.82a3.1%203.1%200%200%200%201.77-1.33h-.006c.51-.79.4-1.9.266-2.315%22%2F%3E%3Cpath%20fill%3D%22url(%23SVG0NoLOP6B)%22%20d%3D%22M18.04%2017.61a8%208%200%200%201-14.41-3.184c.485%201.42%201.925%203.704%204.61%203.654c2.915-.05%204.36-1.87%204.75-2.88c.395-1%201.375-2.34%202.875-2.7c-.615.38-1.735%201.425-1.62%202.7c.135%201.555%201.39%202.585%203.795%202.41%22%2F%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGXifoSbhG%22%20x1%3D%227.101%22%20x2%3D%2216.812%22%20y1%3D%225.898%22%20y2%3D%2214.155%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23f5c859%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23de3633%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVG0NoLOP6B%22%20x1%3D%228.69%22%20x2%3D%2211.525%22%20y1%3D%2216.09%22%20y2%3D%2221.045%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20stop-color%3D%22%23f3be56%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23e04437%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/token-branded/luna.svg?color=%231a73e8&size=48