Hover the icon or press Play. Suggested motion: pop. Pick another to preview it and update the animated code:
Letter Spacing icon
A free letter spacing 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/letter-spacing.jsonimport * as React from "react";
/**
* Letter Spacing from Radix Icons (https://icons.radix-ui.com), MIT.
* Via Cuelark UI: ui.cuelark.com/icons/radix/letter-spacing. Sized in em, colored by currentColor.
*/
export function RxLetterSpacingIcon(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="M12.2709 10.2168C12.4271 10.0607 12.6811 10.0606 12.8373 10.2168L14.8373 12.2168L14.8871 12.2783C14.9304 12.3434 14.9545 12.4206 14.9545 12.5C14.9545 12.606 14.9122 12.7082 14.8373 12.7832L12.8373 14.7832L12.7738 14.8339C12.6186 14.9363 12.4075 14.9196 12.2709 14.7832C12.1342 14.6465 12.1177 14.4355 12.2201 14.2802L12.2709 14.2168L13.5873 12.9004H1.52087L2.83728 14.2168C2.99321 14.3729 2.99325 14.627 2.83728 14.7832C2.68115 14.9393 2.4271 14.9392 2.27087 14.7832L0.270874 12.7832C0.195874 12.7082 0.153703 12.606 0.153687 12.5C0.153687 12.3939 0.19586 12.2918 0.270874 12.2168L2.27087 10.2168L2.33435 10.166C2.48957 10.0638 2.70073 10.0802 2.83728 10.2168C2.97366 10.3534 2.99027 10.5645 2.88806 10.7197L2.83728 10.7832L1.52087 12.0996H13.5873L12.2709 10.7832C12.1147 10.627 12.1147 10.373 12.2709 10.2168ZM13.389 1.22653C13.5158 1.03205 13.766 0.946105 13.9906 1.03414C14.2153 1.12246 14.3399 1.35597 14.3002 1.58493L14.2728 1.68258L11.5209 8.68453C11.4457 8.87576 11.2615 9.00185 11.056 9.00192C10.8761 9.00181 10.7118 8.90531 10.6234 8.75289L10.5902 8.68453L7.83826 1.68258C7.73772 1.42579 7.86478 1.13514 8.12146 1.03414C8.37828 0.933439 8.66884 1.06065 8.7699 1.31735L11.0551 7.13571L13.3422 1.31735L13.389 1.22653ZM4.5531 0.999964C4.75278 1.00015 4.93326 1.11923 5.01208 1.3027L8.01111 8.29977L8.04138 8.39645C8.08822 8.6241 7.97026 8.86075 7.74841 8.95602C7.52641 9.05102 7.27356 8.97313 7.14099 8.78219L7.09119 8.69332L6.1156 6.41696H2.98962L2.01404 8.69332L1.96423 8.78219C1.83159 8.97309 1.57882 9.05116 1.35681 8.95602C1.1035 8.84706 0.985587 8.55333 1.09412 8.29977L4.09314 1.3027L4.12732 1.23727C4.21739 1.09137 4.3782 1.00007 4.5531 0.999964ZM3.35291 5.56735H5.75134L4.55212 2.76852L3.35291 5.56735Z"
fill="currentColor"
/>
</svg>
);
}import { RxLetterSpacing } from "react-icons/rx";
export function Example() {
return <RxLetterSpacing 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="M12.2709 10.2168C12.4271 10.0607 12.6811 10.0606 12.8373 10.2168L14.8373 12.2168L14.8871 12.2783C14.9304 12.3434 14.9545 12.4206 14.9545 12.5C14.9545 12.606 14.9122 12.7082 14.8373 12.7832L12.8373 14.7832L12.7738 14.8339C12.6186 14.9363 12.4075 14.9196 12.2709 14.7832C12.1342 14.6465 12.1177 14.4355 12.2201 14.2802L12.2709 14.2168L13.5873 12.9004H1.52087L2.83728 14.2168C2.99321 14.3729 2.99325 14.627 2.83728 14.7832C2.68115 14.9393 2.4271 14.9392 2.27087 14.7832L0.270874 12.7832C0.195874 12.7082 0.153703 12.606 0.153687 12.5C0.153687 12.3939 0.19586 12.2918 0.270874 12.2168L2.27087 10.2168L2.33435 10.166C2.48957 10.0638 2.70073 10.0802 2.83728 10.2168C2.97366 10.3534 2.99027 10.5645 2.88806 10.7197L2.83728 10.7832L1.52087 12.0996H13.5873L12.2709 10.7832C12.1147 10.627 12.1147 10.373 12.2709 10.2168ZM13.389 1.22653C13.5158 1.03205 13.766 0.946105 13.9906 1.03414C14.2153 1.12246 14.3399 1.35597 14.3002 1.58493L14.2728 1.68258L11.5209 8.68453C11.4457 8.87576 11.2615 9.00185 11.056 9.00192C10.8761 9.00181 10.7118 8.90531 10.6234 8.75289L10.5902 8.68453L7.83826 1.68258C7.73772 1.42579 7.86478 1.13514 8.12146 1.03414C8.37828 0.933439 8.66884 1.06065 8.7699 1.31735L11.0551 7.13571L13.3422 1.31735L13.389 1.22653ZM4.5531 0.999964C4.75278 1.00015 4.93326 1.11923 5.01208 1.3027L8.01111 8.29977L8.04138 8.39645C8.08822 8.6241 7.97026 8.86075 7.74841 8.95602C7.52641 9.05102 7.27356 8.97313 7.14099 8.78219L7.09119 8.69332L6.1156 6.41696H2.98962L2.01404 8.69332L1.96423 8.78219C1.83159 8.97309 1.57882 9.05116 1.35681 8.95602C1.1035 8.84706 0.985587 8.55333 1.09412 8.29977L4.09314 1.3027L4.12732 1.23727C4.21739 1.09137 4.3782 1.00007 4.5531 0.999964ZM3.35291 5.56735H5.75134L4.55212 2.76852L3.35291 5.56735Z"
fill="currentColor"
/>
</svg>"Letter Spacing" icon from Radix Icons (https://icons.radix-ui.com), licensed under MIT license.