Copy code import type { SVGProps } from "react";
export type IconProps = {
size?: number | string;
color?: string;
className?: string;
} & SVGProps<SVGSVGElement>;
export const Meta = ({
size = 24,
color = "currentColor",
className,
...props
}: IconProps) => (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
width={size}
height={size}
fill={color}
className={className}
{...props}
>
<path d="M20.26 7.8a4.82 4.82 0 0 0-3.93-2.44 3.9 3.9 0 0 0-2.54 1.09 10.6 10.6 0 0 0-1.52 1.71 11 11 0 0 0-1.63-1.72 4.4 4.4 0 0 0-2.88-1.08A5 5 0 0 0 3.7 8 11.5 11.5 0 0 0 2 14a7 7 0 0 0 .18 1.64A4.4 4.4 0 0 0 2.71 17a3.23 3.23 0 0 0 3 1.6c1.25 0 2.19-.56 3.3-2a26.4 26.4 0 0 0 2.21-3.6l.63-1.12c.06-.09.11-.18.16-.27l.15.25 1.79 3A14.8 14.8 0 0 0 16 17.63a3.38 3.38 0 0 0 2.55 1 3 3 0 0 0 2.54-1.23 2 2 0 0 0 .18-.28 4 4 0 0 0 .31-.63l.12-.35A6.5 6.5 0 0 0 22 15a9 9 0 0 0 0-1 11.15 11.15 0 0 0-1.74-6.2m-10.12 3.56c-.64 1-1.57 2.51-2.37 3.61-1 1.37-1.51 1.51-2.07 1.51a1.29 1.29 0 0 1-1.15-.66 3.3 3.3 0 0 1-.39-1.7A9.74 9.74 0 0 1 5.54 9a2.8 2.8 0 0 1 2.19-1.47A3 3 0 0 1 10 8.74a14 14 0 0 1 1 1.31zm8.42 5.12c-.48 0-.85-.19-1.38-.83A35 35 0 0 1 14.82 12l-.52-.86c-.36-.61-.71-1.16-1-1.65a3 3 0 0 1 .17-.27c.94-1.39 1.77-2.17 2.8-2.17a3.12 3.12 0 0 1 2.49 1.66 10.17 10.17 0 0 1 1.37 5.34c-.04 1.31-.34 2.43-1.57 2.43" />
</svg>
);Default · 24px · currentColor
UI examples Size, inline, toolbar, and dark UI — works for any icon style.
Meta Icon — Free SVG Component The Meta icon is a free, open-source SVG icon component built with TypeScript for React, Next.js, Vue, Remix, Svelte, and Astro projects. No npm install or package dependency required — just copy the component code and paste it into your project.
How to use Meta icon in React Import the Meta component from your icons folder. Use it as a standard React component with props: size (number), color (string), className (string), and all standard SVG attributes via spread props.
Example: <Meta size={24} color=“currentColor“ className=“shrink-0“ />
Features Zero dependencies — no package install needed TypeScript ready with full type safety Fully customizable size, color, and className Works with Tailwind CSS, styled-components, CSS modules Accessible — supports aria attributes Tree-shakeable — only import what you use MIT licensed — free for commercial use Compatible frameworks React, Next.js (App Router & Pages Router), Vue, Remix, Svelte, Astro, Nuxt, Gatsby, Vite, Angular, Qwik.
Category: brands Browse more brands icons in the Next Icons library. All icons are hand-crafted SVGs optimized for web performance.