Hover the icon or press Play. Suggested motion: pop. Pick another to preview it and update the animated code:
Notion Logo icon
A free notion logo icon from Radix 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
- icons.radix-ui.com
npx shadcn@latest add https://ui.cuelark.com/r/icons/radix/notion-logo.jsonimport * as React from "react";
/**
* Notion Logo from Radix Icons (https://icons.radix-ui.com), MIT.
* Via Cuelark UI: ui.cuelark.com/icons/radix/notion-logo. Sized in em, colored by currentColor.
*/
export function RxNotionLogoIcon(props: React.SVGProps<SVGSVGElement>) {
return (
<svg
aria-hidden="true"
fill="none"
viewBox="0 0 15 15"
stroke="currentColor"
fill="currentColor"
strokeWidth="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<path
d="M9.32544 0.781257C10.2448 0.702402 10.482 0.755043 11.0598 1.17481L13.4495 2.8545C13.8434 3.14304 13.9747 3.22173 13.9749 3.53614V12.749C13.9749 13.3264 13.7648 13.6684 13.0295 13.7207L4.33521 14.2451C3.7832 14.2715 3.5198 14.1929 3.23071 13.8252L1.47095 11.542C1.15567 11.1218 1.02471 10.8073 1.02466 10.4395V2.25001C1.02478 1.77803 1.23559 1.38431 1.83911 1.33204L9.32544 0.781257ZM4.12427 4.32423C3.80923 4.3507 3.70435 4.50848 3.70435 4.84962V12.6699C3.70435 13.0903 3.91419 13.2477 4.38696 13.2217L12.5559 12.749C13.0289 12.723 13.0823 12.4342 13.0823 12.0928V4.32423C13.0823 3.98339 12.9508 3.79905 12.6614 3.8252L4.12427 4.32423ZM11.7688 5.26856C11.8212 5.50502 11.7684 5.74101 11.5315 5.76758L11.1379 5.84669V11.6201C10.7963 11.8037 10.4815 11.9091 10.219 11.9092C9.79864 11.9092 9.69295 11.7781 9.37817 11.3848L6.80298 7.34278V11.2529L7.61841 11.4375C7.61819 11.4543 7.60603 11.909 6.96118 11.9092L5.14868 12.0147C5.09607 11.9096 5.14878 11.6475 5.33228 11.5947L5.80591 11.4629V6.29298L5.14868 6.24024C5.09606 6.00389 5.2273 5.66344 5.59497 5.63673L7.53931 5.50489L10.219 9.59962V5.97755L9.5354 5.89942C9.48299 5.61051 9.69281 5.40024 9.95532 5.37403L11.7688 5.26856ZM9.64087 1.51563L2.44263 2.04102C2.18055 2.06716 2.12818 2.19857 2.23267 2.30372L3.25806 3.11719C3.67766 3.45799 3.83535 3.43148 4.62329 3.37891L12.0569 2.93262C12.214 2.93262 12.0844 2.77691 12.0315 2.75001L10.7961 1.85743C10.5596 1.67381 10.2448 1.46305 9.64087 1.51563Z"
fill="currentColor"
/>
</svg>
);
}import { RxNotionLogo } from "react-icons/rx";
export function Example() {
return <RxNotionLogo className="size-5" />;
}<svg
fill="none"
viewBox="0 0 15 15"
stroke="currentColor"
fill="currentColor"
stroke-width="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M9.32544 0.781257C10.2448 0.702402 10.482 0.755043 11.0598 1.17481L13.4495 2.8545C13.8434 3.14304 13.9747 3.22173 13.9749 3.53614V12.749C13.9749 13.3264 13.7648 13.6684 13.0295 13.7207L4.33521 14.2451C3.7832 14.2715 3.5198 14.1929 3.23071 13.8252L1.47095 11.542C1.15567 11.1218 1.02471 10.8073 1.02466 10.4395V2.25001C1.02478 1.77803 1.23559 1.38431 1.83911 1.33204L9.32544 0.781257ZM4.12427 4.32423C3.80923 4.3507 3.70435 4.50848 3.70435 4.84962V12.6699C3.70435 13.0903 3.91419 13.2477 4.38696 13.2217L12.5559 12.749C13.0289 12.723 13.0823 12.4342 13.0823 12.0928V4.32423C13.0823 3.98339 12.9508 3.79905 12.6614 3.8252L4.12427 4.32423ZM11.7688 5.26856C11.8212 5.50502 11.7684 5.74101 11.5315 5.76758L11.1379 5.84669V11.6201C10.7963 11.8037 10.4815 11.9091 10.219 11.9092C9.79864 11.9092 9.69295 11.7781 9.37817 11.3848L6.80298 7.34278V11.2529L7.61841 11.4375C7.61819 11.4543 7.60603 11.909 6.96118 11.9092L5.14868 12.0147C5.09607 11.9096 5.14878 11.6475 5.33228 11.5947L5.80591 11.4629V6.29298L5.14868 6.24024C5.09606 6.00389 5.2273 5.66344 5.59497 5.63673L7.53931 5.50489L10.219 9.59962V5.97755L9.5354 5.89942C9.48299 5.61051 9.69281 5.40024 9.95532 5.37403L11.7688 5.26856ZM9.64087 1.51563L2.44263 2.04102C2.18055 2.06716 2.12818 2.19857 2.23267 2.30372L3.25806 3.11719C3.67766 3.45799 3.83535 3.43148 4.62329 3.37891L12.0569 2.93262C12.214 2.93262 12.0844 2.77691 12.0315 2.75001L10.7961 1.85743C10.5596 1.67381 10.2448 1.46305 9.64087 1.51563Z"
fill="currentColor"
/>
</svg>"Notion Logo" icon from Radix Icons (https://icons.radix-ui.com), licensed under MIT license.