How to use the Mysql icon in React?

Import the Mysql component: import { Mysql } from "@/icons/languages-frameworks/Mysql". Then use it as . No npm install needed — just copy the file into your project.

Is the Mysql icon free to use?

Yes, the Mysql icon is 100% free and open source under the MIT license. Use it in personal and commercial projects without attribution.

Can I customize the mysql icon size and color?

Yes. Pass size prop (number) to control dimensions, color prop (string) for fill/stroke color, and className for Tailwind or CSS styling. All standard SVG props are also supported.

Does the Mysql icon work with Next.js and Tailwind CSS?

Yes. The icon is a TypeScript React component that works with Next.js App Router, Pages Router, and Tailwind CSS. It's also compatible with Vue, Remix, Svelte, Astro, and any JSX/TSX framework.

Do I need to install any package for the mysql icon?

No. Next Icons is a zero-dependency icon library. Simply copy the component source code into your project and import it. No npm install, no package.json changes.

Mysql Icon — Free SVG React Component | Next Icons

Copy code

import type { SVGProps } from "react";

export type IconProps = {
  size?: number | string;
  color?: string;
  className?: string;
} & SVGProps<SVGSVGElement>;

export const Mysql = ({
  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="M15.44 6.61c.05.08.13.15.18.22s.09.18.13.27a.31.31 0 0 0 .12-.28s0-.08-.07-.12-.1-.08-.15-.12zM5.54 13l-1.12 3.36L3.3 13h-1c-.18 1.44-.29 3-.34 4.61h.7c0-1.35.08-2.57.17-3.67L4 17.58h.59l1.21-3.67c.12 1.15.2 2.37.23 3.67h.77c0-1.39-.16-2.93-.36-4.61zm3.19 4.08a2.9 2.9 0 0 0-.17-.93l-.61-2h-.76L8 16.81a3.2 3.2 0 0 1 .19.79.66.66 0 0 1-.25.5.77.77 0 0 1-.54.19h-.32v.41a1.5 1.5 0 0 0 .47.11 1.66 1.66 0 0 0 1.32-.89 10.4 10.4 0 0 0 1.25-3.72h-.7a12.7 12.7 0 0 1-.69 2.88m10.24-4.11h-.73v4.61h2.19v-.56h-1.46zM17 17.07a2.83 2.83 0 0 0 .54-1.88c0-1.52-.6-2.29-1.8-2.29a1.7 1.7 0 0 0-1.37.58 2.85 2.85 0 0 0-.54 1.88 2.72 2.72 0 0 0 .48 1.78 1.63 1.63 0 0 0 1.31.51 2.4 2.4 0 0 0 .61-.08l1.1.64.3-.52-.85-.41a2 2 0 0 0 .22-.21m-1.3 0a.88.88 0 0 1-.81-.42 2.8 2.8 0 0 1-.28-1.45q0-1.74 1-1.74a.9.9 0 0 1 .82.42 2.9 2.9 0 0 1 .28 1.43c.08 1.18-.28 1.77-.98 1.77zM13 15.33l-1-.56c-.36-.2-.56-.43-.56-.71a.56.56 0 0 1 .21-.43.76.76 0 0 1 .54-.17 2.2 2.2 0 0 1 .89.19l.18-.4a2.1 2.1 0 0 0-1.17-.34 1.48 1.48 0 0 0-1 .35 1.14 1.14 0 0 0-.39.9 1.09 1.09 0 0 0 .52 1l1 .55c.35.2.54.43.54.7a.64.64 0 0 1-.25.52 1 1 0 0 1-.65.18 2.24 2.24 0 0 1-1-.27l-.2.39a2.3 2.3 0 0 0 1.31.43 1.72 1.72 0 0 0 1.16-.37 1.24 1.24 0 0 0 .43-1 1.09 1.09 0 0 0-.56-.96" />
      <path d="M21.74 12.89a2.8 2.8 0 0 0-.58-.56c-.17-.12-.56-.29-.64-.5a1.7 1.7 0 0 0 .39-.09c.19-.05.36 0 .55-.09l.27-.07v-.05c-.1-.1-.17-.24-.28-.33a6.3 6.3 0 0 0-.92-.69c-.17-.11-.39-.18-.58-.28s-.17-.05-.21-.1a2.2 2.2 0 0 1-.23-.43c-.16-.31-.32-.65-.46-1s-.16-.43-.28-.64A5.7 5.7 0 0 0 16.6 6a2.5 2.5 0 0 0-.71-.23h-.42a3 3 0 0 1-.26-.19c-.31-.21-1.13-.64-1.37-.07-.15.37.23.72.36.91a3 3 0 0 1 .28.41c0 .1 0 .2.09.3a7 7 0 0 0 .29.75 4 4 0 0 0 .2.34c0 .06.13.09.14.19a1.7 1.7 0 0 0-.12.42 2.38 2.38 0 0 0 .16 1.87c.09.14.3.45.58.33s.2-.42.27-.7v-.15c.08.15.15.3.23.46a3.2 3.2 0 0 0 .72.75c.13.1.24.27.41.33a1 1 0 0 0-.13-.11 3 3 0 0 1-.29-.33 7.4 7.4 0 0 1-.63-1l-.2-.58c0-.07 0-.17-.09-.2a1.7 1.7 0 0 0-.27.38 3 3 0 0 0-.16.84c-.18 0-.24-.23-.31-.38a2.5 2.5 0 0 1 0-1.49c0-.12.21-.49.14-.6s-.14-.16-.2-.25a1.8 1.8 0 0 1-.2-.35c-.14-.32-.2-.66-.35-1a2.4 2.4 0 0 0-.28-.43 3 3 0 0 1-.3-.44.27.27 0 0 1 0-.23.1.1 0 0 1 .08-.07c.07-.06.28 0 .35.05a3 3 0 0 1 .55.28 1 1 0 0 0 .27.19h.11c.18 0 .38 0 .55.06a4 4 0 0 1 .8.39 5 5 0 0 1 1.74 1.9c.07.13.09.25.16.38s.26.55.37.82a4 4 0 0 0 .4.75c.08.11.42.17.57.24s.28.09.38.15l.56.38c.09.07.37.21.38.32a2.7 2.7 0 0 0-1.08.15c-.08 0-.21 0-.23.14s.05.12.09.18a1.6 1.6 0 0 0 .29.34l.36.26c.22.13.46.21.67.34s.25.18.37.26.1.12.18.15c0-.05-.05-.12-.09-.18zm-.95 4.22h.16v.47h.13v-.47h.16v-.09h-.45zm.9.29-.16-.38h-.17v.56h.11v-.43h.01l.16.43h.08l.17-.43v.43H22v-.56h-.17z" />
  </svg>
);

Default · 24px · currentColor

Install · TSX

1.Copy the code — Use the Copy button above (TSX tab).
2.Save the file — Create Mysql.tsx in your icons or components folder.
3.Import — import { Mysql } from "./icons/Mysql";
4.Render — <Mysql size={24} color="currentColor" />

UI examples

Size, inline, toolbar, and dark UI — works for any icon style.

24px default

16px24px32px48px