gradio icon logo

gradio-icon from SVG Logos by Gil Barbara · Color · CC0-1.0 Free for personal and commercial use.

Name
gradio-icon
Set
SVG Logos
Style
Color
Viewbox
256×224
License
CC0

Use the gradio icon logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 224"><defs><linearGradient id="SVGssQ2Xbjz" x1="-6.452%" x2="85.236%" y1="49.784%" y2="49.784%"><stop offset="0%" stop-color="#f9d100"/><stop offset="100%" stop-color="#f97700"/></linearGradient><linearGradient id="SVGFlaRCblf" x1="106.079%" x2="14.268%" y1="49.784%" y2="49.784%"><stop offset="0%" stop-color="#f9d100"/><stop offset="100%" stop-color="#f97700"/></linearGradient><linearGradient id="SVGru2OOiqc" x1="-12.871%" x2="169.796%" y1="75.863%" y2="74.878%"><stop offset="0%" stop-color="#f9d100"/><stop offset="100%" stop-color="#f97700"/></linearGradient></defs><path fill="url(#SVGssQ2Xbjz)" d="M119.871 64.78a16.35 16.35 0 0 1 16.258 0l111.654 64c10.956 6.28 10.956 22.083 0 28.363l-111.654 64a16.35 16.35 0 0 1-16.258 0l-111.654-64c-10.956-6.28-10.956-22.083 0-28.364zm8.126 33.014l-78.783 45.164l78.783 45.155l78.784-45.155z"/><path fill="url(#SVGFlaRCblf)" d="M119.871 2.165a16.35 16.35 0 0 1 16.258 0l111.654 64c10.956 6.28 10.956 22.083 0 28.363l-111.654 64a16.35 16.35 0 0 1-16.258 0l-111.654-64c-10.956-6.28-10.956-22.083 0-28.363zm8.126 33.015L49.214 80.343l78.783 45.156l78.784-45.156z"/><path fill="url(#SVGru2OOiqc)" d="m120.19 64.755l16.174 28.412l-111.93 63.723l-16.175-28.412z"/></svg>

React

import type { SVGProps } from "react";

export function LogosGradioIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 224"><defs><linearGradient id="SVGssQ2Xbjz" x1="-6.452%" x2="85.236%" y1="49.784%" y2="49.784%"><stop offset="0%" stopColor="#f9d100"/><stop offset="100%" stopColor="#f97700"/></linearGradient><linearGradient id="SVGFlaRCblf" x1="106.079%" x2="14.268%" y1="49.784%" y2="49.784%"><stop offset="0%" stopColor="#f9d100"/><stop offset="100%" stopColor="#f97700"/></linearGradient><linearGradient id="SVGru2OOiqc" x1="-12.871%" x2="169.796%" y1="75.863%" y2="74.878%"><stop offset="0%" stopColor="#f9d100"/><stop offset="100%" stopColor="#f97700"/></linearGradient></defs><path fill="url(#SVGssQ2Xbjz)" d="M119.871 64.78a16.35 16.35 0 0 1 16.258 0l111.654 64c10.956 6.28 10.956 22.083 0 28.363l-111.654 64a16.35 16.35 0 0 1-16.258 0l-111.654-64c-10.956-6.28-10.956-22.083 0-28.364zm8.126 33.014l-78.783 45.164l78.783 45.155l78.784-45.155z"/><path fill="url(#SVGFlaRCblf)" d="M119.871 2.165a16.35 16.35 0 0 1 16.258 0l111.654 64c10.956 6.28 10.956 22.083 0 28.363l-111.654 64a16.35 16.35 0 0 1-16.258 0l-111.654-64c-10.956-6.28-10.956-22.083 0-28.363zm8.126 33.015L49.214 80.343l78.783 45.156l78.784-45.156z"/><path fill="url(#SVGru2OOiqc)" d="m120.19 64.755l16.174 28.412l-111.93 63.723l-16.175-28.412z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 224"><defs><linearGradient id="SVGssQ2Xbjz" x1="-6.452%" x2="85.236%" y1="49.784%" y2="49.784%"><stop offset="0%" stop-color="#f9d100"/><stop offset="100%" stop-color="#f97700"/></linearGradient><linearGradient id="SVGFlaRCblf" x1="106.079%" x2="14.268%" y1="49.784%" y2="49.784%"><stop offset="0%" stop-color="#f9d100"/><stop offset="100%" stop-color="#f97700"/></linearGradient><linearGradient id="SVGru2OOiqc" x1="-12.871%" x2="169.796%" y1="75.863%" y2="74.878%"><stop offset="0%" stop-color="#f9d100"/><stop offset="100%" stop-color="#f97700"/></linearGradient></defs><path fill="url(#SVGssQ2Xbjz)" d="M119.871 64.78a16.35 16.35 0 0 1 16.258 0l111.654 64c10.956 6.28 10.956 22.083 0 28.363l-111.654 64a16.35 16.35 0 0 1-16.258 0l-111.654-64c-10.956-6.28-10.956-22.083 0-28.364zm8.126 33.014l-78.783 45.164l78.783 45.155l78.784-45.155z"/><path fill="url(#SVGFlaRCblf)" d="M119.871 2.165a16.35 16.35 0 0 1 16.258 0l111.654 64c10.956 6.28 10.956 22.083 0 28.363l-111.654 64a16.35 16.35 0 0 1-16.258 0l-111.654-64c-10.956-6.28-10.956-22.083 0-28.363zm8.126 33.015L49.214 80.343l78.783 45.156l78.784-45.156z"/><path fill="url(#SVGru2OOiqc)" d="m120.19 64.755l16.174 28.412l-111.93 63.723l-16.175-28.412z"/></svg>
</template>

