Skip to content
Cuelark UI

Hover the icon or press Play. Suggested motion: pop. Pick another to preview it and update the animated code:

Circum Icons · CiBacon

Bacon icon

A free bacon icon from Circum 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
MPL-2.0 license
Project
circumicons.com
Install with shadcn
npx shadcn@latest add https://ui.cuelark.com/r/icons/circum/bacon.json
components/icons/circum-bacon.tsx
import * as React from "react";

/**
 * Bacon from Circum Icons (https://circumicons.com/), MPL-2.0 license.
 * Via Cuelark UI: ui.cuelark.com/icons/circum/bacon. Sized in em, colored by currentColor.
 */
export function CiBaconIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      viewBox="0 0 24 24"
      stroke="currentColor"
      fill="currentColor"
      strokeWidth="0"
      width="1em"
      height="1em"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <g id="Bacon">
        <path
          d="M20.605,7.455l-3.49-3.49a.8.8,0,0,0-1.08-.04,1.833,1.833,0,0,1-.93.37,3.787,3.787,0,0,0-2.21,1.12,3.918,3.918,0,0,0-1.13,2.22,1.681,1.681,0,0,1-.53,1.1,1.753,1.753,0,0,1-1.1.53,4.026,4.026,0,0,0-3.35,3.35,1.677,1.677,0,0,1-.53,1.1,1.721,1.721,0,0,1-1.11.53,4.041,4.041,0,0,0-1.62.63,1.1,1.1,0,0,0-.14,1.66l3.5,3.5a.781.781,0,0,0,.55.23.822.822,0,0,0,.53-.19,1.759,1.759,0,0,1,.93-.38,3.8,3.8,0,0,0,2.21-1.12,3.948,3.948,0,0,0,1.14-2.22,1.71,1.71,0,0,1,.52-1.1,1.776,1.776,0,0,1,1.11-.53,4.03,4.03,0,0,0,3.34-3.35,1.66,1.66,0,0,1,.53-1.1,1.721,1.721,0,0,1,1.11-.53,4.018,4.018,0,0,0,1.61-.62,1.091,1.091,0,0,0,.14-1.67ZM4.1,15.7a3.15,3.15,0,0,1,1.24-.47,2.635,2.635,0,0,0,1.63-.81,2.587,2.587,0,0,0,.8-1.61,2.852,2.852,0,0,1,.86-1.7,2.9,2.9,0,0,1,1.7-.86,2.745,2.745,0,0,0,1.62-.8,2.687,2.687,0,0,0,.8-1.62,2.9,2.9,0,0,1,.86-1.7,2.814,2.814,0,0,1,1.69-.85,2.819,2.819,0,0,0,1.24-.48l1.3,1.3a2.362,2.362,0,0,1-.98.35,3.515,3.515,0,0,0-2.95,2.95,2.136,2.136,0,0,1-.67,1.36,2.159,2.159,0,0,1-1.36.67,3.44,3.44,0,0,0-1.96.99,3.351,3.351,0,0,0-.98,1.96,2.355,2.355,0,0,1-2.03,2.03,3.242,3.242,0,0,0-1.58.66L4.1,15.835ZM19.9,8.3a3.059,3.059,0,0,1-1.23.47,2.659,2.659,0,0,0-1.63.81,2.587,2.587,0,0,0-.8,1.61,2.852,2.852,0,0,1-.86,1.7,2.883,2.883,0,0,1-1.69.86,2.812,2.812,0,0,0-2.43,2.42,2.878,2.878,0,0,1-.86,1.7,2.8,2.8,0,0,1-1.68.85,2.808,2.808,0,0,0-1.25.48l-1.3-1.29a2.423,2.423,0,0,1,.97-.35,3.377,3.377,0,0,0,1.96-.99,3.44,3.44,0,0,0,.99-1.96,2.217,2.217,0,0,1,.66-1.36,2.292,2.292,0,0,1,1.36-.67,3.317,3.317,0,0,0,1.96-.99,3.351,3.351,0,0,0,.99-1.96,2.355,2.355,0,0,1,2.03-2.03,3.479,3.479,0,0,0,1.59-.66l1.23,1.23Z"
        />
      </g>
    </svg>
  );
}
With react-icons
import { CiBacon } from "react-icons/ci";

