lit icon logo

lit-icon from SVG Logos by Gil Barbara · Color · CC0-1.0 Free for personal and commercial use.

Name
lit-icon
Set
SVG Logos
Style
Color
Viewbox
256×320
License
CC0

Use the lit icon logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 320"><path fill="#00e8ff" d="m64 192l25.926-44.727l38.233-19.114l63.974 63.974l10.833 61.754L192 320l-64-64l-38.074-25.615z"/><path fill="#283198" d="M128 256V128l64-64v128zM0 256l64 64l9.202-60.602L64 192l-37.542 23.71z"/><path fill="#324fff" d="M64 192V64l64-64v128zm128 128V192l64-64v128zM0 256V128l64 64z"/><path fill="#0ff" d="M64 320V192l64 64z"/></svg>

React

import type { SVGProps } from "react";

export function LogosLitIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 320"><path fill="#00e8ff" d="m64 192l25.926-44.727l38.233-19.114l63.974 63.974l10.833 61.754L192 320l-64-64l-38.074-25.615z"/><path fill="#283198" d="M128 256V128l64-64v128zM0 256l64 64l9.202-60.602L64 192l-37.542 23.71z"/><path fill="#324fff" d="M64 192V64l64-64v128zm128 128V192l64-64v128zM0 256V128l64 64z"/><path fill="#0ff" d="M64 320V192l64 64z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 320"><path fill="#00e8ff" d="m64 192l25.926-44.727l38.233-19.114l63.974 63.974l10.833 61.754L192 320l-64-64l-38.074-25.615z"/><path fill="#283198" d="M128 256V128l64-64v128zM0 256l64 64l9.202-60.602L64 192l-37.542 23.71z"/><path fill="#324fff" d="M64 192V64l64-64v128zm128 128V192l64-64v128zM0 256V128l64 64z"/><path fill="#0ff" d="M64 320V192l64 64z"/></svg>
</template>

CSS

.icon-lit-icon {
  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%20256%20320%22%3E%3Cpath%20fill%3D%22%2300e8ff%22%20d%3D%22m64%20192l25.926-44.727l38.233-19.114l63.974%2063.974l10.833%2061.754L192%20320l-64-64l-38.074-25.615z%22%2F%3E%3Cpath%20fill%3D%22%23283198%22%20d%3D%22M128%20256V128l64-64v128zM0%20256l64%2064l9.202-60.602L64%20192l-37.542%2023.71z%22%2F%3E%3Cpath%20fill%3D%22%23324fff%22%20d%3D%22M64%20192V64l64-64v128zm128%20128V192l64-64v128zM0%20256V128l64%2064z%22%2F%3E%3Cpath%20fill%3D%22%230ff%22%20d%3D%22M64%20320V192l64%2064z%22%2F%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%20256%20320%22%3E%3Cpath%20fill%3D%22%2300e8ff%22%20d%3D%22m64%20192l25.926-44.727l38.233-19.114l63.974%2063.974l10.833%2061.754L192%20320l-64-64l-38.074-25.615z%22%2F%3E%3Cpath%20fill%3D%22%23283198%22%20d%3D%22M128%20256V128l64-64v128zM0%20256l64%2064l9.202-60.602L64%20192l-37.542%2023.71z%22%2F%3E%3Cpath%20fill%3D%22%23324fff%22%20d%3D%22M64%20192V64l64-64v128zm128%20128V192l64-64v128zM0%20256V128l64%2064z%22%2F%3E%3Cpath%20fill%3D%22%230ff%22%20d%3D%22M64%20320V192l64%2064z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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