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

Ant Design Icons · AiTwotoneWarning

Twotone Warning icon

A free twotone warning icon from Ant Design 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.

Also known asalert icon caution icon error icon danger icon exclamation icon attention icon

License: MIT license
Project: github.com

Download SVG

Install with shadcn

npx shadcn@latest add https://ui.cuelark.com/r/icons/ant-design/twotone-warning.json

components/icons/ant-design-twotone-warning.tsx

import * as React from "react";

/**
 * Twotone Warning from Ant Design Icons (https://github.com/ant-design/ant-design-icons), MIT.
 * Via Cuelark UI: ui.cuelark.com/icons/ant-design/twotone-warning. Sized in em, colored by currentColor.
 */
export function AiTwotoneWarningIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      viewBox="0 0 1024 1024"
      stroke="currentColor"
      fill="currentColor"
      strokeWidth="0"
      width="1em"
      height="1em"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        fill="#333"
        d="M955.7 856l-416-720c-6.2-10.7-16.9-16-27.7-16s-21.6 5.3-27.7 16l-416 720C56 877.4 71.4 904 96 904h832c24.6 0 40-26.6 27.7-48zm-783.5-27.9L512 239.9l339.8 588.2H172.2z"
      />
      <path
        fill="#E6E6E6"
        d="M172.2 828.1h679.6L512 239.9 172.2 828.1zM560 720a48.01 48.01 0 0 1-96 0 48.01 48.01 0 0 1 96 0zm-16-304v184c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V416c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8z"
      />
      <path
        fill="#333"
        d="M464 720a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm16-304v184c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V416c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8z"
      />
    </svg>
  );
}

With react-icons

import { AiTwotoneWarning } from "react-icons/ai";

export function Example() {
  return <AiTwotoneWarning className="size-5" />;
}

twotone-warning.svg

<svg
  viewBox="0 0 1024 1024"
  stroke="currentColor"
  fill="currentColor"
  stroke-width="0"
  width="1em"
  height="1em"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    fill="#333"
    d="M955.7 856l-416-720c-6.2-10.7-16.9-16-27.7-16s-21.6 5.3-27.7 16l-416 720C56 877.4 71.4 904 96 904h832c24.6 0 40-26.6 27.7-48zm-783.5-27.9L512 239.9l339.8 588.2H172.2z"
  />
  <path
    fill="#E6E6E6"
    d="M172.2 828.1h679.6L512 239.9 172.2 828.1zM560 720a48.01 48.01 0 0 1-96 0 48.01 48.01 0 0 1 96 0zm-16-304v184c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V416c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8z"
  />
  <path
    fill="#333"
    d="M464 720a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm16-304v184c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V416c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8z"
  />
</svg>

Attribution

"Twotone Warning" icon from Ant Design Icons (https://github.com/ant-design/ant-design-icons), licensed under MIT license.

Related icons: alert, caution, error, danger

Similar Ant Design Icons icons