Hover the icon or press Play. Suggested motion: pop. Pick another to preview it and update the animated code:
Font Size icon
A free font size 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/font-size.jsonimport * as React from "react";
/**
* Font Size from Radix Icons (https://icons.radix-ui.com), MIT.
* Via Cuelark UI: ui.cuelark.com/icons/radix/font-size. Sized in em, colored by currentColor.
*/
export function RxFontSizeIcon(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="M2.49984 2.09991C2.6058 2.10001 2.70812 2.14217 2.78305 2.2171L4.78305 4.2171L4.83383 4.28058C4.93587 4.43578 4.91954 4.64701 4.78305 4.78351C4.64655 4.92 4.43531 4.93633 4.28012 4.83429L4.21664 4.78351L2.90023 3.4671V11.5335L4.21664 10.2171C4.37285 10.0609 4.62684 10.0609 4.78305 10.2171C4.93888 10.3733 4.93913 10.6274 4.78305 10.7835L2.78305 12.7835C2.70812 12.8584 2.60579 12.9006 2.49984 12.9007C2.39393 12.9007 2.29162 12.8583 2.21664 12.7835L0.21664 10.7835L0.165858 10.72C0.0634971 10.5648 0.0800246 10.3537 0.21664 10.2171C0.353264 10.0805 0.564328 10.064 0.719569 10.1663L0.783046 10.2171L2.09945 11.5335V3.4671L0.783046 4.78351C0.626961 4.93958 0.372878 4.93934 0.21664 4.78351C0.0604332 4.6273 0.0604398 4.37331 0.21664 4.2171L2.21664 2.2171L2.27816 2.1673C2.34333 2.12394 2.42042 2.09991 2.49984 2.09991ZM7.97055 11.7396C7.87676 11.9991 7.58955 12.1339 7.32992 12.0403C7.07066 11.9466 6.93609 11.6601 7.02914 11.4007L7.97055 11.7396ZM10.4998 2.75031C10.7105 2.75031 10.899 2.88226 10.9705 3.08038L13.9705 11.4007C14.0636 11.6602 13.9291 11.9467 13.6698 12.0403C13.4102 12.1338 13.1229 11.9991 13.0291 11.7396L12.0467 9.01593H8.95297L7.97055 11.7396L7.49984 11.5696L7.02914 11.4007L10.0291 3.08038L10.0614 3.00909C10.1482 2.85119 10.3156 2.75035 10.4998 2.75031ZM9.25863 8.16632H11.7411L10.4998 4.72491L9.25863 8.16632Z"
fill="currentColor"
/>
</svg>
);
}import { RxFontSize } from "react-icons/rx";
export function Example() {
return <RxFontSize 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="M2.49984 2.09991C2.6058 2.10001 2.70812 2.14217 2.78305 2.2171L4.78305 4.2171L4.83383 4.28058C4.93587 4.43578 4.91954 4.64701 4.78305 4.78351C4.64655 4.92 4.43531 4.93633 4.28012 4.83429L4.21664 4.78351L2.90023 3.4671V11.5335L4.21664 10.2171C4.37285 10.0609 4.62684 10.0609 4.78305 10.2171C4.93888 10.3733 4.93913 10.6274 4.78305 10.7835L2.78305 12.7835C2.70812 12.8584 2.60579 12.9006 2.49984 12.9007C2.39393 12.9007 2.29162 12.8583 2.21664 12.7835L0.21664 10.7835L0.165858 10.72C0.0634971 10.5648 0.0800246 10.3537 0.21664 10.2171C0.353264 10.0805 0.564328 10.064 0.719569 10.1663L0.783046 10.2171L2.09945 11.5335V3.4671L0.783046 4.78351C0.626961 4.93958 0.372878 4.93934 0.21664 4.78351C0.0604332 4.6273 0.0604398 4.37331 0.21664 4.2171L2.21664 2.2171L2.27816 2.1673C2.34333 2.12394 2.42042 2.09991 2.49984 2.09991ZM7.97055 11.7396C7.87676 11.9991 7.58955 12.1339 7.32992 12.0403C7.07066 11.9466 6.93609 11.6601 7.02914 11.4007L7.97055 11.7396ZM10.4998 2.75031C10.7105 2.75031 10.899 2.88226 10.9705 3.08038L13.9705 11.4007C14.0636 11.6602 13.9291 11.9467 13.6698 12.0403C13.4102 12.1338 13.1229 11.9991 13.0291 11.7396L12.0467 9.01593H8.95297L7.97055 11.7396L7.49984 11.5696L7.02914 11.4007L10.0291 3.08038L10.0614 3.00909C10.1482 2.85119 10.3156 2.75035 10.4998 2.75031ZM9.25863 8.16632H11.7411L10.4998 4.72491L9.25863 8.16632Z"
fill="currentColor"
/>
</svg>"Font Size" icon from Radix Icons (https://icons.radix-ui.com), licensed under MIT license.