Skip to content
Cuelark UI

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

Remix Icon · RiCookieFill

Cookie Fill icon

A free cookie fill icon from Remix Icon, 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
Apache License Version 2.0
Project
github.com
Download SVG
Install with shadcn
npx shadcn@latest add https://ui.cuelark.com/r/icons/remix/cookie-fill.json
components/icons/remix-cookie-fill.tsx
import * as React from "react";

/**
 * Cookie Fill from Remix Icon (https://github.com/Remix-Design/RemixIcon), Apache License Version 2.0.
 * Via Cuelark UI: ui.cuelark.com/icons/remix/cookie-fill. Sized in em, colored by currentColor.
 */
export function RiCookieFillIcon(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}
    >
      <path
        d="M4.9289 4.92906C7.03698 2.821 9.85202 1.85005 12.6108 2.01773C12.991 2.04083 13.1781 2.48567 13.0274 2.83549C12.477 4.11347 12.7239 5.65279 13.7678 6.69663C14.3308 7.2596 15.0378 7.58976 15.7702 7.68859C16.048 7.72607 16.2735 7.95158 16.311 8.22934C16.4098 8.96176 16.74 9.66875 17.3029 10.2318C18.3468 11.2756 19.8855 11.5218 21.1633 10.9712C21.513 10.8205 21.9578 11.0074 21.981 11.3876C22.1492 14.1468 21.1789 16.9622 19.0705 19.0706C15.1653 22.9759 8.83414 22.9759 4.9289 19.0706C1.02372 15.1654 1.02368 8.83427 4.9289 4.92906ZM9.87812 14.1214C9.29233 13.5357 8.34279 13.5357 7.75703 14.1214C7.17156 14.7072 7.17141 15.6568 7.75703 16.2425C8.34271 16.8282 9.29231 16.828 9.87812 16.2425C10.4639 15.6567 10.4639 14.7072 9.87812 14.1214ZM15.8889 13.7679C15.3031 13.1822 14.3536 13.1823 13.7678 13.7679C13.182 14.3537 13.182 15.3032 13.7678 15.889C14.3536 16.4747 15.3031 16.4748 15.8889 15.889C16.4744 15.3032 16.4745 14.3536 15.8889 13.7679ZM10.2316 8.11069C9.64586 7.52512 8.69627 7.52504 8.11054 8.11069C7.52482 8.69642 7.52494 9.64598 8.11054 10.2318C8.69633 10.8176 9.64585 10.8176 10.2316 10.2318C10.8174 9.64599 10.8174 8.69646 10.2316 8.11069Z"
      />
    </svg>
  );
}
With react-icons
import { RiCookieFill } from "react-icons/ri";

export function Example() {
  return <RiCookieFill className="size-5" />;
}
cookie-fill.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"
>
  <path
    d="M4.9289 4.92906C7.03698 2.821 9.85202 1.85005 12.6108 2.01773C12.991 2.04083 13.1781 2.48567 13.0274 2.83549C12.477 4.11347 12.7239 5.65279 13.7678 6.69663C14.3308 7.2596 15.0378 7.58976 15.7702 7.68859C16.048 7.72607 16.2735 7.95158 16.311 8.22934C16.4098 8.96176 16.74 9.66875 17.3029 10.2318C18.3468 11.2756 19.8855 11.5218 21.1633 10.9712C21.513 10.8205 21.9578 11.0074 21.981 11.3876C22.1492 14.1468 21.1789 16.9622 19.0705 19.0706C15.1653 22.9759 8.83414 22.9759 4.9289 19.0706C1.02372 15.1654 1.02368 8.83427 4.9289 4.92906ZM9.87812 14.1214C9.29233 13.5357 8.34279 13.5357 7.75703 14.1214C7.17156 14.7072 7.17141 15.6568 7.75703 16.2425C8.34271 16.8282 9.29231 16.828 9.87812 16.2425C10.4639 15.6567 10.4639 14.7072 9.87812 14.1214ZM15.8889 13.7679C15.3031 13.1822 14.3536 13.1823 13.7678 13.7679C13.182 14.3537 13.182 15.3032 13.7678 15.889C14.3536 16.4747 15.3031 16.4748 15.8889 15.889C16.4744 15.3032 16.4745 14.3536 15.8889 13.7679ZM10.2316 8.11069C9.64586 7.52512 8.69627 7.52504 8.11054 8.11069C7.52482 8.69642 7.52494 9.64598 8.11054 10.2318C8.69633 10.8176 9.64585 10.8176 10.2316 10.2318C10.8174 9.64599 10.8174 8.69646 10.2316 8.11069Z"
  />
</svg>
Attribution
"Cookie Fill" icon from Remix Icon (https://github.com/Remix-Design/RemixIcon), licensed under Apache License Version 2.0.

Related icons:

Cookie Fill icon in other sets