Skip to content
Cuelark UI

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

css.gg · CgArrowsExpandUpLeft

Arrows Expand Up Left icon

A free arrows expand up left icon from css.gg, 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.

Also known aschevron iconcaret iconangle iconarrow iconcollapse icontrending icongrowth iconincrease icon
License
MIT license
Project
github.com
Download SVG
Install with shadcn
npx shadcn@latest add https://ui.cuelark.com/r/icons/css-gg/arrows-expand-up-left.json
components/icons/css-gg-arrows-expand-up-left.tsx
import * as React from "react";

/**
 * Arrows Expand Up Left from css.gg (https://github.com/astrit/css.gg), MIT.
 * Via Cuelark UI: ui.cuelark.com/icons/css-gg/arrows-expand-up-left. Sized in em, colored by currentColor.
 */
export function CgArrowsExpandUpLeftIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      fill="none"
      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="M5 11H3L3 3L11 3V5L6.41419 5L11.7781 10.3639C12.1686 10.7545 12.1686 11.3876 11.7781 11.7782C11.3876 12.1687 10.7544 12.1687 10.3639 11.7782L5 6.41424L5 11Z"
        fill="currentColor"
      />
      <path
        fillRule="evenodd"
        clipRule="evenodd"
        d="M19 13C20.1046 13 21 13.8954 21 15V19C21 20.1046 20.1046 21 19 21H15C13.8954 21 13 20.1046 13 19V15C13 13.8954 13.8954 13 15 13H19ZM19 15V19H15V15H19Z"
        fill="currentColor"
      />
    </svg>
  );
}
With react-icons
import { CgArrowsExpandUpLeft } from "react-icons/cg";

export function Example() {
  return <CgArrowsExpandUpLeft className="size-5" />;
}
arrows-expand-up-left.svg
<svg
  fill="none"
  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="M5 11H3L3 3L11 3V5L6.41419 5L11.7781 10.3639C12.1686 10.7545 12.1686 11.3876 11.7781 11.7782C11.3876 12.1687 10.7544 12.1687 10.3639 11.7782L5 6.41424L5 11Z"
    fill="currentColor"
  />
  <path
    fill-rule="evenodd"
    clip-rule="evenodd"
    d="M19 13C20.1046 13 21 13.8954 21 15V19C21 20.1046 20.1046 21 19 21H15C13.8954 21 13 20.1046 13 19V15C13 13.8954 13.8954 13 15 13H19ZM19 15V19H15V15H19Z"
    fill="currentColor"
  />
</svg>
Attribution
"Arrows Expand Up Left" icon from css.gg (https://github.com/astrit/css.gg), licensed under MIT license.

Related icons: chevron, caret, angle, arrow