import React from "react";

const WebGPULogo = (props: React.SVGProps<SVGSVGElement>) => (
  <svg
    {...props}
    xmlns="http://www.w3.org/2000/svg"
    width="768"
    height="600"
    viewBox="0 0 768 600"
    fill="currentColor"
  >
    <defs>
      <style>
        {`.cls-1, .cls-2, .cls-3, .cls-4, .cls-5 {
          fill-rule: evenodd;
          stroke-linejoin: round;
        }
        .cls-1 {
          fill: #005a9c;
          stroke: #005a9c;
        }
        .cls-2 {
          fill: #0066b0;
          stroke: #0066b0;
        }
        .cls-3 {
          fill: #0076cc;
          stroke: #0076cc;
        }
        .cls-4 {
          fill: #0086e8;
          stroke: #0086e8;
        }
        .cls-5 {
          fill: #0093ff;
          stroke: #0093ff;
        }`}
      </style>
    </defs>
    <path className="cls-4" d="m626.63 295.5-60.189-104.25h120.55z" />
    <path className="cls-5" d="m626.63 87.001-60.189 104.25h120.55z" />
    <path className="cls-3" d="m506.26 504-120.38-208.5 240.76-2e-3z" />
    <path className="cls-2" d="m506.26 87-120.38 208.5 240.76-2e-3z" />
    <path className="cls-1" d="m265.5 504-240.76-417h481.51z" />
  </svg>
);

export default WebGPULogo;