bklit

PreviousNext
Docs
svglcomponent

Preview

Loading preview…
././static/components-generated/bklitLight.tsx
import type { SVGProps } from "react";

const BklitLight = (props: SVGProps<SVGSVGElement>) => (
  <svg {...props} fill="none" viewBox="0 0 256 256">
    <g clipPath="url(#clip0_376_581)">
      <mask
        id="mask0_376_581"
        width="256"
        height="257"
        x="0"
        y="0"
        maskUnits="userSpaceOnUse"
        style={{ maskType: "alpha" }}
      >
        <rect
          width="256"
          height="257"
          fill="url(#paint0_linear_376_581)"
          rx="64"
        />
      </mask>
      <g mask="url(#mask0_376_581)">
        <rect width="256" height="256" fill="#000" rx="20" />
        <path
          fill="url(#paint1_linear_376_581)"
          d="M76.023 132.081s13.407-22.163 44.325-22.163c28.825 0 44.325 22.163 44.325 22.163s-13.552 22.163-44.325 22.162c-28.645 0-44.325-22.162-44.325-22.162"
          style={{ mixBlendMode: "luminosity" }}
        />
        <path
          fill="url(#paint2_linear_376_581)"
          d="M175.754 165.325c0 26.776-20.771 55.406-55.406 55.406v-66.487s27.811 1.377 44.325-22.163c8.421 11.265 11.081 23.025 11.081 33.244"
          style={{ mixBlendMode: "luminosity" }}
        />
        <path
          fill="url(#paint3_linear_376_581)"
          d="M64.941 165.325c0 26.776 20.771 55.406 55.407 55.406v-66.487s-25.934 1.45-44.325-22.163C67.6 143.346 64.94 155.106 64.94 165.325"
        />
        <path
          fill="url(#paint4_linear_376_581)"
          d="M64.941 98.837c0-26.776 20.771-55.406 55.407-55.406v66.488s-27.812-1.378-44.325 22.162C67.6 120.816 64.94 109.056 64.94 98.837"
        />
        <path
          fill="url(#paint5_linear_376_581)"
          d="M175.754 98.837c0-26.776-20.771-55.406-55.406-55.406v66.488s26.157-1.352 44.325 22.162c8.421-11.265 11.081-23.025 11.081-33.244"
        />
      </g>
    </g>
    <defs>
      <linearGradient
        id="paint0_linear_376_581"
        x1="0"
        x2="256.998"
        y1="0"
        y2="255.998"
        gradientUnits="userSpaceOnUse"
      >
        <stop stop-color="#ff6363" />
        <stop offset="1" stop-color="#d72a2a" />
      </linearGradient>
      <linearGradient
        id="paint1_linear_376_581"
        x1="164.673"
        x2="76.023"
        y1="132.081"
        y2="132.081"
        gradientUnits="userSpaceOnUse"
      >
        <stop stop-color="#fff" />
        <stop offset=".483" stop-color="#fff" stop-opacity=".8" />
        <stop offset="1" stop-color="#fff" />
      </linearGradient>
      <linearGradient
        id="paint2_linear_376_581"
        x1="120.348"
        x2="175.754"
        y1="220.731"
        y2="110.095"
        gradientUnits="userSpaceOnUse"
      >
        <stop stop-color="#fff" />
        <stop offset="1" stop-color="#fff" stop-opacity=".5" />
      </linearGradient>
      <linearGradient
        id="paint3_linear_376_581"
        x1="120.348"
        x2="64.941"
        y1="220.731"
        y2="110.095"
        gradientUnits="userSpaceOnUse"
      >
        <stop stop-color="#787878" stop-opacity="0" />
        <stop offset=".745" stop-color="#787878" stop-opacity=".5" />
      </linearGradient>
      <linearGradient
        id="paint4_linear_376_581"
        x1="120.348"
        x2="64.941"
        y1="43.431"
        y2="154.067"
        gradientUnits="userSpaceOnUse"
      >
        <stop stop-color="#fff" />
        <stop offset="1" stop-color="#fff" stop-opacity=".5" />
      </linearGradient>
      <linearGradient
        id="paint5_linear_376_581"
        x1="120.348"
        x2="175.754"
        y1="43.431"
        y2="154.067"
        gradientUnits="userSpaceOnUse"
      >
        <stop stop-color="#787878" stop-opacity="0" />
        <stop offset=".75" stop-color="#787878" stop-opacity=".5" />
      </linearGradient>
      <clipPath id="clip0_376_581">
        <path fill="#fff" d="M0 0h256v256H0z" />
      </clipPath>
    </defs>
  </svg>
);

export { BklitLight };

Installation

npx shadcn@latest add @svgl/bklit

Usage

import { Bklit } from "@/components/bklit"
<Bklit />