Copy code import type { SVGProps } from "react";
export type IconProps = {
size?: number | string;
color?: string;
className?: string;
} & SVGProps<SVGSVGElement>;
export const Bash = ({
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="m19.54 6.08-6.32-3.75c-.75-.44-1.68-.44-2.42 0L4.48 6.08c-.76.46-1.23 1.28-1.23 2.17v7.5c0 .89.46 1.71 1.22 2.17l6.32 3.75c.75.44 1.68.44 2.42 0l6.32-3.75a2.53 2.53 0 0 0 1.22-2.17v-7.5c0-.88-.45-1.71-1.21-2.17m-4.89 11.71v.54c0 .07-.04.13-.09.17l-.32.18s-.09 0-.09-.07v-.53c-.23.11-.48.14-.73.07a.095.095 0 0 1-.03-.12l.11-.49s.03-.08.06-.11c0 0 .02-.02.03-.02h.05c.22.06.46.03.66-.08a.87.87 0 0 0 .49-.76c0-.27-.15-.39-.51-.39-.46 0-.87-.09-.89-.76.01-.59.28-1.14.74-1.5v-.54c0-.07.04-.13.09-.17l.31-.2s.09 0 .09.07v.54c.19-.09.4-.11.6-.07.04.02.06.08.04.12l-.11.48q-.015.075-.09.12h-.05c-.2-.04-.41 0-.58.09-.26.11-.43.36-.44.65 0 .25.13.32.57.33.58 0 .84.26.84.85-.01.61-.29 1.19-.77 1.58Zm3.31-.91s-.01.09-.05.12l-1.59.97s-.04.01-.05 0-.02-.03-.02-.05v-.41s.03-.08.07-.1l1.57-.94s.04-.01.05 0 .02.03.02.05zm1.1-9.22-5.98 3.69c-.75.44-1.29.92-1.29 1.82v7.36c0 .54.22.87.55.99q-.165.03-.33.03c-.35 0-.7-.1-1-.28l-6.32-3.75a2.04 2.04 0 0 1-1-1.78v-7.5c0-.73.37-1.41 1-1.79l6.32-3.75a1.95 1.95 0 0 1 1.98 0l6.32 3.75c.52.31.87.84.97 1.44-.2-.45-.68-.56-1.23-.25Z" />
</svg>
);Default · 24px · currentColor
UI examples Size, inline, toolbar, and dark UI — works for any icon style.
Related languages-frameworks icons
Bash Icon — Free SVG Component The Bash 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 Bash icon in React Import the Bash 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: <Bash 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: languages-frameworks Browse more languages-frameworks icons in the Next Icons library. All icons are hand-crafted SVGs optimized for web performance.