export function Example() {
  return <CiBacon className="size-5" />;
}
bacon.svg
<svg
  viewBox="0 0 24 24"
  stroke="currentColor"
  fill="currentColor"
  stroke-width="0"
  width="1em"
  height="1em"
  xmlns="http://www.w3.org/2000/svg"
>
  <g id="Bacon">
    <path
      d="M20.605,7.455l-3.49-3.49a.8.8,0,0,0-1.08-.04,1.833,1.833,0,0,1-.93.37,3.787,3.787,0,0,0-2.21,1.12,3.918,3.918,0,0,0-1.13,2.22,1.681,1.681,0,0,1-.53,1.1,1.753,1.753,0,0,1-1.1.53,4.026,4.026,0,0,0-3.35,3.35,1.677,1.677,0,0,1-.53,1.1,1.721,1.721,0,0,1-1.11.53,4.041,4.041,0,0,0-1.62.63,1.1,1.1,0,0,0-.14,1.66l3.5,3.5a.781.781,0,0,0,.55.23.822.822,0,0,0,.53-.19,1.759,1.759,0,0,1,.93-.38,3.8,3.8,0,0,0,2.21-1.12,3.948,3.948,0,0,0,1.14-2.22,1.71,1.71,0,0,1,.52-1.1,1.776,1.776,0,0,1,1.11-.53,4.03,4.03,0,0,0,3.34-3.35,1.66,1.66,0,0,1,.53-1.1,1.721,1.721,0,0,1,1.11-.53,4.018,4.018,0,0,0,1.61-.62,1.091,1.091,0,0,0,.14-1.67ZM4.1,15.7a3.15,3.15,0,0,1,1.24-.47,2.635,2.635,0,0,0,1.63-.81,2.587,2.587,0,0,0,.8-1.61,2.852,2.852,0,0,1,.86-1.7,2.9,2.9,0,0,1,1.7-.86,2.745,2.745,0,0,0,1.62-.8,2.687,2.687,0,0,0,.8-1.62,2.9,2.9,0,0,1,.86-1.7,2.814,2.814,0,0,1,1.69-.85,2.819,2.819,0,0,0,1.24-.48l1.3,1.3a2.362,2.362,0,0,1-.98.35,3.515,3.515,0,0,0-2.95,2.95,2.136,2.136,0,0,1-.67,1.36,2.159,2.159,0,0,1-1.36.67,3.44,3.44,0,0,0-1.96.99,3.351,3.351,0,0,0-.98,1.96,2.355,2.355,0,0,1-2.03,2.03,3.242,3.242,0,0,0-1.58.66L4.1,15.835ZM19.9,8.3a3.059,3.059,0,0,1-1.23.47,2.659,2.659,0,0,0-1.63.81,2.587,2.587,0,0,0-.8,1.61,2.852,2.852,0,0,1-.86,1.7,2.883,2.883,0,0,1-1.69.86,2.812,2.812,0,0,0-2.43,2.42,2.878,2.878,0,0,1-.86,1.7,2.8,2.8,0,0,1-1.68.85,2.808,2.808,0,0,0-1.25.48l-1.3-1.29a2.423,2.423,0,0,1,.97-.35,3.377,3.377,0,0,0,1.96-.99,3.44,3.44,0,0,0,.99-1.96,2.217,2.217,0,0,1,.66-1.36,2.292,2.292,0,0,1,1.36-.67,3.317,3.317,0,0,0,1.96-.99,3.351,3.351,0,0,0,.99-1.96,2.355,2.355,0,0,1,2.03-2.03,3.479,3.479,0,0,0,1.59-.66l1.23,1.23Z"
    />
  </g>
</svg>
Attribution
"Bacon" icon from Circum Icons (https://circumicons.com/), licensed under MPL-2.0 license.

Bacon icon in other sets