Hover the icon or press Play. Suggested motion: grow. Pick another to preview it and update the animated code:
Layout Sidebar Inset icon
A free layout sidebar inset icon from Bootstrap Icons, ready for React. Use it static or animated: both versions are below, copy-paste or one shadcn command away. Sized in em and colored by currentColor.
- License
- MIT license
- Project
- github.com
npx shadcn@latest add https://ui.cuelark.com/r/icons/bootstrap/layout-sidebar-inset.jsonimport * as React from "react";
/**
* Layout Sidebar Inset from Bootstrap Icons (https://github.com/twbs/icons), MIT.
* Via Cuelark UI: ui.cuelark.com/icons/bootstrap/layout-sidebar-inset. Sized in em, colored by currentColor.
*/
export function BsLayoutSidebarInsetIcon(props: React.SVGProps<SVGSVGElement>) {
return (
<svg
aria-hidden="true"
viewBox="0 0 16 16"
stroke="currentColor"
fill="currentColor"
strokeWidth="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<path
d="M14 2a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1zM2 1a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2z"
/>
<path d="M3 4a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1z" />
</svg>
);
}import { BsLayoutSidebarInset } from "react-icons/bs";
export function Example() {
return <BsLayoutSidebarInset className="size-5" />;
}<svg
viewBox="0 0 16 16"
stroke="currentColor"
fill="currentColor"
stroke-width="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M14 2a1 1 0 0 1 1 1v10a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1zM2 1a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2z"
/>
<path d="M3 4a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1z" />
</svg>"Layout Sidebar Inset" icon from Bootstrap Icons (https://github.com/twbs/icons), licensed under MIT license.Related icons: grid, apps, dashboard, tiles
- layout sidebar
- layout sidebar inset reverse
- layout sidebar reverse
- layout split
- layout text sidebar
- layout text sidebar reverse
- layout text window
- layout text window reverse
- layout three columns
- layout wtf
- reverse layout sidebar inset reverse
- reverse layout sidebar reverse
- reverse layout text sidebar reverse
- reverse layout text window reverse
- window sidebar
- fill grid fill
- grid
- grid fill
- ui checks grid
- ui radios grid
- align start
- fill house add fill
- fill house check fill
- fill house dash fill
Similar Bootstrap Icons icons
- keyboard fill
- ladder
- lamp
- lamp fill
- laptop
- laptop fill
- layer backward
- layer forward
- layers
- layers fill
- layers half
- layout sidebar
- layout sidebar inset reverse
- layout sidebar reverse
- layout split
- layout text sidebar
- layout text sidebar reverse
- layout text window
- layout text window reverse
- layout three columns
- layout wtf
- leaf
- leaf fill
- life preserver