Copy code import type { SVGProps } from "react";
export type IconProps = {
size?: number | string;
color?: string;
className?: string;
} & SVGProps<SVGSVGElement>;
export const Bootstrap = ({
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="M18.002 2.997H5.999A3.01 3.01 0 0 0 2.997 6v12.002a3.01 3.01 0 0 0 3.002 3.001h12.003a3.01 3.01 0 0 0 3.001-3.001V6a3.01 3.01 0 0 0-3.001-3.003m-1.64 12.647c-.152.36-.389.68-.693.927a3.6 3.6 0 0 1-1.206.614q-.735.228-1.75.229H7.888V6.909h5.103q1.415-.002 2.267.646c.569.436.854 1.082.854 1.958q0 .794-.389 1.357-.389.56-1.111.868v.034c.642.135 1.137.438 1.464.912q.492.71.493 1.789c0 .405-.078.788-.225 1.147l.02.021v.003zm-2.084-2.589q-.462-.421-1.297-.419H9.737v3.276h3.253c.554 0 .991-.144 1.298-.435q.463-.435.464-1.229c-.005-.518-.156-.919-.464-1.193h-.014zm-.451-2.119c.299-.251.444-.613.444-1.084 0-.526-.131-.902-.397-1.116-.264-.214-.646-.326-1.146-.326H9.727v2.898h3.001c.436.001.81-.127 1.099-.372" />
</svg>
);Default · 24px · currentColor
UI examples Size, inline, toolbar, and dark UI — works for any icon style.
Related languages-frameworks icons
Bootstrap Icon — Free SVG Component The Bootstrap 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 Bootstrap icon in React Import the Bootstrap 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: <Bootstrap 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.