# Contact 4

> Contact

A shadcn/ui block from the [@cnippet-blocks](https://blocks.cnippet.dev/?utm_source=shadcn.exchange) registry, listed on [shadcn.exchange](https://shadcn.exchange/r/cnippet-blocks/contact-4).

- Page, with a live preview: https://shadcn.exchange/r/cnippet-blocks/contact-4
- Screenshot: https://shadcn.exchange/shot/cnippet-blocks/contact-4/light.png
- Registry item: https://blocks.cnippet.dev/r/contact-4.json
- Categories: contact
- Listed: 2026-11-01, source last changed 2026-11-01

## Install

```bash
npx shadcn@latest add https://shadcn.exchange/r/cnippet-blocks/contact-4.json
```

Run it in a project that has shadcn/ui set up. It adds the files below and installs what they depend on.

## Dependencies

- npm packages: `@hugeicons/core-free-icons`, `@hugeicons/react`, `zod`
- Registry items: `@cnippet/badge`, `@cnippet/button`, `@cnippet/checkbox`, `@cnippet/field`, `@cnippet/form`, `@cnippet/input`, `@cnippet/label`, `@cnippet/textarea`

## Files

### `registry/default/sections/contact-4.tsx`

```tsx
"use client";

import Link from "next/link";
import * as React from "react";
import { z } from "zod";

import { Icons } from "@/components/icons";
import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { Checkbox } from "@/components/ui/checkbox";
import { Field, FieldError, FieldLabel } from "@/components/ui/field";
import { Form } from "@/components/ui/form";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { Textarea } from "@/components/ui/textarea";

const schema = z.object({
  email: z.email("Please enter a valid email."),
  firstName: z.string().min(1, { message: "Please enter your first name." }),
  lastName: z.string().min(1, { message: "Please enter your last name." }),
  message: z.string().min(1, { message: "Please enter your message." }),
  phone: z.string().min(1, { message: "Please enter your phone number." }),
});

type Errors = Record<string, string | string[]>;

export default function Component() {
  const [loading, setLoading] = React.useState(false);
  const [errors, setErrors] = React.useState<Errors>({});

  const onSubmit = async (event: React.SyntheticEvent<HTMLFormElement>) => {
    event.preventDefault();
    const formData = new FormData(event.currentTarget);
    setLoading(true);
    const result = schema.safeParse(Object.fromEntries(formData));
    await new Promise((r) => setTimeout(r, 800));
    if (!result.success) {
      setErrors(
        result.error.flatten((issue) => issue.message).fieldErrors as Errors,
      );
    } else {
      setErrors({});
    }
    setLoading(false);
  };

  return (
    <section className="relative min-h-screen w-full overflow-hidden bg-white px-4 py-12 sm:px-6 sm:py-24 dark:bg-background">
      <div>
        <svg
          className="absolute bottom-0 left-0 text-neutral-100 dark:text-neutral-800"
          fill="none"
          height="173"
          viewBox="0 0 565 173"
          width="565"
          xmlns="http://www.w3.org/2000/svg"
        >
          <g clipPath="url(#clip0_contact3_bl)">
            <path
              d="M624.397 459.26C639.052 348.921 614.275 239.669 552.008 189.103C479.521 130.236 356.226 150.899 185.185 341.956C258.688 -373.405 -97.0201 381.43 -11.1897 43.599"
              stroke="currentColor"
              strokeLinecap="round"
              strokeLinejoin="round"
              strokeWidth="40"
            />
          </g>
          <defs>
            <clipPath id="clip0_contact3_bl">
              <rect fill="white" height="173" width="565" />
            </clipPath>
          </defs>
        </svg>

        <svg
          className="absolute top-0 right-0 text-neutral-100 dark:text-neutral-800"
          fill="none"
          height="173"
          viewBox="0 0 231 173"
          width="231"
          xmlns="http://www.w3.org/2000/svg"
        >
          <g clipPath="url(#clip0_contact3_tr)">
            <path
              d="M54.6842 -3.62396e-05C11.9702 46.7737 7.62612 97.7134 54.6842 127.274C109.466 161.686 233.908 167.125 448.569 103.29C192.422 409.071 731.375 119.177 561.032 257.562"
              stroke="currentColor"
              strokeLinecap="round"
              strokeLinejoin="round"
              strokeWidth="40"
            />
          </g>
          <defs>
            <clipPath id="clip0_contact3_tr">
              <rect fill="white" height="173" width="231" />
            </clipPath>
          </defs>
        </svg>
      </div>

      <div className="relative z-10 mx-auto w-full max-w-lg">
        <div className="mb-8 flex justify-center">
          <Badge
            className="border-none bg-white py-0.5 font-medium shadow dark:bg-neutral-800"
            variant="secondary"
          >
            <Icons.zap className="size-3 fill-neutral-400 text-neutral-400" />
            Real Feedback
          </Badge>
        </div>

        <div className="mb-4 text-center">
          <h1 className="font-medium text-4xl text-neutral-900 tracking-tight md:text-5xl dark:text-neutral-100">
            Feel free to send our
            <br />
            friendly team a message
          </h1>
        </div>

        <div className="mb-12 text-center">
          <p className="text-lg text-neutral-600 dark:text-neutral-400">
            Real stories from teams transforming workflows with Cnippet.
          </p>
        </div>

        <Form
          className="flex flex-col gap-6"
          errors={errors}
          onSubmit={onSubmit}
        >
          <div className="grid gap-6 md:grid-cols-2">
            <Field className="gap-3" name="firstName">
              <FieldLabel className="text-neutral-900 dark:text-neutral-100">
                Your Name <span className="text-blue-500">*</span>
              </FieldLabel>
              <Input
                className="border-neutral-200 bg-white py-1 dark:border-neutral-700 dark:bg-background dark:text-neutral-100 dark:placeholder:text-neutral-500"
                disabled={loading}
                name="firstName"
                placeholder="John"
              />
              <FieldError />
            </Field>
            <Field className="gap-3" name="lastName">
              <FieldLabel className="text-neutral-900 dark:text-neutral-100">
                Last Name <span className="text-blue-500">*</span>
              </FieldLabel>
              <Input
                className="border-neutral-200 bg-white py-1 dark:border-neutral-700 dark:bg-background dark:text-neutral-100 dark:placeholder:text-neutral-500"
                disabled={loading}
                name="lastName"
                placeholder="Doe"
              />
              <FieldError />
            </Field>
          </div>

          <div className="grid gap-6 md:grid-cols-2">
            <Field className="gap-3" name="email">
              <FieldLabel className="text-neutral-900 dark:text-neutral-100">
                Email <span className="text-blue-500">*</span>
              </FieldLabel>
              <Input
                className="border-neutral-200 bg-white py-1 dark:border-neutral-700 dark:bg-background dark:text-neutral-100 dark:placeholder:text-neutral-500"
                disabled={loading}
                name="email"
                placeholder="cnippet@connect.com"
                type="email"
              />
              <FieldError />
            </Field>
            <Field className="gap-3" name="phone">
              <FieldLabel className="text-neutral-900 dark:text-neutral-100">
                Phone Number <span className="text-blue-500">*</span>
              </FieldLabel>
              <Input
                className="border-neutral-200 bg-white py-1 dark:border-neutral-700 dark:bg-background dark:text-neutral-100 dark:placeholder:text-neutral-500"
                disabled={loading}
                name="phone"
                placeholder="(555) 000-0000"
                type="tel"
              />
              <FieldError />
            </Field>
          </div>

          <Field className="gap-3" name="message">
            <FieldLabel className="text-neutral-900 dark:text-neutral-100">
              How can we help? <span className="text-blue-500">*</span>
            </FieldLabel>
            <Textarea
              className="min-h-32 resize-none border-neutral-200 bg-white py-4 dark:border-neutral-700 dark:bg-background dark:text-neutral-100 dark:placeholder:text-neutral-500"
              disabled={loading}
              name="message"
              placeholder="Write your message here..."
            />
            <FieldError />
          </Field>

          <div className="flex items-center gap-2">
            <Checkbox
              className="border-neutral-300 dark:border-neutral-600"
              id="privacy"
            />
            <Label
              className="cursor-pointer text-neutral-900 text-sm dark:text-neutral-100"
              htmlFor="privacy"
            >
              I Agree to the privacy policy
            </Label>
          </div>

          <div className="flex flex-col gap-4 pt-4 md:flex-row md:items-center md:justify-between">
            <p className="w-full text-neutral-600 text-xs md:w-1/2 dark:text-neutral-400">
              By submitting, I acknowledge that I have read and agree to the{" "}
              <Link
                className="text-neutral-900 underline hover:no-underline dark:text-neutral-100"
                href="#"
              >
                Privacy Policy.
              </Link>
            </p>

            <Button
              className="rounded-lg border-blue-500 bg-blue-600 px-6 py-2 font-medium text-white hover:bg-blue-700 dark:bg-blue-600 dark:hover:bg-blue-700"
              disabled={loading}
              type="submit"
            >
              Submit Form
            </Button>
          </div>
        </Form>
      </div>
    </section>
  );
}
```

### `components/icons.tsx`

```tsx
import {
  CssFile01Icon,
  Folder01Icon,
  ThirdBracketIcon,
  Typescript02Icon,
} from "@hugeicons/core-free-icons";
import { HugeiconsIcon } from "@hugeicons/react";

type IconProps = React.HTMLAttributes<SVGElement>;

export const Icons = {
  alert: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 20 20"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M3.3841 12.3103L2.76708 12.2107L3.3841 12.3103ZM16.6159 12.3103L17.2329 12.2107L16.6159 12.3103ZM15.7962 7.22789L15.1791 7.32741L15.7962 7.22789ZM4.20384 7.22789L4.82087 7.32741L4.20384 7.22789ZM1.38465 5.87047C1.28993 6.2024 1.48222 6.54826 1.81415 6.64299C2.14608 6.73771 2.49194 6.54541 2.58666 6.21349L1.38465 5.87047ZM4.69255 2.74322C4.94283 2.50551 4.95302 2.10991 4.71531 1.85963C4.4776 1.60934 4.08201 1.59915 3.83172 1.83686L4.69255 2.74322ZM16.1683 1.83686C15.918 1.59915 15.5224 1.60934 15.2847 1.85963C15.047 2.10991 15.0572 2.50551 15.3075 2.74322L16.1683 1.83686ZM17.4134 6.21349C17.5081 6.54541 17.8539 6.73771 18.1859 6.64299C18.5178 6.54826 18.7101 6.2024 18.6154 5.87047L17.4134 6.21349ZM15.1791 7.32741L15.9989 12.4098L17.2329 12.2107L16.4132 7.12837L15.1791 7.32741ZM14.1478 14.5833H5.85221V15.8333H14.1478V14.5833ZM4.00113 12.4098L4.82087 7.32741L3.58682 7.12837L2.76708 12.2107L4.00113 12.4098ZM5.85221 14.5833C4.69754 14.5833 3.81727 13.5497 4.00113 12.4098L2.76708 12.2107C2.46065 14.1106 3.92777 15.8333 5.85221 15.8333V14.5833ZM15.9989 12.4098C16.1827 13.5497 15.3025 14.5833 14.1478 14.5833V15.8333C16.0722 15.8333 17.5394 14.1106 17.2329 12.2107L15.9989 12.4098ZM10 2.91668C12.5749 2.91668 14.7691 4.78538 15.1791 7.32741L16.4132 7.12837C15.9055 3.98064 13.1884 1.66668 10 1.66668V2.91668ZM10 1.66668C6.8116 1.66668 4.09451 3.98065 3.58682 7.12837L4.82087 7.32741C5.23087 4.78538 7.42513 2.91668 10 2.91668V1.66668ZM12.7493 14.9857C12.2622 16.2635 11.1834 17.0833 10 17.0833V18.3333C11.7985 18.3333 13.2824 17.0964 13.9173 15.431L12.7493 14.9857ZM10 17.0833C8.81662 17.0833 7.73784 16.2635 7.25067 14.9857L6.08268 15.431C6.71762 17.0964 8.20151 18.3333 10 18.3333V17.0833ZM2.58666 6.21349C2.96944 4.87216 3.70704 3.67922 4.69255 2.74322L3.83172 1.83686C2.68797 2.92316 1.83017 4.30926 1.38465 5.87047L2.58666 6.21349ZM15.3075 2.74322C16.293 3.67922 17.0306 4.87216 17.4134 6.21349L18.6154 5.87047C18.1698 4.30926 17.312 2.92316 16.1683 1.83686L15.3075 2.74322Z"
        fill="currentColor"
      />
    </svg>
  ),
  apple: (props: IconProps) => (
    <svg role="img" viewBox="0 0 24 24" {...props}>
      <path
        d="M12.152 6.896c-.948 0-2.415-1.078-3.96-1.04-2.04.027-3.91 1.183-4.961 3.014-2.117 3.675-.546 9.103 1.519 12.09 1.013 1.454 2.208 3.09 3.792 3.039 1.52-.065 2.09-.987 3.935-.987 1.831 0 2.35.987 3.96.948 1.637-.026 2.676-1.48 3.676-2.948 1.156-1.688 1.636-3.325 1.662-3.415-.039-.013-3.182-1.221-3.22-4.857-.026-3.04 2.48-4.494 2.597-4.559-1.429-2.09-3.623-2.324-4.39-2.376-2-.156-3.675 1.09-4.61 1.09zM15.53 3.83c.843-1.012 1.4-2.427 1.245-3.83-1.207.052-2.662.805-3.532 1.818-.78.896-1.454 2.338-1.273 3.714 1.338.104 2.715-.688 3.559-1.701"
        fill="currentColor"
      />
    </svg>
  ),
  archive: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 32 32"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        clipRule="evenodd"
        d="M4.00001 18.3279L4.00004 8.99999C4.00005 6.23857 6.23863 4.00001 9.00004 4.00001L23 4C25.7614 4 28 6.23857 28 9V18.3282C28 18.3299 28 18.3316 28 18.3333L28 23C28 25.4162 26.2861 27.4322 24.0077 27.8984C23.6822 27.965 23.3452 28 23 28H9C6.41116 28 4.28186 26.0325 4.02581 23.5112C4.00874 23.3431 4 23.1726 4 23M9.00004 6.00001L23 6C24.6568 6 26 7.34315 26 9V17.3333L21.2397 17.3333C20.7593 17.3333 20.3468 17.675 20.2573 18.147C19.8771 20.1513 18.1144 21.6667 16 21.6667C13.8856 21.6667 12.123 20.1513 11.7427 18.147C11.6532 17.675 11.2407 17.3333 10.7603 17.3333H6.00002L6.00004 8.99999C6.00005 7.34314 7.34319 6.00001 9.00004 6.00001Z"
        fill="currentColor"
        fillRule="evenodd"
      />
      <path
        d="M4 23V18.3333C4 18.3315 4 18.3297 4.00001 18.3279"
        fill="currentColor"
      />
    </svg>
  ),
  aria: (props: IconProps) => (
    <svg fill="currentColor" role="img" viewBox="0 0 24 24" {...props}>
      <path d="M13.966 22.624l-1.69-4.281H8.122l3.892-9.144 5.662 13.425zM8.884 1.376H0v21.248zm15.116 0h-8.884L24 22.624Z" />
    </svg>
  ),
  arrowUpRight: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M18.25 15.25V5.75M18.25 5.75H8.75M18.25 5.75L6 18"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
    </svg>
  ),
  bag: (props: IconProps) => (
    <svg
      fill="none"
      height="16"
      viewBox="0 0 16 16"
      width="16"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M4.66732 3.33332V1.33332C4.66732 0.965136 4.9658 0.666656 5.33398 0.666656H10.6673C11.0355 0.666656 11.334 0.965136 11.334 1.33332V3.33332H14.0007C14.3689 3.33332 14.6673 3.6318 14.6673 3.99999V13.3333C14.6673 13.7015 14.3689 14 14.0007 14H2.00065C1.63246 14 1.33398 13.7015 1.33398 13.3333V3.99999C1.33398 3.6318 1.63246 3.33332 2.00065 3.33332H4.66732ZM2.66732 9.99999V12.6667H13.334V9.99999H2.66732ZM7.33398 7.33332V8.66666H8.66732V7.33332H7.33398ZM6.00065 1.99999V3.33332H10.0007V1.99999H6.00065Z"
        fill="currentColor"
      />
    </svg>
  ),
  bank: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 20 20"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M16.0417 7.7083V14.375M12.7084 14.375V7.7083M3.95835 7.7083V14.375M7.29169 14.375V7.7083M15.2698 14.375H4.73025C3.77162 14.375 2.92055 14.9884 2.6174 15.8978C2.45716 16.3785 2.81497 16.875 3.32169 16.875H16.6784C17.1851 16.875 17.5429 16.3785 17.3826 15.8978C17.0795 14.9884 16.2284 14.375 15.2698 14.375ZM16.6368 7.7083H3.36326C2.77145 7.7083 2.29169 7.22854 2.29169 6.63673C2.29169 6.23245 2.51922 5.86258 2.88006 5.68028L8.87272 2.65281C9.58159 2.29469 10.4185 2.29469 11.1273 2.65281L17.12 5.68028C17.4808 5.86258 17.7084 6.23245 17.7084 6.63673C17.7084 7.22854 17.2286 7.7083 16.6368 7.7083Z"
        stroke="currentColor"
        strokeLinecap="square"
        strokeLinejoin="round"
        strokeWidth="1.25"
      />
    </svg>
  ),
  bash: (props: IconProps) => (
    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
      <path d="M21.038 4.9 13.461.402a2.86 2.86 0 0 0-2.923.001L2.961 4.9A3.023 3.023 0 0 0 1.5 7.503v8.995c0 1.073.557 2.066 1.462 2.603l7.577 4.497a2.86 2.86 0 0 0 2.922 0l7.577-4.497a3.023 3.023 0 0 0 1.462-2.603V7.503A3.021 3.021 0 0 0 21.038 4.9zM15.17 18.946l.013.646c.001.078-.05.167-.111.198l-.383.22c-.061.031-.111-.007-.112-.085l-.007-.635c-.328.136-.66.169-.872.084-.04-.016-.057-.075-.041-.142l.139-.584a.24.24 0 0 1 .069-.121.163.163 0 0 1 .036-.026c.022-.011.043-.014.062-.006.229.077.521.041.802-.101.357-.181.596-.545.592-.907-.003-.328-.181-.465-.613-.468-.55.001-1.064-.107-1.072-.917-.007-.667.34-1.361.889-1.8l-.007-.652c-.001-.08.048-.168.111-.2l.37-.236c.061-.031.111.007.112.087l.006.653c.273-.109.511-.138.726-.088.047.012.067.076.048.151l-.144.578a.255.255 0 0 1-.065.116.161.161 0 0 1-.038.028.083.083 0 0 1-.057.009c-.098-.022-.332-.073-.699.113-.385.195-.52.53-.517.778.003.297.155.387.681.396.7.012 1.003.318 1.01 1.023.007.689-.362 1.433-.928 1.888zm3.973-1.087c0 .06-.008.116-.058.145l-1.916 1.164c-.05.029-.09.004-.09-.056v-.494c0-.06.037-.093.087-.122l1.887-1.129c.05-.029.09-.004.09.056v.436zm1.316-11.062-7.168 4.427c-.894.523-1.553 1.109-1.553 2.187v8.833c0 .645.26 1.063.66 1.184a2.304 2.304 0 0 1-.398.039c-.42 0-.833-.114-1.197-.33L3.226 18.64a2.494 2.494 0 0 1-1.201-2.142V7.503c0-.881.46-1.702 1.201-2.142L10.803.863a2.342 2.342 0 0 1 2.394 0l7.577 4.498a2.479 2.479 0 0 1 1.164 1.732c-.252-.536-.818-.682-1.479-.296z" />
    </svg>
  ),
  browser: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 20 20"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M2.50002 8.95831H17.5M4.79169 16.0416H15.2084C16.5891 16.0416 17.7084 14.9224 17.7084 13.5416V6.45831C17.7084 5.0776 16.5891 3.95831 15.2084 3.95831H4.79169C3.41097 3.95831 2.29169 5.0776 2.29169 6.45831V13.5416C2.29169 14.9224 3.41098 16.0416 4.79169 16.0416Z"
        stroke="currentColor"
        strokeLinecap="square"
        strokeLinejoin="round"
        strokeWidth="1.25"
      />
      <path
        d="M4.79167 6.97919C5.07932 6.97919 5.3125 6.746 5.3125 6.45835C5.3125 6.17071 5.07932 5.93752 4.79167 5.93752C4.50402 5.93752 4.27083 6.17071 4.27083 6.45835C4.27083 6.746 4.50402 6.97919 4.79167 6.97919ZM6.875 6.97919C7.16265 6.97919 7.39583 6.746 7.39583 6.45835C7.39583 6.17071 7.16265 5.93752 6.875 5.93752C6.58735 5.93752 6.35417 6.17071 6.35417 6.45835C6.35417 6.746 6.58735 6.97919 6.875 6.97919ZM8.95833 6.97919C9.24598 6.97919 9.47917 6.746 9.47917 6.45835C9.47917 6.17071 9.24598 5.93752 8.95833 5.93752C8.67069 5.93752 8.4375 6.17071 8.4375 6.45835C8.4375 6.746 8.67069 6.97919 8.95833 6.97919Z"
        fill="currentColor"
        stroke="currentColor"
        strokeWidth="0.208333"
      />
    </svg>
  ),
  chat: (props: IconProps) => (
    <svg
      fill="none"
      height="16"
      viewBox="0 0 16 16"
      width="16"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M7.99967 1.33331C11.6815 1.33331 14.6663 4.31808 14.6663 7.99998C14.6663 11.6818 11.6815 14.6666 7.99967 14.6666H1.33301L3.28563 12.714C2.0792 11.5076 1.33301 9.84091 1.33301 7.99998C1.33301 4.31808 4.31777 1.33331 7.99967 1.33331ZM10.6663 8.66665H5.33301C5.33301 10.1394 6.52691 11.3333 7.99967 11.3333C9.47241 11.3333 10.6663 10.1394 10.6663 8.66665Z"
        fill="currentColor"
      />
    </svg>
  ),
  circleQuestionMark: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M12 21.25C17.1086 21.25 21.25 17.1086 21.25 12C21.25 6.89137 17.1086 2.75 12 2.75C6.89137 2.75 2.75 6.89137 2.75 12C2.75 17.1086 6.89137 21.25 12 21.25Z"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
      <path
        d="M12 16V15.99M12.25 16C12.25 16.1381 12.1381 16.25 12 16.25C11.8619 16.25 11.75 16.1381 11.75 16C11.75 15.8619 11.8619 15.75 12 15.75C12.1381 15.75 12.25 15.8619 12.25 16Z"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
      <path
        d="M9.75 9.25C9.75 8.42157 10.4216 7.75 11.25 7.75H12.4587C13.448 7.75 14.25 8.552 14.25 9.54132C14.25 10.1402 13.9507 10.6996 13.4523 11.0318L12.8906 11.4063C12.3342 11.7772 12 12.4017 12 13.0704V13.25"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
    </svg>
  ),
  clipboard: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 20 20"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <g filter="url(#filter0_ii_462_5003)">
        <path
          d="M12.7083 3.95835H13.5416C14.9224 3.95835 16.0416 5.07764 16.0416 6.45835V15.2084C16.0416 16.5891 14.9224 17.7084 13.5416 17.7084H6.45831C5.0776 17.7084 3.95831 16.5891 3.95831 15.2084V6.45835C3.95831 5.07764 5.0776 3.95835 6.45831 3.95835H7.29165M8.12498 6.04169H11.875C12.3352 6.04169 12.7083 5.66859 12.7083 5.20835V4.79169C12.7083 3.41098 11.589 2.29169 10.2083 2.29169H9.79165C8.41093 2.29169 7.29165 3.41098 7.29165 4.79169V5.20835C7.29165 5.66859 7.66474 6.04169 8.12498 6.04169Z"
          stroke="currentColor"
          strokeLinecap="square"
          strokeLinejoin="round"
          strokeWidth="1.25"
        />
      </g>
      <defs>
        <filter
          colorInterpolationFilters="sRGB"
          filterUnits="userSpaceOnUse"
          height="24.1667"
          id="filter0_ii_462_5003"
          width="13.3333"
          x="3.33331"
          y="-4.99998"
        >
          <feFlood floodOpacity="0" result="BackgroundImageFix" />
          <feBlend
            in="SourceGraphic"
            in2="BackgroundImageFix"
            mode="normal"
            result="shape"
          />
          <feColorMatrix
            in="SourceAlpha"
            result="hardAlpha"
            type="matrix"
            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          />
          <feOffset dy="0.833333" />
          <feGaussianBlur stdDeviation="1.25" />
          <feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic" />
          <feColorMatrix
            type="matrix"
            values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.08 0"
          />
          <feBlend
            in2="shape"
            mode="normal"
            result="effect1_innerShadow_462_5003"
          />
          <feColorMatrix
            in="SourceAlpha"
            result="hardAlpha"
            type="matrix"
            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          />
          <feOffset dy="-6.66667" />
          <feGaussianBlur stdDeviation="8.33333" />
          <feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic" />
          <feColorMatrix
            type="matrix"
            values="0 0 0 0 0.101961 0 0 0 0 0.0980392 0 0 0 0 0.145098 0 0 0 0.08 0"
          />
          <feBlend
            in2="effect1_innerShadow_462_5003"
            mode="normal"
            result="effect2_innerShadow_462_5003"
          />
        </filter>
      </defs>
    </svg>
  ),
  clock: (props: IconProps) => (
    <svg
      fill="none"
      height="16"
      viewBox="0 0 16 16"
      width="16"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M8.00065 1.33331C11.6807 1.33331 14.6673 4.31998 14.6673 7.99998C14.6673 11.68 11.6807 14.6666 8.00065 14.6666C4.32065 14.6666 1.33398 11.68 1.33398 7.99998C1.33398 4.31998 4.32065 1.33331 8.00065 1.33331ZM8.00065 13.3333C10.9473 13.3333 13.334 10.9466 13.334 7.99998C13.334 5.05331 10.9473 2.66665 8.00065 2.66665C5.05398 2.66665 2.66732 5.05331 2.66732 7.99998C2.66732 10.9466 5.05398 13.3333 8.00065 13.3333ZM10.3577 4.70015L11.3005 5.64296L8.00065 8.94278L7.05785 7.99998L10.3577 4.70015Z"
        fill="#6D6D6D"
      />
    </svg>
  ),
  coin: (props: IconProps) => (
    <svg
      fill="none"
      height="16"
      viewBox="0 0 16 16"
      width="16"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M8.00327 2.66864C12.0533 2.66864 15.3366 4.4595 15.3366 6.66862V9.33529C15.3366 11.5444 12.0533 13.3353 8.00327 13.3353C4.0255 13.3353 0.787429 11.6078 0.673049 9.45322L0.669922 9.33529V6.66862C0.669922 4.4595 3.95317 2.66864 8.00327 2.66864ZM8.00327 10.6686C5.52296 10.6686 3.33025 9.99702 2.00311 8.96895L2.00326 9.33529C2.00326 10.5901 4.59168 12.002 8.00327 12.002C11.3437 12.002 13.8951 10.6484 13.9999 9.41395L14.0033 9.33529L14.0041 8.96842C12.677 9.99675 10.484 10.6686 8.00327 10.6686ZM8.00327 4.00197C4.59168 4.00197 2.00326 5.41384 2.00326 6.66862C2.00326 7.92342 4.59168 9.33529 8.00327 9.33529C11.4149 9.33529 14.0033 7.92342 14.0033 6.66862C14.0033 5.41384 11.4149 4.00197 8.00327 4.00197Z"
        fill="currentColor"
      />
    </svg>
  ),
  colorPicker: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 32 32"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        clipRule="evenodd"
        d="M14.0404 8.62623L15.3334 9.91916L19.2929 5.95964C20.9233 4.32927 23.44 4.12547 25.292 5.34825C25.5565 5.52294 25.8075 5.72673 26.0404 5.95964C27.6708 7.59002 27.8746 10.1068 26.6518 11.9587C26.4771 12.2233 26.2734 12.4743 26.0404 12.7072L22.0809 16.6667L23.3738 17.9596C23.7643 18.3501 23.7643 18.9833 23.3738 19.3738C22.9832 19.7643 22.3501 19.7643 21.9596 19.3738L20.6667 18.0809L11.431 27.3167C10.9934 27.7543 10.3999 28.0001 9.78105 28.0001H6.33333C5.04467 28.0001 4 26.9554 4 25.6668V22.219C4 21.6002 4.24583 21.0067 4.68342 20.5691L13.9192 11.3334L12.6262 10.0404C12.2357 9.64992 12.2357 9.01676 12.6262 8.62623C13.0168 8.23571 13.6499 8.23571 14.0404 8.62623ZM15.3333 12.7476L19.2525 16.6667L15.9192 20H8.08096L15.3333 12.7476Z"
        fill="currentColor"
        fillRule="evenodd"
      />
    </svg>
  ),
  crown: (props: IconProps) => (
    <svg
      fill="none"
      height="16"
      viewBox="0 0 16 16"
      width="16"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M1.87051 3.46679L4.67004 5.33314L7.46087 1.42595C7.67487 1.12635 8.09127 1.05695 8.39087 1.27096C8.45073 1.31372 8.50307 1.36609 8.54587 1.42595L11.3367 5.33314L14.1362 3.46679C14.4426 3.26255 14.8565 3.34534 15.0607 3.65169C15.1485 3.78343 15.1866 3.94213 15.1681 4.09939L14.0727 13.4111C14.0331 13.7468 13.7486 13.9998 13.4105 13.9998H2.5962C2.25815 13.9998 1.9736 13.7468 1.9341 13.4111L0.838615 4.09939C0.795595 3.73372 1.05715 3.40241 1.42282 3.35939C1.58007 3.34089 1.73877 3.37896 1.87051 3.46679ZM8.0034 9.99979C8.73974 9.99979 9.33673 9.40285 9.33673 8.66645C9.33673 7.93012 8.73974 7.33312 8.0034 7.33312C7.267 7.33312 6.67007 7.93012 6.67007 8.66645C6.67007 9.40285 7.267 9.99979 8.0034 9.99979Z"
        fill="currentColor"
      />
    </svg>
  ),
  cursor: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 32 32"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M7.66675 5.33333C4.90532 5.33333 2.66675 7.5719 2.66675 10.3333V23C2.66675 25.7614 4.90532 28 7.66675 28H16.3334C16.8857 28 17.3334 27.5523 17.3334 27C17.3334 26.4477 16.8857 26 16.3334 26H7.66675C6.00989 26 4.66675 24.6568 4.66675 23V10.3333C4.66675 8.67647 6.00989 7.33333 7.66675 7.33333H24.3334C25.9903 7.33333 27.3334 8.67647 27.3334 10.3333V16.3333C27.3334 16.8856 27.7811 17.3333 28.3334 17.3333C28.8857 17.3333 29.3334 16.8856 29.3334 16.3333V10.3333C29.3334 7.5719 27.0948 5.33333 24.3334 5.33333H7.66675Z"
        fill="currentColor"
      />
      <path
        d="M8.66675 12.6667C7.93037 12.6667 7.33341 12.0697 7.33341 11.3333C7.33341 10.5969 7.93037 10 8.66675 10C9.40313 10 10.0001 10.5969 10.0001 11.3333C10.0001 12.0697 9.40313 12.6667 8.66675 12.6667Z"
        fill="currentColor"
      />
      <path
        d="M17.9597 17.9596C18.2216 17.6977 18.6068 17.602 18.9609 17.7109L28.2942 20.5827C28.6848 20.7029 28.963 21.0487 28.9967 21.456C29.0304 21.8633 28.8129 22.2501 28.4473 22.4329L24.4378 24.4377L22.433 28.4472C22.2502 28.8128 21.8634 29.0303 21.4561 28.9966C21.0488 28.9629 20.703 28.6847 20.5828 28.2941L17.711 18.9608C17.6021 18.6067 17.6977 18.2215 17.9597 17.9596Z"
        fill="currentColor"
      />
      <path
        d="M13.3334 12.6667C12.597 12.6667 12.0001 12.0697 12.0001 11.3333C12.0001 10.5969 12.597 10 13.3334 10C14.0698 10 14.6667 10.5969 14.6667 11.3333C14.6667 12.0697 14.0698 12.6667 13.3334 12.6667Z"
        fill="currentColor"
      />
      <path
        d="M18.0001 12.6667C17.2637 12.6667 16.6667 12.0697 16.6667 11.3333C16.6667 10.5969 17.2637 10 18.0001 10C18.7365 10 19.3334 10.5969 19.3334 11.3333C19.3334 12.0697 18.7365 12.6667 18.0001 12.6667Z"
        fill="currentColor"
      />
    </svg>
  ),
  document: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 20 20"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M7.29167 11.6667H11.0417M7.29167 8.33333H12.7083M5.625 16.875H14.375C15.7557 16.875 16.875 15.7557 16.875 14.375V5.625C16.875 4.24429 15.7557 3.125 14.375 3.125H5.625C4.24429 3.125 3.125 4.24429 3.125 5.625V14.375C3.125 15.7557 4.24429 16.875 5.625 16.875Z"
        stroke="currentColor"
        strokeLinecap="round"
        strokeWidth="1.25"
      />
    </svg>
  ),
  eductaion: (props: IconProps) => (
    <svg
      fill="none"
      height="24"
      viewBox="0 0 24 24"
      width="24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M12 2L0 9L12 16L22 10.1667V17.5H24V9L12 2ZM3.99902 13.4905V18.0001C5.82344 20.429 8.72812 22.0001 11.9998 22.0001C15.2714 22.0001 18.1761 20.429 20.0005 18.0001L20.0001 13.4913L12.0003 18.1579L3.99902 13.4905Z"
        fill="currentColor"
      />
    </svg>
  ),
  email: (props: IconProps) => (
    <svg
      color="currentColor"
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M2 6L8.91302 9.91697C11.4616 11.361 12.5384 11.361 15.087 9.91697L22 6"
        stroke="currentColor"
        strokeLinejoin="round"
        strokeWidth="2"
      />
      <path
        d="M2.01577 13.4756C2.08114 16.5412 2.11383 18.0739 3.24496 19.2094C4.37608 20.3448 5.95033 20.3843 9.09883 20.4634C11.0393 20.5122 12.9607 20.5122 14.9012 20.4634C18.0497 20.3843 19.6239 20.3448 20.7551 19.2094C21.8862 18.0739 21.9189 16.5412 21.9842 13.4756C22.0053 12.4899 22.0053 11.5101 21.9842 10.5244C21.9189 7.45886 21.8862 5.92609 20.7551 4.79066C19.6239 3.65523 18.0497 3.61568 14.9012 3.53657C12.9607 3.48781 11.0393 3.48781 9.09882 3.53656C5.95033 3.61566 4.37608 3.65521 3.24495 4.79065C2.11382 5.92608 2.08114 7.45885 2.01576 10.5244C1.99474 11.5101 1.99475 12.4899 2.01577 13.4756Z"
        stroke="currentColor"
        strokeLinejoin="round"
        strokeWidth="2"
      />
    </svg>
  ),
  emailSparkle: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M3 5.63623L10.7335 11.9637C11.4703 12.5664 12.5297 12.5664 13.2665 11.9637L21 5.63623"
        stroke="currentColor"
        strokeWidth="1.5"
      />
      <path
        d="M20.2405 16.1852L19.5436 14.3733C19.4571 14.1484 19.241 14 19 14C18.759 14 18.5429 14.1484 18.4564 14.3733L17.7595 16.1852C17.658 16.4493 17.4493 16.658 17.1852 16.7595L15.3733 17.4564C15.1484 17.5429 15 17.759 15 18C15 18.241 15.1484 18.4571 15.3733 18.5436L17.1852 19.2405C17.4493 19.342 17.658 19.5507 17.7595 19.8148L18.4564 21.6267C18.5429 21.8516 18.759 22 19 22C19.241 22 19.4571 21.8516 19.5436 21.6267L20.2405 19.8148C20.342 19.5507 20.5507 19.342 20.8148 19.2405L22.6267 18.5436C22.8516 18.4571 23 18.241 23 18C23 17.759 22.8516 17.5429 22.6267 17.4564L20.8148 16.7595C20.5507 16.658 20.342 16.4493 20.2405 16.1852Z"
        fill="currentColor"
      />
      <path
        d="M21.25 11.75V7.95C21.25 6.82989 21.25 6.26984 21.032 5.84202C20.8403 5.46569 20.5343 5.15973 20.158 4.96799C19.7302 4.75 19.1701 4.75 18.05 4.75H5.95C4.8299 4.75 4.26984 4.75 3.84202 4.96799C3.46569 5.15973 3.15973 5.46569 2.96799 5.84202C2.75 6.26984 2.75 6.82989 2.75 7.95V16.05C2.75 17.1701 2.75 17.7302 2.96799 18.158C3.15973 18.5343 3.46569 18.8403 3.84202 19.032C4.26984 19.25 4.82989 19.25 5.95 19.25H12.75"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
    </svg>
  ),
  emojiSmile: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        clipRule="evenodd"
        d="M12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2ZM15.4756 14.1523C15.3157 14.1817 15.1731 14.2724 15.0752 14.4004C15.0005 14.4963 14.9238 14.5865 14.8418 14.6738C14.11 15.4577 13.0611 15.8778 12.0039 15.875C10.9465 15.8765 9.89676 15.4549 9.16211 14.6719C9.0799 14.5848 9.00271 14.4951 8.92773 14.3994C8.82964 14.2719 8.68709 14.1814 8.52734 14.1523C8.36741 14.1235 8.20242 14.1579 8.06934 14.248C7.93634 14.3383 7.84384 14.4784 7.81152 14.6377C7.77926 14.7969 7.81039 14.9622 7.89258 15.1006C7.97692 15.2397 8.06643 15.3728 8.16504 15.5029C9.04241 16.6812 10.529 17.3841 12.002 17.375C13.4748 17.3865 14.9654 16.684 15.8408 15.502C15.9391 15.3716 16.0284 15.2389 16.1123 15.0996C16.1941 14.9609 16.2251 14.7949 16.1924 14.6357C16.1596 14.4766 16.0659 14.337 15.9326 14.2471C15.7994 14.1574 15.6353 14.1232 15.4756 14.1523ZM9.25 7.5C8.42157 7.5 7.75 8.29582 7.75 9.40039C7.75016 10.5047 8.42167 11.25 9.25 11.25C10.0783 11.25 10.7498 10.5047 10.75 9.40039C10.75 8.29582 10.0784 7.5 9.25 7.5ZM14.75 7.5C13.9216 7.5 13.25 8.29582 13.25 9.40039C13.2502 10.5047 13.9217 11.25 14.75 11.25C15.5783 11.25 16.2498 10.5047 16.25 9.40039C16.25 8.29582 15.5784 7.5 14.75 7.5Z"
        fill="currentColor"
        fillRule="evenodd"
      />
    </svg>
  ),
  gauge: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 20 20"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M9.99996 1.66669C9.65478 1.66669 9.37496 1.94651 9.37496 2.29169V4.37502C9.37496 4.7202 9.65478 5.00002 9.99996 5.00002C10.3451 5.00002 10.625 4.7202 10.625 4.37502V2.94388C14.2442 3.26029 17.0833 6.29861 17.0833 10C17.0833 13.912 13.912 17.0834 9.99996 17.0834C6.08794 17.0834 2.91663 13.912 2.91663 10C2.91663 8.90173 3.16615 7.86347 3.61102 6.93729C3.76047 6.62615 3.62939 6.25276 3.31825 6.10331C3.0071 5.95386 2.63371 6.08493 2.48426 6.39608C1.96001 7.48752 1.66663 8.71039 1.66663 10C1.66663 14.6024 5.39759 18.3334 9.99996 18.3334C14.6023 18.3334 18.3333 14.6024 18.3333 10C18.3333 5.39765 14.6023 1.66669 9.99996 1.66669Z"
        fill="currentColor"
      />
      <path
        d="M4.14135 4.14141C4.38543 3.89733 4.78116 3.89733 5.02523 4.14141L8.42715 7.54333C8.88097 7.25219 9.42075 7.08335 9.99996 7.08335C11.6108 7.08335 12.9166 8.38919 12.9166 10C12.9166 11.6109 11.6108 12.9167 9.99996 12.9167C8.38913 12.9167 7.08329 11.6109 7.08329 10C7.08329 9.42081 7.25213 8.88103 7.54327 8.42722L4.14135 5.0253C3.89727 4.78122 3.89727 4.38549 4.14135 4.14141Z"
        fill="currentColor"
      />
    </svg>
  ),
  google: (props: IconProps) => (
    <svg role="img" viewBox="0 0 24 24" {...props}>
      <path
        d="M12.48 10.92v3.28h7.84c-.24 1.84-.853 3.187-1.787 4.133-1.147 1.147-2.933 2.4-6.053 2.4-4.827 0-8.6-3.893-8.6-8.72s3.773-8.72 8.6-8.72c2.6 0 4.507 1.027 5.907 2.347l2.307-2.307C18.747 1.44 16.133 0 12.48 0 5.867 0 .307 5.387.307 12s5.56 12 12.173 12c3.573 0 6.267-1.173 8.373-3.36 2.16-2.16 2.84-5.213 2.84-7.667 0-.76-.053-1.467-.173-2.053H12.48z"
        fill="currentColor"
      />
    </svg>
  ),
  grass: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M1.75 19.25L22.25 19.25"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
      <path
        d="M4.10714 18.75C4.06357 15.4283 3.8236 12.3705 2.25 9.25C7.82143 11.2292 8.75 14 8.75 18.75"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
      <path
        d="M8.85294 19.25C8.80246 15.6899 8.32281 7.59449 6.5 4.25C14.0294 6.79545 14.5 14.1591 14.5 19.25"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
      <path
        d="M13 9C14.0842 6.7192 14.9314 4.91821 18.25 3.75C17.013 6 17.013 8.5 17.013 11.25"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
      <path
        d="M19.8571 19C19.9074 15.3286 20.1843 11.949 22 8.5C15.6376 10.9805 14.5 13.75 14.5 19"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
    </svg>
  ),
  headset: (props: IconProps) => (
    <svg
      fill="none"
      height="16"
      viewBox="0 0 17 16"
      width="17"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M15.1663 11.3348C15.1657 13.2487 13.8207 14.8484 12.0245 15.2411L11.5991 13.9651C12.4018 13.8341 13.084 13.3447 13.4763 12.6667H11.833C11.0966 12.6667 10.4997 12.0697 10.4997 11.3333V8.66668C10.4997 7.93028 11.0966 7.33334 11.833 7.33334H13.7917C13.4637 4.70247 11.2194 2.66668 8.49967 2.66668C5.77993 2.66668 3.53567 4.70247 3.2076 7.33334H5.16634C5.90272 7.33334 6.49967 7.93028 6.49967 8.66668V11.3333C6.49967 12.0697 5.90272 12.6667 5.16634 12.6667H3.16634C2.42996 12.6667 1.83301 12.0697 1.83301 11.3333V8.00001C1.83301 4.31811 4.81777 1.33334 8.49967 1.33334C12.1815 1.33334 15.1663 4.31811 15.1663 8.00001V8.66581V8.66668V11.3333V11.3348Z"
        fill="currentColor"
      />
    </svg>
  ),
  inbox: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 20 20"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M16.875 6.45833H17.5C17.5 6.11316 17.2202 5.83333 16.875 5.83333V6.45833ZM3.12502 6.45833V5.83333C2.77984 5.83333 2.50002 6.11316 2.50002 6.45833H3.12502ZM4.49004 16.6025L4.77379 16.0456L4.77379 16.0456L4.49004 16.6025ZM3.3975 15.51L2.84062 15.7937H2.84063L3.3975 15.51ZM16.6025 15.51L16.0457 15.2262V15.2262L16.6025 15.51ZM15.51 16.6025L15.2263 16.0456L15.51 16.6025ZM2.29169 3.125V2.5C1.94651 2.5 1.66669 2.77982 1.66669 3.125H2.29169ZM17.7084 3.125H18.3334C18.3334 2.77982 18.0535 2.5 17.7084 2.5V3.125ZM17.7084 6.45833V7.08333C18.0535 7.08333 18.3334 6.80351 18.3334 6.45833H17.7084ZM2.29169 6.45833H1.66669C1.66669 6.80351 1.94651 7.08333 2.29169 7.08333V6.45833ZM8.33335 9.16667C7.98818 9.16667 7.70835 9.44649 7.70835 9.79167C7.70835 10.1368 7.98818 10.4167 8.33335 10.4167V9.16667ZM11.6667 10.4167C12.0119 10.4167 12.2917 10.1368 12.2917 9.79167C12.2917 9.44649 12.0119 9.16667 11.6667 9.16667V10.4167ZM16.25 6.45833V12.875H17.5V6.45833H16.25ZM12.875 16.25H7.12502V17.5H12.875V16.25ZM3.75002 12.875V6.45833H2.50002V12.875H3.75002ZM3.12502 7.08333H16.875V5.83333H3.12502V7.08333ZM7.12502 16.25C6.41464 16.25 5.91945 16.2495 5.53392 16.218C5.15569 16.1871 4.93839 16.1295 4.77379 16.0456L4.2063 17.1594C4.57648 17.348 4.9766 17.4266 5.43213 17.4639C5.88036 17.5005 6.43527 17.5 7.12502 17.5V16.25ZM2.50002 12.875C2.50002 13.5648 2.49953 14.1197 2.53616 14.5679C2.57337 15.0234 2.65201 15.4235 2.84062 15.7937L3.95438 15.2262C3.87052 15.0616 3.81291 14.8443 3.78201 14.4661C3.75051 14.0806 3.75002 13.5854 3.75002 12.875H2.50002ZM4.77379 16.0456C4.42098 15.8659 4.13415 15.579 3.95438 15.2262L2.84063 15.7937C3.14023 16.3817 3.61829 16.8598 4.2063 17.1594L4.77379 16.0456ZM16.25 12.875C16.25 13.5854 16.2495 14.0806 16.218 14.4661C16.1871 14.8443 16.1295 15.0616 16.0457 15.2262L17.1594 15.7937C17.348 15.4235 17.4267 15.0234 17.4639 14.5679C17.5005 14.1197 17.5 13.5648 17.5 12.875H16.25ZM12.875 17.5C13.5648 17.5 14.1197 17.5005 14.5679 17.4639C15.0234 17.4266 15.4236 17.348 15.7937 17.1594L15.2263 16.0456C15.0617 16.1295 14.8443 16.1871 14.4661 16.218C14.0806 16.2495 13.5854 16.25 12.875 16.25V17.5ZM16.0457 15.2262C15.8659 15.579 15.5791 15.8659 15.2263 16.0456L15.7937 17.1594C16.3817 16.8598 16.8598 16.3817 17.1594 15.7937L16.0457 15.2262ZM2.29169 3.75H17.7084V2.5H2.29169V3.75ZM17.0834 3.125V6.45833H18.3334V3.125H17.0834ZM17.7084 5.83333H2.29169V7.08333H17.7084V5.83333ZM2.91669 6.45833V3.125H1.66669V6.45833H2.91669ZM8.33335 10.4167H11.6667V9.16667H8.33335V10.4167Z"
        fill="currentColor"
      />
    </svg>
  ),
  logo: (props: IconProps) => (
    <svg viewBox="0 0 256 256" xmlns="http://www.w3.org/2000/svg" {...props}>
      <rect fill="none" height="256" width="256" />
      <line
        fill="none"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="32"
        x1="208"
        x2="128"
        y1="128"
        y2="208"
      />
      <line
        fill="none"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="32"
        x1="192"
        x2="40"
        y1="40"
        y2="192"
      />
    </svg>
  ),
  mcp: (props: IconProps) => (
    <svg
      fill="currentColor"
      viewBox="0 0 16 16"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path d="M10.459 1.562a1.725 1.725 0 0 0-2.407 0L1.635 7.855a.575.575 0 0 1-.925-.18.549.549 0 0 1 .123-.606L7.25.775a2.875 2.875 0 0 1 4.01 0 2.743 2.743 0 0 1 .803 2.36 2.866 2.866 0 0 1 2.406.787l.034.033a2.743 2.743 0 0 1 0 3.934L8.699 13.58a.182.182 0 0 0 0 .262l1.192 1.17a.55.55 0 0 1 0 .786.575.575 0 0 1-.802 0l-1.192-1.169a1.28 1.28 0 0 1 0-1.836L13.7 7.101a1.647 1.647 0 0 0 0-2.36l-.034-.032a1.725 1.725 0 0 0-2.404-.002L6.48 9.396l-.001.001-.065.065a.575.575 0 0 1-.926-.18.549.549 0 0 1 .123-.607l4.849-4.755a1.645 1.645 0 0 0-.002-2.358Z" />
      <path d="M9.657 3.135a.549.549 0 0 0 0-.786.575.575 0 0 0-.803 0L4.108 7.003a2.743 2.743 0 0 0 0 3.934 2.876 2.876 0 0 0 4.01 0l4.747-4.655a.548.548 0 0 0 0-.787.575.575 0 0 0-.802 0L7.317 10.15a1.725 1.725 0 0 1-2.407 0 1.647 1.647 0 0 1 0-2.36l4.747-4.655Z" />
    </svg>
  ),
  npm: (props: IconProps) => (
    <svg viewBox="0 0 24 24" {...props}>
      <path
        d="M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z"
        fill="currentColor"
      />
    </svg>
  ),
  pageCrosseText: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M13.25 21.25H6.75C5.64543 21.25 4.75 20.3546 4.75 19.25V4.75C4.75 3.64543 5.64543 2.75 6.75 2.75H17.25C18.3546 2.75 19.25 3.64543 19.25 4.75V13.25"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
      <path
        d="M20.8713 16.6287L18.75 18.75M16.6287 20.8713L18.75 18.75M16.6287 16.6287L18.75 18.75M20.8713 20.8713L18.75 18.75"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
      <path
        d="M8.75 6.75H15.25M8.75 10.75H11.25"
        stroke="currentColor"
        strokeLinecap="round"
        strokeWidth="1.5"
      />
    </svg>
  ),
  pageLink: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M14.75 15C14.75 13.2051 16.2051 11.75 18 11.75C19.7949 11.75 21.25 13.2051 21.25 15"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
      <path
        d="M14.75 18C14.75 19.7949 16.2051 21.25 18 21.25C19.7949 21.25 21.25 19.7949 21.25 18"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
      <path
        d="M18 15.75V17.25"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
      <path
        d="M12.25 21.25H6.75C5.64543 21.25 4.75 20.3546 4.75 19.25V4.75C4.75 3.64543 5.64543 2.75 6.75 2.75H17.25C18.3546 2.75 19.25 3.64543 19.25 4.75V8.75"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
    </svg>
  ),

  path: (props: IconProps) => (
    <svg
      fill="currentColor"
      focusable="false"
      viewBox="0 0 256 256"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <g color="var(--token-441e6b96-cded-437c-bbd4-5862cce7caef, rgb(228, 254, 123))">
        <path d="M228,200a28,28,0,0,1-54.83,8H72a48,48,0,0,1,0-96h96a24,24,0,0,0,0-48H72a8,8,0,0,1,0-16h96a40,40,0,0,1,0,80H72a32,32,0,0,0,0,64H173.17A28,28,0,0,1,228,200Z" />
      </g>
    </svg>
  ),
  paypal: (props: IconProps) => (
    <svg role="img" viewBox="0 0 24 24" {...props}>
      <path
        d="M7.076 21.337H2.47a.641.641 0 0 1-.633-.74L4.944.901C5.026.382 5.474 0 5.998 0h7.46c2.57 0 4.578.543 5.69 1.81 1.01 1.15 1.304 2.42 1.012 4.287-.023.143-.047.288-.077.437-.983 5.05-4.349 6.797-8.647 6.797h-2.19c-.524 0-.968.382-1.05.9l-1.12 7.106zm14.146-14.42a3.35 3.35 0 0 0-.607-.541c-.013.076-.026.175-.041.254-.93 4.778-4.005 7.201-9.138 7.201h-2.19a.563.563 0 0 0-.556.479l-1.187 7.527h-.506l-.24 1.516a.56.56 0 0 0 .554.647h3.882c.46 0 .85-.334.922-.788.06-.26.76-4.852.816-5.09a.932.932 0 0 1 .923-.788h.58c3.76 0 6.705-1.528 7.565-5.946.36-1.847.174-3.388-.777-4.471z"
        fill="currentColor"
      />
    </svg>
  ),
  playCircle: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <circle cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="1.5" />
      <path
        d="M9.5 11.1998V12.8002C9.5 14.3195 9.5 15.0791 9.95576 15.3862C10.4115 15.6932 11.0348 15.3535 12.2815 14.6741L13.7497 13.8738C15.2499 13.0562 16 12.6474 16 12C16 11.3526 15.2499 10.9438 13.7497 10.1262L12.2815 9.32594C11.0348 8.6465 10.4115 8.30678 9.95576 8.61382C9.5 8.92086 9.5 9.6805 9.5 11.1998Z"
        fill="currentColor"
      />
    </svg>
  ),
  pnpm: (props: IconProps) => (
    <svg viewBox="0 0 24 24" {...props}>
      <path
        d="M0 0v7.5h7.5V0zm8.25 0v7.5h7.498V0zm8.25 0v7.5H24V0zM8.25 8.25v7.5h7.498v-7.5zm8.25 0v7.5H24v-7.5zM0 16.5V24h7.5v-7.5zm8.25 0V24h7.498v-7.5zm8.25 0V24H24v-7.5z"
        fill="currentColor"
      />
    </svg>
  ),
  questionMark: (props: IconProps) => (
    <svg
      fill="none"
      height="24"
      viewBox="0 0 24 24"
      width="24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M12 19C12.8284 19 13.5 19.6716 13.5 20.5C13.5 21.3284 12.8284 22 12 22C11.1716 22 10.5 21.3284 10.5 20.5C10.5 19.6716 11.1716 19 12 19ZM12 2C15.3137 2 18 4.68629 18 8C18 10.1646 17.2474 11.2907 15.3259 12.9231C13.3986 14.5604 13 15.2969 13 17H11C11 14.526 11.787 13.3052 14.031 11.3989C15.5479 10.1102 16 9.43374 16 8C16 5.79086 14.2091 4 12 4C9.79086 4 8 5.79086 8 8V9H6V8C6 4.68629 8.68629 2 12 2Z"
        fill="#2B2B2B"
      />
    </svg>
  ),
  radix: (props: IconProps) => (
    <svg fill="none" viewBox="0 0 25 25" {...props}>
      <path
        d="M12 25C7.58173 25 4 21.4183 4 17C4 12.5817 7.58173 9 12 9V25Z"
        fill="currentcolor"
      />
      <path d="M12 0H4V8H12V0Z" fill="currentcolor" />
      <path
        d="M17 8C19.2091 8 21 6.20914 21 4C21 1.79086 19.2091 0 17 0C14.7909 0 13 1.79086 13 4C13 6.20914 14.7909 8 17 8Z"
        fill="currentcolor"
      />
    </svg>
  ),
  react: (props: IconProps) => (
    <svg viewBox="0 0 24 24" {...props}>
      <path
        d="M14.23 12.004a2.236 2.236 0 0 1-2.235 2.236 2.236 2.236 0 0 1-2.236-2.236 2.236 2.236 0 0 1 2.235-2.236 2.236 2.236 0 0 1 2.236 2.236zm2.648-10.69c-1.346 0-3.107.96-4.888 2.622-1.78-1.653-3.542-2.602-4.887-2.602-.41 0-.783.093-1.106.278-1.375.793-1.683 3.264-.973 6.365C1.98 8.917 0 10.42 0 12.004c0 1.59 1.99 3.097 5.043 4.03-.704 3.113-.39 5.588.988 6.38.32.187.69.275 1.102.275 1.345 0 3.107-.96 4.888-2.624 1.78 1.654 3.542 2.603 4.887 2.603.41 0 .783-.09 1.106-.275 1.374-.792 1.683-3.263.973-6.365C22.02 15.096 24 13.59 24 12.004c0-1.59-1.99-3.097-5.043-4.032.704-3.11.39-5.587-.988-6.38-.318-.184-.688-.277-1.092-.278zm-.005 1.09v.006c.225 0 .406.044.558.127.666.382.955 1.835.73 3.704-.054.46-.142.945-.25 1.44-.96-.236-2.006-.417-3.107-.534-.66-.905-1.345-1.727-2.035-2.447 1.592-1.48 3.087-2.292 4.105-2.295zm-9.77.02c1.012 0 2.514.808 4.11 2.28-.686.72-1.37 1.537-2.02 2.442-1.107.117-2.154.298-3.113.538-.112-.49-.195-.964-.254-1.42-.23-1.868.054-3.32.714-3.707.19-.09.4-.127.563-.132zm4.882 3.05c.455.468.91.992 1.36 1.564-.44-.02-.89-.034-1.345-.034-.46 0-.915.01-1.36.034.44-.572.895-1.096 1.345-1.565zM12 8.1c.74 0 1.477.034 2.202.093.406.582.802 1.203 1.183 1.86.372.64.71 1.29 1.018 1.946-.308.655-.646 1.31-1.013 1.95-.38.66-.773 1.288-1.18 1.87-.728.063-1.466.098-2.21.098-.74 0-1.477-.035-2.202-.093-.406-.582-.802-1.204-1.183-1.86-.372-.64-.71-1.29-1.018-1.946.303-.657.646-1.313 1.013-1.954.38-.66.773-1.286 1.18-1.868.728-.064 1.466-.098 2.21-.098zm-3.635.254c-.24.377-.48.763-.704 1.16-.225.39-.435.782-.635 1.174-.265-.656-.49-1.31-.676-1.947.64-.15 1.315-.283 2.015-.386zm7.26 0c.695.103 1.365.23 2.006.387-.18.632-.405 1.282-.66 1.933-.2-.39-.41-.783-.64-1.174-.225-.392-.465-.774-.705-1.146zm3.063.675c.484.15.944.317 1.375.498 1.732.74 2.852 1.708 2.852 2.476-.005.768-1.125 1.74-2.857 2.475-.42.18-.88.342-1.355.493-.28-.958-.646-1.956-1.1-2.98.45-1.017.81-2.01 1.085-2.964zm-13.395.004c.278.96.645 1.957 1.1 2.98-.45 1.017-.812 2.01-1.086 2.964-.484-.15-.944-.318-1.37-.5-1.732-.737-2.852-1.706-2.852-2.474 0-.768 1.12-1.742 2.852-2.476.42-.18.88-.342 1.356-.494zm11.678 4.28c.265.657.49 1.312.676 1.948-.64.157-1.316.29-2.016.39.24-.375.48-.762.705-1.158.225-.39.435-.788.636-1.18zm-9.945.02c.2.392.41.783.64 1.175.23.39.465.772.705 1.143-.695-.102-1.365-.23-2.006-.386.18-.63.406-1.282.66-1.933zM17.92 16.32c.112.493.2.968.254 1.423.23 1.868-.054 3.32-.714 3.708-.147.09-.338.128-.563.128-1.012 0-2.514-.807-4.11-2.28.686-.72 1.37-1.536 2.02-2.44 1.107-.118 2.154-.3 3.113-.54zm-11.83.01c.96.234 2.006.415 3.107.532.66.905 1.345 1.727 2.035 2.446-1.595 1.483-3.092 2.295-4.11 2.295-.22-.005-.406-.05-.553-.132-.666-.38-.955-1.834-.73-3.703.054-.46.142-.944.25-1.438zm4.56.64c.44.02.89.034 1.345.034.46 0 .915-.01 1.36-.034-.44.572-.895 1.095-1.345 1.565-.455-.47-.91-.993-1.36-1.565z"
        fill="currentColor"
      />
    </svg>
  ),
  rocket: (props: IconProps) => (
    <svg
      fill="currentColor"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        clipRule="evenodd"
        d="M15.5015 14.3243L11.5015 17.501V19.0655C11.5015 19.2553 11.7046 19.3758 11.8712 19.285L14.8501 17.6601C15.2517 17.4411 15.5015 17.0202 15.5015 16.5628V14.3243ZM10.0015 17.4496L6.55198 14H4.93607C3.60771 14 2.76366 12.5782 3.39975 11.412L5.02458 8.43319C5.50647 7.54973 6.43244 7.00004 7.43879 7.00004H10.9035C13.5126 4.22352 16.426 2.33907 20.1928 2.04129C21.2032 1.96142 22.0401 2.79836 21.9603 3.80871C21.6625 7.57554 19.778 10.489 17.0015 13.098V16.5628C17.0015 17.5691 16.4518 18.4951 15.5684 18.977L12.5895 20.6018C11.4234 21.2379 10.0015 20.3939 10.0015 19.0655V17.4496ZM9.67729 8.50004H7.43879C6.98136 8.50004 6.56046 8.7499 6.34142 9.15147L4.71659 12.1303C4.62572 12.2969 4.7463 12.5 4.93607 12.5H6.50053L9.67729 8.50004Z"
        fill="currentColor"
        fillRule="evenodd"
      />
      <path
        d="M2 19.1945C2 17.6451 3.25609 16.389 4.80556 16.389C6.35502 16.389 7.61111 17.6451 7.61111 19.1945C7.61111 20.744 6.35502 22.0001 4.80556 22.0001H2.75C2.33579 22.0001 2 21.6643 2 21.2501V19.1945Z"
        fill="currentColor"
      />
    </svg>
  ),

  shaders: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <circle cx="12" cy="12" fill="currentColor" r="1.5" />
      <circle cx="12" cy="16" fill="currentColor" r="1.5" />
      <circle cx="8" cy="8" fill="currentColor" r="1" />
      <circle cx="4" cy="12" fill="currentColor" r="1" />
      <circle cx="20" cy="12" fill="currentColor" r="1" />
      <circle cx="12" cy="4" fill="currentColor" r="1" />
      <circle cx="12" cy="20" fill="currentColor" r="1" />
      <circle cx="8" cy="4" fill="currentColor" r="0.75" />
      <circle cx="16" cy="4" fill="currentColor" r="0.75" />
      <circle cx="4" cy="4" fill="currentColor" r="0.5" />
      <circle cx="20" cy="4" fill="currentColor" r="0.5" />
      <circle cx="4" cy="8" fill="currentColor" r="0.75" />
      <circle cx="20" cy="8" fill="currentColor" r="0.75" />
      <circle cx="4" cy="16" fill="currentColor" r="0.75" />
      <circle cx="20" cy="16" fill="currentColor" r="0.75" />
      <circle cx="4" cy="20" fill="currentColor" r="0.5" />
      <circle cx="20" cy="20" fill="currentColor" r="0.5" />
      <circle cx="12" cy="8" fill="currentColor" r="1.5" />
      <circle cx="16" cy="8" fill="currentColor" r="1" />
      <circle cx="16" cy="12" fill="currentColor" r="1.5" />
      <circle cx="8" cy="12" fill="currentColor" r="1.5" />
      <circle cx="16" cy="16" fill="currentColor" r="1" />
      <circle cx="16" cy="20" fill="currentColor" r="0.75" />
      <circle cx="8" cy="16" fill="currentColor" r="1" />
      <circle cx="8" cy="20" fill="currentColor" r="0.75" />
    </svg>
  ),
  shapes: (props: IconProps) => (
    <svg
      fill="none"
      height="24"
      viewBox="0 0 24 24"
      width="24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <g filter="url(#filter0_iiii_368_6054)">
        <path
          d="M13.75 7C13.75 5.20507 15.2051 3.75 17 3.75C18.7949 3.75 20.25 5.20507 20.25 7C20.25 8.79493 18.7949 10.25 17 10.25C15.2051 10.25 13.75 8.79493 13.75 7Z"
          fill="currentColor"
        />
        <path
          clipRule="evenodd"
          d="M12.9375 7C12.9375 4.75634 14.7563 2.9375 17 2.9375C19.2437 2.9375 21.0625 4.75634 21.0625 7C21.0625 9.24366 19.2437 11.0625 17 11.0625C14.7563 11.0625 12.9375 9.24366 12.9375 7ZM17 9.4375C18.3462 9.4375 19.4375 8.34619 19.4375 7C19.4375 5.65381 18.3462 4.5625 17 4.5625C15.6538 4.5625 14.5625 5.65381 14.5625 7C14.5625 8.34619 15.6538 9.4375 17 9.4375Z"
          fill="currentColor"
          fillRule="evenodd"
        />
        <path
          clipRule="evenodd"
          d="M7 3C7.41421 3 7.75 3.33579 7.75 3.75V6.25H10.25C10.6642 6.25 11 6.58579 11 7C11 7.41421 10.6642 7.75 10.25 7.75H7.75V10.25C7.75 10.6642 7.41421 11 7 11C6.58579 11 6.25 10.6642 6.25 10.25V7.75H3.75C3.33579 7.75 3 7.41421 3 7C3 6.58579 3.33579 6.25 3.75 6.25H6.25V3.75C6.25 3.33579 6.58579 3 7 3Z"
          fill="currentColor"
          fillRule="evenodd"
        />
        <path
          clipRule="evenodd"
          d="M19.8284 14.1716C20.1213 14.4645 20.1213 14.9393 19.8284 15.2322L18.0607 17L19.8284 18.7678C20.1213 19.0607 20.1213 19.5355 19.8284 19.8284C19.5355 20.1213 19.0607 20.1213 18.7678 19.8284L17 18.0607L15.2322 19.8284C14.9393 20.1213 14.4645 20.1213 14.1716 19.8284C13.8787 19.5355 13.8787 19.0607 14.1716 18.7678L15.9393 17L14.1716 15.2322C13.8787 14.9393 13.8787 14.4645 14.1716 14.1716C14.4645 13.8787 14.9393 13.8787 15.2322 14.1716L17 15.9393L18.7678 14.1716C19.0607 13.8787 19.5355 13.8787 19.8284 14.1716Z"
          fill="currentColor"
          fillRule="evenodd"
        />
        <path
          d="M3.75 15.25C3.75 14.4216 4.42157 13.75 5.25 13.75H8.75C9.57843 13.75 10.25 14.4216 10.25 15.25V18.75C10.25 19.5784 9.57843 20.25 8.75 20.25H5.25C4.42157 20.25 3.75 19.5784 3.75 18.75V15.25Z"
          fill="currentColor"
        />
        <path
          clipRule="evenodd"
          d="M3 15.25C3 14.0074 4.00736 13 5.25 13H8.75C9.99264 13 11 14.0074 11 15.25V18.75C11 19.9926 9.99264 21 8.75 21H5.25C4.00736 21 3 19.9926 3 18.75V15.25ZM5.25 14.5C4.83579 14.5 4.5 14.8358 4.5 15.25V18.75C4.5 19.1642 4.83579 19.5 5.25 19.5H8.75C9.16421 19.5 9.5 19.1642 9.5 18.75V15.25C9.5 14.8358 9.16421 14.5 8.75 14.5H5.25Z"
          fill="currentColor"
          fillRule="evenodd"
        />
      </g>
      <defs>
        <filter
          colorInterpolationFilters="sRGB"
          filterUnits="userSpaceOnUse"
          height="27.0625"
          id="filter0_iiii_368_6054"
          width="18.0625"
          x="3"
          y="-5.0625"
        >
          <feFlood floodOpacity="0" result="BackgroundImageFix" />
          <feBlend
            in="SourceGraphic"
            in2="BackgroundImageFix"
            mode="normal"
            result="shape"
          />
          <feColorMatrix
            in="SourceAlpha"
            result="hardAlpha"
            type="matrix"
            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          />
          <feOffset dy="0.5" />
          <feGaussianBlur stdDeviation="0.25" />
          <feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic" />
          <feColorMatrix
            type="matrix"
            values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.12 0"
          />
          <feBlend
            in2="shape"
            mode="normal"
            result="effect1_innerShadow_368_6054"
          />
          <feColorMatrix
            in="SourceAlpha"
            result="hardAlpha"
            type="matrix"
            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          />
          <feOffset dy="1" />
          <feGaussianBlur stdDeviation="0.5" />
          <feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic" />
          <feColorMatrix
            type="matrix"
            values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.08 0"
          />
          <feBlend
            in2="effect1_innerShadow_368_6054"
            mode="normal"
            result="effect2_innerShadow_368_6054"
          />
          <feColorMatrix
            in="SourceAlpha"
            result="hardAlpha"
            type="matrix"
            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          />
          <feOffset dy="1" />
          <feGaussianBlur stdDeviation="1.5" />
          <feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic" />
          <feColorMatrix
            type="matrix"
            values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.08 0"
          />
          <feBlend
            in2="effect2_innerShadow_368_6054"
            mode="normal"
            result="effect3_innerShadow_368_6054"
          />
          <feColorMatrix
            in="SourceAlpha"
            result="hardAlpha"
            type="matrix"
            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          />
          <feOffset dy="-8" />
          <feGaussianBlur stdDeviation="10" />
          <feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic" />
          <feColorMatrix
            type="matrix"
            values="0 0 0 0 0.101961 0 0 0 0 0.0980392 0 0 0 0 0.145098 0 0 0 0.08 0"
          />
          <feBlend
            in2="effect3_innerShadow_368_6054"
            mode="normal"
            result="effect4_innerShadow_368_6054"
          />
        </filter>
      </defs>
    </svg>
  ),
  shine: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M12 1.75V8.25M12 15.75V22.25M8.25 12H1.75M15.75 12H22.25M8 8L6 6M16 8L18 6M16 16L18 18M8 16L6 18"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
    </svg>
  ),
  spinner: (props: IconProps) => (
    <svg
      fill="none"
      height="24"
      stroke="currentColor"
      strokeLinecap="round"
      strokeLinejoin="round"
      strokeWidth="2"
      viewBox="0 0 24 24"
      width="24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path d="M21 12a9 9 0 1 1-6.219-8.56" />
    </svg>
  ),
  square: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <rect fill="currentColor" height="18" rx="2.75" width="18" x="3" y="3" />
    </svg>
  ),
  tailwind: (props: IconProps) => (
    <svg viewBox="0 0 24 24" {...props}>
      <path
        d="M12.001,4.8c-3.2,0-5.2,1.6-6,4.8c1.2-1.6,2.6-2.2,4.2-1.8c0.913,0.228,1.565,0.89,2.288,1.624 C13.666,10.618,15.027,12,18.001,12c3.2,0,5.2-1.6,6-4.8c-1.2,1.6-2.6,2.2-4.2,1.8c-0.913-0.228-1.565-0.89-2.288-1.624 C16.337,6.182,14.976,4.8,12.001,4.8z M6.001,12c-3.2,0-5.2,1.6-6,4.8c1.2-1.6,2.6-2.2,4.2-1.8c0.913,0.228,1.565,0.89,2.288,1.624 c1.177,1.194,2.538,2.576,5.512,2.576c3.2,0,5.2-1.6,6-4.8c-1.2,1.6-2.6,2.2-4.2,1.8c-0.913-0.228-1.565-0.89-2.288-1.624 C10.337,13.382,8.976,12,6.001,12z"
        fill="currentColor"
      />
    </svg>
  ),
  targetArrow: (props: IconProps) => (
    <svg
      fill="none"
      height="32"
      viewBox="0 0 32 32"
      width="32"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M24.7906 2.91842C24.4903 1.94246 23.2493 1.65246 22.5476 2.39427L19.3677 5.75582C18.4895 6.68427 18.0001 7.91379 18.0001 9.19182V12.5855L15.293 15.2926C14.9025 15.6831 14.9025 16.3163 15.293 16.7068C15.6835 17.0973 16.3167 17.0973 16.7072 16.7068L19.4143 13.9997H22.8079C24.086 13.9997 25.3155 13.5103 26.2439 12.632L29.6055 9.45217C30.3473 8.75045 30.0573 7.50947 29.0813 7.20917L25.8002 6.19958L24.7906 2.91842Z"
        fill="currentColor"
      />
      <path
        d="M4.66675 16C4.66675 9.74077 9.74085 4.66667 16.0001 4.66667C16.206 4.66667 16.4105 4.67215 16.6136 4.68296C17.1651 4.71234 17.636 4.28907 17.6653 3.73757C17.6947 3.18607 17.2714 2.71517 16.7199 2.68579C16.4815 2.67309 16.2415 2.66667 16.0001 2.66667C8.63628 2.66667 2.66675 8.6362 2.66675 16C2.66675 23.3638 8.63628 29.3333 16.0001 29.3333C23.3639 29.3333 29.3334 23.3638 29.3334 16C29.3334 15.7586 29.327 15.5186 29.3143 15.2801C29.2849 14.7286 28.814 14.3054 28.2625 14.3347C27.711 14.3641 27.2877 14.835 27.3171 15.3865C27.3279 15.5895 27.3334 15.7941 27.3334 16C27.3334 22.2592 22.2593 27.3333 16.0001 27.3333C9.74085 27.3333 4.66675 22.2592 4.66675 16Z"
        fill="currentColor"
      />
      <path
        d="M14.8581 10.0755C15.4002 9.96976 15.754 9.44464 15.6483 8.90257C15.5426 8.36049 15.0175 8.00673 14.4754 8.11242C10.7854 8.83188 8.00008 12.0803 8.00008 15.9814C8.00008 20.4093 11.5896 23.9988 16.0174 23.9988C19.9185 23.9988 23.1669 21.2135 23.8864 17.5236C23.9921 16.9815 23.6383 16.4564 23.0963 16.3507C22.5542 16.245 22.0291 16.5988 21.9234 17.1408C21.3835 19.9094 18.9434 21.9988 16.0174 21.9988C12.6941 21.9988 10.0001 19.3047 10.0001 15.9814C10.0001 13.0554 12.0895 10.6153 14.8581 10.0755Z"
        fill="currentColor"
      />
    </svg>
  ),
  thumbsDown: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M17.2521 13.25H20.25C20.8023 13.25 21.25 12.8023 21.25 12.25V4.75C21.25 4.19772 20.8023 3.75 20.25 3.75H17.2521M17.2521 3.75V13L13.2835 20.7078C13.112 21.0407 12.7635 21.25 12.389 21.25V21.25C11.1622 21.25 10.2249 20.1546 10.4139 18.9419L10.9892 15.25H5.74908C3.91335 15.25 2.50859 13.6144 2.78476 11.7987L3.62128 6.29867C3.84421 4.83298 5.1038 3.75 6.5856 3.75H17.2521Z"
        stroke="currentColor"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
    </svg>
  ),
  thumbsUp: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M6.75 10.75H3.75C3.19772 10.75 2.75 11.1977 2.75 11.75V19.25C2.75 19.8023 3.19772 20.25 3.75 20.25H6.75M6.75 20.25V11L10.7208 3.29204C10.8922 2.95918 11.2365 2.75 11.611 2.75C12.8384 2.75 13.7808 3.84535 13.5917 5.0581L13.0161 8.75H18.2589C20.0956 8.75 21.5011 10.3856 21.2248 12.2013L20.3878 17.7013C20.1648 19.167 18.9046 20.25 17.422 20.25H6.75Z"
        stroke="currentColor"
        strokeLinecap="round"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
    </svg>
  ),
  ts: (props: IconProps) => (
    <svg
      fill="currentColor"
      height="24"
      viewBox="0 0 24 24"
      width="24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path d="M18 3a3 3 0 0 1 3 3v12a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V6a3 3 0 0 1 3-3h12Zm-2.476 7.128c-.583 0-1.104.101-1.562.305a2.609 2.609 0 0 0-1.082.847c-.26.362-.39.785-.387 1.27-.002.591.192 1.061.582 1.41.39.349.923.605 1.598.77l.87.218c.293.07.539.149.74.235.202.086.356.19.46.312.107.123.16.274.16.453a.803.803 0 0 1-.175.512 1.143 1.143 0 0 1-.497.348c-.21.083-.46.125-.746.125-.291 0-.553-.045-.785-.133a1.281 1.281 0 0 1-.55-.402 1.23 1.23 0 0 1-.231-.672h-1.637c.013.575.153 1.058.418 1.449.268.388.64.68 1.117.879.48.198 1.042.297 1.688.297.65 0 1.207-.098 1.668-.293.463-.198.818-.476 1.062-.832.248-.36.373-.784.375-1.274a2.125 2.125 0 0 0-.183-.887 1.997 1.997 0 0 0-.496-.671 2.92 2.92 0 0 0-.758-.48 5.069 5.069 0 0 0-.961-.313l-.719-.172a4.213 4.213 0 0 1-.492-.14 2.109 2.109 0 0 1-.406-.2.938.938 0 0 1-.278-.277.658.658 0 0 1-.09-.375c0-.172.05-.326.149-.461a.984.984 0 0 1 .438-.317c.19-.078.423-.117.699-.117.406 0 .728.087.964.262.238.174.372.419.403.734H18.5a2.242 2.242 0 0 0-.383-1.258 2.46 2.46 0 0 0-1.039-.847c-.443-.204-.96-.305-1.555-.305Zm-9.756.11v1.394h2.449v6.605h1.672v-6.605h2.449v-1.395h-6.57Z" />
    </svg>
  ),
  twitter: (props: IconProps) => (
    <svg
      {...props}
      height="23"
      viewBox="0 0 1200 1227"
      width="23"
      xmlns="http://www.w3.org/2000/svg"
    >
      <path d="M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z" />
    </svg>
  ),
  unBlur: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M9.75 6.25C9.75 6.80228 9.30228 7.25 8.75 7.25C8.19772 7.25 7.75 6.80228 7.75 6.25C7.75 5.69772 8.19772 5.25 8.75 5.25C9.30228 5.25 9.75 5.69772 9.75 6.25Z"
        fill="currentColor"
      />
      <path
        d="M6.25 6.25C6.25 6.80228 5.80228 7.25 5.25 7.25C4.69772 7.25 4.25 6.80228 4.25 6.25C4.25 5.69772 4.69772 5.25 5.25 5.25C5.80228 5.25 6.25 5.69772 6.25 6.25Z"
        fill="currentColor"
      />
      <path
        d="M9.75 17.75C9.75 18.3023 9.30228 18.75 8.75 18.75C8.19772 18.75 7.75 18.3023 7.75 17.75C7.75 17.1977 8.19772 16.75 8.75 16.75C9.30228 16.75 9.75 17.1977 9.75 17.75Z"
        fill="currentColor"
      />
      <path
        d="M9.5 3.25C9.5 3.66421 9.16421 4 8.75 4C8.33579 4 8 3.66421 8 3.25C8 2.83579 8.33579 2.5 8.75 2.5C9.16421 2.5 9.5 2.83579 9.5 3.25Z"
        fill="currentColor"
      />
      <path
        d="M3.25 10C3.25 10.4142 2.91421 10.75 2.5 10.75C2.08579 10.75 1.75 10.4142 1.75 10C1.75 9.58579 2.08579 9.25 2.5 9.25C2.91421 9.25 3.25 9.58579 3.25 10Z"
        fill="currentColor"
      />
      <path
        d="M3.25 14C3.25 14.4142 2.91421 14.75 2.5 14.75C2.08579 14.75 1.75 14.4142 1.75 14C1.75 13.5858 2.08579 13.25 2.5 13.25C2.91421 13.25 3.25 13.5858 3.25 14Z"
        fill="currentColor"
      />
      <path
        d="M9.5 20.75C9.5 21.1642 9.16421 21.5 8.75 21.5C8.33579 21.5 8 21.1642 8 20.75C8 20.3358 8.33579 20 8.75 20C9.16421 20 9.5 20.3358 9.5 20.75Z"
        fill="currentColor"
      />
      <path
        d="M10.25 10C10.25 10.8284 9.57843 11.5 8.75 11.5C7.92157 11.5 7.25 10.8284 7.25 10C7.25 9.17157 7.92157 8.5 8.75 8.5C9.57843 8.5 10.25 9.17157 10.25 10Z"
        fill="currentColor"
      />
      <path
        d="M10.25 14C10.25 14.8284 9.57843 15.5 8.75 15.5C7.92157 15.5 7.25 14.8284 7.25 14C7.25 13.1716 7.92157 12.5 8.75 12.5C9.57843 12.5 10.25 13.1716 10.25 14Z"
        fill="currentColor"
      />
      <path
        d="M6.25 10C6.25 10.5523 5.80228 11 5.25 11C4.69772 11 4.25 10.5523 4.25 10C4.25 9.44772 4.69772 9 5.25 9C5.80228 9 6.25 9.44772 6.25 10Z"
        fill="currentColor"
      />
      <path
        d="M6.25 14C6.25 14.5523 5.80228 15 5.25 15C4.69772 15 4.25 14.5523 4.25 14C4.25 13.4477 4.69772 13 5.25 13C5.80228 13 6.25 13.4477 6.25 14Z"
        fill="currentColor"
      />
      <path
        d="M6.25 17.75C6.25 18.3023 5.80228 18.75 5.25 18.75C4.69772 18.75 4.25 18.3023 4.25 17.75C4.25 17.1977 4.69772 16.75 5.25 16.75C5.80228 16.75 6.25 17.1977 6.25 17.75Z"
        fill="currentColor"
      />
      <path
        d="M12 21.25C17.1086 21.25 21.25 17.1086 21.25 12C21.25 6.89137 17.1086 2.75 12 2.75V21.25Z"
        stroke="currentColor"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
    </svg>
  ),
  user: (props: IconProps) => (
    <svg
      fill="none"
      height="22"
      viewBox="0 0 22 22"
      width="22"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <g clipPath="url(#clip0_462_8423)">
        <g filter="url(#filter0_d_462_8423)">
          <path
            d="M11.0001 1.78418C8.69482 1.78418 6.82601 3.65299 6.82601 5.95829C6.82601 8.26358 8.69482 10.1324 11.0001 10.1324C13.3054 10.1324 15.1742 8.26358 15.1742 5.95829C15.1742 3.65299 13.3054 1.78418 11.0001 1.78418Z"
            fill="white"
          />
          <path
            d="M3.94097 16.0563C5.03255 13.1048 7.72088 11 11.2335 11C12.8048 11 14.2112 11.4212 15.3835 12.151C15.3155 12.1476 15.2463 12.1458 15.1759 12.1458C14.209 12.1458 13.245 12.5351 12.5333 13.2942C11.8115 14.0642 11.4583 15.0916 11.4583 16.1944C11.4583 17.474 12.0454 18.5041 12.6803 19.25H6.37222C5.56831 19.25 4.82205 18.8991 4.33863 18.323C3.84257 17.7318 3.62891 16.9001 3.94097 16.0563Z"
            fill="white"
          />
          <path
            clipRule="evenodd"
            d="M15.1762 13.5208C14.5779 13.5208 13.9808 13.761 13.5367 14.2346C13.0894 14.7118 12.8336 15.3852 12.8336 16.1944C12.8336 17.4691 13.7296 18.4737 14.4797 19.0933C14.8733 19.4184 15.2736 19.6769 15.5961 19.856C15.7572 19.9455 15.9056 20.019 16.0301 20.0723C16.0917 20.0987 16.1552 20.1236 16.2163 20.1431C16.2549 20.1555 16.3693 20.1921 16.5002 20.1921C16.6312 20.1921 16.7449 20.1557 16.7835 20.1433C16.8446 20.1238 16.9088 20.0987 16.9704 20.0723C17.0949 20.019 17.2432 19.9455 17.4044 19.856C17.7269 19.6769 18.1272 19.4184 18.5208 19.0933C19.2709 18.4737 20.1669 17.4691 20.1669 16.1944C20.1669 15.3852 19.9111 14.7118 19.4638 14.2346C19.0197 13.761 18.4226 13.5208 17.8243 13.5208C17.27 13.5208 16.8262 13.6875 16.5227 13.853L16.5002 13.8654L16.4777 13.853C16.1743 13.6875 15.7305 13.5208 15.1762 13.5208ZM14.2086 16.1944C14.2086 15.6796 14.3665 15.3599 14.5399 15.175L16.0211 15.1978L16.0192 15.1961C16.0166 15.1938 16.0123 15.1901 16.0063 15.1851L16.9856 15.1917L16.9849 15.1925L16.9835 15.1938L16.9813 15.1959L16.9788 15.1983C16.9779 15.1992 16.9783 15.1989 16.9788 15.1983L16.9813 15.1959C16.9863 15.1916 16.9974 15.182 17.0145 15.1687C17.049 15.1417 17.1054 15.1014 17.1812 15.0601C17.3329 14.9774 17.5511 14.8958 17.8243 14.8958C18.0536 14.8958 18.284 14.9867 18.4606 15.175C18.6339 15.3599 18.7919 15.6796 18.7919 16.1944C18.7919 16.8231 18.3225 17.4736 17.6451 18.0332C17.3249 18.2977 16.996 18.51 16.7366 18.6541C16.6446 18.7052 16.5647 18.7458 16.5002 18.7762C16.4358 18.7458 16.3559 18.7052 16.2639 18.6541C16.0045 18.51 15.6756 18.2977 15.3554 18.0332C14.678 17.4736 14.2086 16.8231 14.2086 16.1944ZM16.0063 15.1851C16.0009 15.1805 15.9941 15.175 15.986 15.1687C15.9515 15.1417 15.8951 15.1014 15.8193 15.0601C15.6676 14.9774 15.4494 14.8958 15.1762 14.8958C14.9469 14.8958 14.7164 14.9867 14.5399 15.175L16.0063 15.1851ZM16.365 18.8336C16.3541 18.837 16.3561 18.8357 16.368 18.8326L16.365 18.8336ZM16.6325 18.8326C16.6444 18.8357 16.6464 18.837 16.6355 18.8336L16.6325 18.8326Z"
            fill="white"
            fillRule="evenodd"
          />
        </g>
      </g>
      <defs>
        <filter
          colorInterpolationFilters="sRGB"
          filterUnits="userSpaceOnUse"
          height="20.4079"
          id="filter0_d_462_8423"
          width="18.3711"
          x="2.79492"
          y="1.78418"
        >
          <feFlood floodOpacity="0" result="BackgroundImageFix" />
          <feColorMatrix
            in="SourceAlpha"
            result="hardAlpha"
            type="matrix"
            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          />
          <feOffset dy="1" />
          <feGaussianBlur stdDeviation="0.5" />
          <feComposite in2="hardAlpha" operator="out" />
          <feColorMatrix
            type="matrix"
            values="0 0 0 0 0 0 0 0 0 0.0874148 0 0 0 0 0.292253 0 0 0 0.16 0"
          />
          <feBlend
            in2="BackgroundImageFix"
            mode="normal"
            result="effect1_dropShadow_462_8423"
          />
          <feBlend
            in="SourceGraphic"
            in2="effect1_dropShadow_462_8423"
            mode="normal"
            result="shape"
          />
        </filter>
        <clipPath id="clip0_462_8423">
          <rect fill="white" height="22" width="22" />
        </clipPath>
      </defs>
    </svg>
  ),
  v0: (props: IconProps) => (
    <svg
      fill="currentColor"
      viewBox="0 0 16 16"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        clipRule="evenodd"
        d="M9.50321 5.5H13.2532C13.3123 5.5 13.3704 5.5041 13.4273 5.51203L9.51242 9.42692C9.50424 9.36912 9.5 9.31006 9.5 9.25L9.5 5.5L8 5.5L8 9.25C8 10.7688 9.23122 12 10.75 12H14.5V10.5L10.75 10.5C10.6899 10.5 10.6309 10.4958 10.5731 10.4876L14.4904 6.57028C14.4988 6.62897 14.5032 6.68897 14.5032 6.75V10.5H16.0032V6.75C16.0032 5.23122 14.772 4 13.2532 4H9.50321V5.5ZM0 5V5.00405L5.12525 11.5307C5.74119 12.3151 7.00106 11.8795 7.00106 10.8822V5H5.50106V9.58056L1.90404 5H0Z"
        fillRule="evenodd"
      />
    </svg>
  ),
  yarn: (props: IconProps) => (
    <svg viewBox="0 0 24 24" {...props}>
      <path
        d="M12 0C5.375 0 0 5.375 0 12s5.375 12 12 12 12-5.375 12-12S18.625 0 12 0zm.768 4.105c.183 0 .363.053.525.157.125.083.287.185.755 1.154.31-.088.468-.042.551-.019.204.056.366.19.463.375.477.917.542 2.553.334 3.605-.241 1.232-.755 2.029-1.131 2.576.324.329.778.899 1.117 1.825.278.774.31 1.478.273 2.015a5.51 5.51 0 0 0 .602-.329c.593-.366 1.487-.917 2.553-.931.714-.009 1.269.445 1.353 1.103a1.23 1.23 0 0 1-.945 1.362c-.649.158-.95.278-1.821.843-1.232.797-2.539 1.242-3.012 1.39a1.686 1.686 0 0 1-.704.343c-.737.181-3.266.315-3.466.315h-.046c-.783 0-1.214-.241-1.45-.491-.658.329-1.51.19-2.122-.134a1.078 1.078 0 0 1-.58-1.153 1.243 1.243 0 0 1-.153-.195c-.162-.25-.528-.936-.454-1.946.056-.723.556-1.367.88-1.71a5.522 5.522 0 0 1 .408-2.256c.306-.727.885-1.348 1.32-1.737-.32-.537-.644-1.367-.329-2.21.227-.602.412-.936.82-1.08h-.005c.199-.074.389-.153.486-.259a3.418 3.418 0 0 1 2.298-1.103c.037-.093.079-.185.125-.283.31-.658.639-1.029 1.024-1.168a.94.94 0 0 1 .328-.06zm.006.7c-.507.016-1.001 1.519-1.001 1.519s-1.27-.204-2.266.871c-.199.218-.468.334-.746.44-.079.028-.176.023-.417.672-.371.991.625 2.094.625 2.094s-1.186.839-1.626 1.881c-.486 1.144-.338 2.261-.338 2.261s-.843.732-.899 1.487c-.051.663.139 1.2.343 1.515.227.343.51.176.51.176s-.561.653-.037.931c.477.25 1.283.394 1.71-.037.31-.31.371-1.001.486-1.283.028-.065.12.111.209.199.097.093.264.195.264.195s-.755.324-.445 1.066c.102.246.468.403 1.066.398.222-.005 2.664-.139 3.313-.296.375-.088.505-.283.505-.283s1.566-.431 2.998-1.357c.917-.598 1.293-.76 2.034-.936.612-.148.57-1.098-.241-1.084-.839.009-1.575.44-2.196.825-1.163.718-1.742.672-1.742.672l-.018-.032c-.079-.13.371-1.293-.134-2.678-.547-1.515-1.413-1.881-1.344-1.997.297-.5 1.038-1.297 1.334-2.78.176-.899.13-2.377-.269-3.151-.074-.144-.732.241-.732.241s-.616-1.371-.788-1.483a.271.271 0 0 0-.157-.046z"
        fill="currentColor"
      />
    </svg>
  ),
  zap: (props: IconProps) => (
    <svg
      fill="none"
      viewBox="0 0 24 24"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M19.7978 8.75H13.75C13.4739 8.75 13.25 8.52614 13.25 8.25V2.3557C13.25 1.86505 12.6169 1.66792 12.3384 2.07183L3.7906 14.4661C3.56185 14.7978 3.79928 15.25 4.2022 15.25H10.25C10.5261 15.25 10.75 15.4739 10.75 15.75V21.6443C10.75 22.135 11.383 22.3321 11.6616 21.9282L20.2094 9.53387C20.4382 9.20218 20.2007 8.75 19.7978 8.75Z"
        stroke="currentColor"
        strokeLinejoin="round"
        strokeWidth="1.5"
      />
    </svg>
  ),
};

export function getIconForLanguageExtension(language: string) {
  switch (language) {
    case "json":
      return <HugeiconsIcon icon={ThirdBracketIcon} strokeWidth={2} />;
    case "css":
      return <HugeiconsIcon icon={CssFile01Icon} strokeWidth={2} />;
    case "js":
    case "jsx":
    case "ts":
    case "tsx":
    case "typescript":
      return <HugeiconsIcon icon={Typescript02Icon} strokeWidth={2} />;
    default:
      return <HugeiconsIcon icon={Folder01Icon} strokeWidth={2} />;
  }
}
```