Skip to content
Cuelark UI

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

Radix Icons · RxUnderline

Underline icon

A free underline 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
Download SVG
Install with shadcn
npx shadcn@latest add https://ui.cuelark.com/r/icons/radix/underline.json
components/icons/radix-underline.tsx
import * as React from "react";

/**
 * Underline from Radix Icons (https://icons.radix-ui.com), MIT.
 * Via Cuelark UI: ui.cuelark.com/icons/radix/underline. Sized in em, colored by currentColor.
 */
export function RxUnderlineIcon(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="M11.5814 13.1084C11.7633 13.146 11.9007 13.307 11.9008 13.5C11.9008 13.693 11.7633 13.854 11.5814 13.8916L11.5004 13.9004H3.50037C3.27945 13.9004 3.09998 13.7209 3.09998 13.5C3.10001 13.2791 3.27947 13.0996 3.50037 13.0996H11.5004L11.5814 13.1084ZM10.5004 2.25C10.7763 2.25019 11.0004 2.47398 11.0004 2.75V8.0498C11.0004 9.98268 9.4332 11.5496 7.50037 11.5498C5.56737 11.5498 4.00037 9.9828 4.00037 8.0498V2.75C4.00037 2.47386 4.22422 2.25 4.50037 2.25C4.77635 2.25019 5.00037 2.47398 5.00037 2.75V8.0498C5.00037 9.43052 6.11965 10.5498 7.50037 10.5498C8.88092 10.5496 10.0004 9.4304 10.0004 8.0498V2.75C10.0004 2.47386 10.2242 2.25 10.5004 2.25Z"
        fill="currentColor"
      />
    </svg>
  );
}
With react-icons
import { RxUnderline } from "react-icons/rx";

export function Example() {
  return <RxUnderline className="size-5" />;
}
underline.svg
<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="M11.5814 13.1084C11.7633 13.146 11.9007 13.307 11.9008 13.5C11.9008 13.693 11.7633 13.854 11.5814 13.8916L11.5004 13.9004H3.50037C3.27945 13.9004 3.09998 13.7209 3.09998 13.5C3.10001 13.2791 3.27947 13.0996 3.50037 13.0996H11.5004L11.5814 13.1084ZM10.5004 2.25C10.7763 2.25019 11.0004 2.47398 11.0004 2.75V8.0498C11.0004 9.98268 9.4332 11.5496 7.50037 11.5498C5.56737 11.5498 4.00037 9.9828 4.00037 8.0498V2.75C4.00037 2.47386 4.22422 2.25 4.50037 2.25C4.77635 2.25019 5.00037 2.47398 5.00037 2.75V8.0498C5.00037 9.43052 6.11965 10.5498 7.50037 10.5498C8.88092 10.5496 10.0004 9.4304 10.0004 8.0498V2.75C10.0004 2.47386 10.2242 2.25 10.5004 2.25Z"
    fill="currentColor"
  />
</svg>
Attribution
"Underline" icon from Radix Icons (https://icons.radix-ui.com), licensed under MIT license.

Underline icon in other sets