CSS

.icon-gradio-icon {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20256%20224%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGssQ2Xbjz%22%20x1%3D%22-6.452%25%22%20x2%3D%2285.236%25%22%20y1%3D%2249.784%25%22%20y2%3D%2249.784%25%22%3E%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23f9d100%22%2F%3E%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23f97700%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGFlaRCblf%22%20x1%3D%22106.079%25%22%20x2%3D%2214.268%25%22%20y1%3D%2249.784%25%22%20y2%3D%2249.784%25%22%3E%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23f9d100%22%2F%3E%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23f97700%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGru2OOiqc%22%20x1%3D%22-12.871%25%22%20x2%3D%22169.796%25%22%20y1%3D%2275.863%25%22%20y2%3D%2274.878%25%22%3E%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23f9d100%22%2F%3E%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23f97700%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22url(%23SVGssQ2Xbjz)%22%20d%3D%22M119.871%2064.78a16.35%2016.35%200%200%201%2016.258%200l111.654%2064c10.956%206.28%2010.956%2022.083%200%2028.363l-111.654%2064a16.35%2016.35%200%200%201-16.258%200l-111.654-64c-10.956-6.28-10.956-22.083%200-28.364zm8.126%2033.014l-78.783%2045.164l78.783%2045.155l78.784-45.155z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGFlaRCblf)%22%20d%3D%22M119.871%202.165a16.35%2016.35%200%200%201%2016.258%200l111.654%2064c10.956%206.28%2010.956%2022.083%200%2028.363l-111.654%2064a16.35%2016.35%200%200%201-16.258%200l-111.654-64c-10.956-6.28-10.956-22.083%200-28.363zm8.126%2033.015L49.214%2080.343l78.783%2045.156l78.784-45.156z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGru2OOiqc)%22%20d%3D%22m120.19%2064.755l16.174%2028.412l-111.93%2063.723l-16.175-28.412z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20256%20224%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGssQ2Xbjz%22%20x1%3D%22-6.452%25%22%20x2%3D%2285.236%25%22%20y1%3D%2249.784%25%22%20y2%3D%2249.784%25%22%3E%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23f9d100%22%2F%3E%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23f97700%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGFlaRCblf%22%20x1%3D%22106.079%25%22%20x2%3D%2214.268%25%22%20y1%3D%2249.784%25%22%20y2%3D%2249.784%25%22%3E%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23f9d100%22%2F%3E%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23f97700%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22SVGru2OOiqc%22%20x1%3D%22-12.871%25%22%20x2%3D%22169.796%25%22%20y1%3D%2275.863%25%22%20y2%3D%2274.878%25%22%3E%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%23f9d100%22%2F%3E%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23f97700%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22url(%23SVGssQ2Xbjz)%22%20d%3D%22M119.871%2064.78a16.35%2016.35%200%200%201%2016.258%200l111.654%2064c10.956%206.28%2010.956%2022.083%200%2028.363l-111.654%2064a16.35%2016.35%200%200%201-16.258%200l-111.654-64c-10.956-6.28-10.956-22.083%200-28.364zm8.126%2033.014l-78.783%2045.164l78.783%2045.155l78.784-45.155z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGFlaRCblf)%22%20d%3D%22M119.871%202.165a16.35%2016.35%200%200%201%2016.258%200l111.654%2064c10.956%206.28%2010.956%2022.083%200%2028.363l-111.654%2064a16.35%2016.35%200%200%201-16.258%200l-111.654-64c-10.956-6.28-10.956-22.083%200-28.363zm8.126%2033.015L49.214%2080.343l78.783%2045.156l78.784-45.156z%22%2F%3E%3Cpath%20fill%3D%22url(%23SVGru2OOiqc)%22%20d%3D%22m120.19%2064.755l16.174%2028.412l-111.93%2063.723l-16.175-28.412z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/logos/gradio-icon.svg?color=%231a73e8&size=48