SVGR

Official SVGR vector logo in the Dev & Tools category. Download lossless SVG and a 1024px transparent PNG.

Scroll to zoom · Drag to pan · Double-click to zoom in

Brand Color Palette

Click swatch to copy HEX

Download SVG Vector File PNG

Download all as ZIP Download Wordmark SVG Variant

ADChatGPT Plus·Official Shared & Dedicated Plans · Instant Access to GPT-6.1 Sol / Deep Research

Code 6666888 · 5% OFF

ADNetflix 4K·Dedicated Profile · Private PIN Lock · All Devices Supported

Code 6666888 · 5% OFF

Vector Format: SVG · 1:1
Raster Export: 1024 × 1024 px
SVG viewBox: 0 0 64 64
File Size / Nodes: 36.0 KB · 56 paths
Official Site: https://react-svgr.com/

Edit & Export

Recolor, add a background or padding, then export. Everything runs locally in your browser.

Colors

Single color

Background

Padding0%Corner radius0%

Format

Size

SVG, PNG 16–2048px, JPG, WebP, ICO and a favicon setSVGR.zip

Brand Visual Specifications & SVG Parameters

Database-extracted geometry, color models & WCAG contrast metrics

Brand Entity / Display Name: SVGR
Industry Category: Dev & Tools
Primary Color (HEX / RGB / HSL): #DF7D3Crgb(223, 125, 60) · hsl(24, 72%, 55%)
WCAG Surface Contrast: Light 2.9:1 · Dark 6.7:1

Inline SVG Code Snippet

<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg" width="64" height="64">
    <defs>
        <radialGradient id="Y" cx="0" cy="0" r="1" gradientTransform="matrix(-2.82338 2.67508 -3.48095 -3.67393 21.198 18.256)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#FFEDBA"/>
            <stop offset="1" stop-color="#FFEDBA" stop-opacity="0"/>
        </radialGradient>
        <radialGradient id="J" cx="0" cy="0" r="1" gradientTransform="matrix(0 6.125 -9.07688 0 16 16.889)" gradientUnits="userSpaceOnUse">
            <stop offset=".76" stop-color="#E98F94" stop-opacity="0"/>
            <stop offset="1" stop-color="#CC9688"/>
        </radialGradient>
        <radialGradient id="E" cx="0" cy="0" r="1" gradientTransform="matrix(0 2.8125 -5.36337 0 164 49.547)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#D87B7C"/>
            <stop offset="1" stop-color="#D87B7C" stop-opacity="0"/>
        </radialGradient>
        <radialGradient id="D" cx="0" cy="0" r="1" gradientTransform="matrix(3.3125 1.9375 -3.07134 5.251 156.25 51.61)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#FFCFAC"/>
            <stop offset="1" stop-color="#FFCFAC" stop-opacity="0"/>
        </radialGradient>
        <radialGradient id="C" cx="0" cy="0" r="1" gradientTransform="matrix(0 7.3125 -7.839 0 164 49.797)" gradientUnits="userSpaceOnUse">
            <stop offset=".65" stop-color="#FFBC99" stop-opacity="0"/>
            <stop offset=".906" stop-color="#E98C8C"/>
        </radialGradient>
        <radialGradient id="B" cx="0" cy="0" r="1" gradientTransform="rotate(-159.264 90.445 12.62)scale(7.48484)" gradientUnits="userSpaceOnUse">
            <stop offset=".239" stop-color="#FFCFAC"/>
            <stop offset="1" stop-color="#F5A8A2"/>
        </radialGradient>
        <radialGradient id="w" cx="0" cy="0" r="1" gradientTransform="matrix(0 5.09375 -12.75 0 164.094 31.672)" gradientUnits="userSpaceOnUse">
            <stop offset=".576" stop-color="#844649" stop-opacity="0"/>
            <stop offset=".881" stop-color="#914E52"/>
        </radialGradient>
        <radialGradient id="v" cx="0" cy="0" r="1" gradientTransform="matrix(3.5625 5.375 -7.19423 4.76826 168.563 49.047)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#512242"/>
            <stop offset="1" stop-color="#612A4F" stop-opacity="0"/>
        </radialGradient>
        <radialGradient id="u" cx="0" cy="0" r="1" gradientTransform="matrix(-1.87503 5.37499 -5.164 -1.80143 162.125 51.484)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#512242"/>
            <stop offset="1" stop-color="#612A4F" stop-opacity="0"/>
        </radialGradient>
        <radialGradient id="t" cx="0" cy="0" r="1" gradientTransform="matrix(-5.43744 7.68754 -7.38577 -5.224 161.188 44.86)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#512242"/>
            <stop offset="1" stop-color="#612A4F" stop-opacity="0"/>
        </radialGradient>
        <radialGradient id="r" cx="0" cy="0" r="1" gradientTransform="matrix(-7.50003 7.06248 -7.08209 -7.52085 172.563 39.11)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#A16662"/>
            <stop offset="1" stop-color="#A16662" stop-opacity="0"/>
        </radialGradient>
        <radialGradient id="q" cx="0" cy="0" r="1" gradientTransform="matrix(-.4375 18.63507 -27.08974 -.636 164.438 40.734)" gradientUnits="userSpaceOnUse">
            <stop offset=".689" stop-color="#612A4F" stop-opacity="0"/>
            <stop offset="1" stop-color="#612A4F"/>
        </radialGradient>
        <radialGradient id="m" cx="0" cy="0" r="1" gradientTransform="matrix(-1.4175 2.77744 -2.91516 -1.48779 171.188 34.457)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#F49A45"/>
            <stop offset="1" stop-color="#EA8243"/>
        </radialGradient>
        <radialGradient id="l" cx="0" cy="0" r="1" gradientTransform="matrix(1.46875 -.28125 .49056 2.56181 156.508 37.031)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#DC8B54"/>
            <stop offset="1" stop-color="#DC8B54" stop-opacity="0"/>
        </radialGradient>
        <radialGradient id="j" cx="0" cy="0" r="1" gradientTransform="matrix(4.5625 -.25 .26312 4.80193 155.812 35.672)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#DC8C58"/>
            <stop offset="1" stop-color="#CC7438"/>
        </radialGradient>
        <radialGradient id="i" cx="0" cy="0" r="1" gradientTransform="matrix(-3.39632 1.06252 -1.25883 -4.0238 161.688 33.922)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#DF7D3C"/>
            <stop offset="1" stop-color="#DF7D3C" stop-opacity="0"/>
        </radialGradient>
        <radialGradient id="h" cx="0" cy="0" r="1" gradientTransform="matrix(-.92187 .3125 -.6536 -1.92807 171.906 35.672)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#FFC567"/>
            <stop offset="1" stop-color="#FFC362" stop-opacity="0"/>
        </radialGradient>
        <radialGradient id="g" cx="0" cy="0" r="1" gradientTransform="matrix(3.53125 -2.75 3.25808 4.18366 168.375 37.547)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#DF7D3C"/>
            <stop offset="1" stop-color="#DF7D3C" stop-opacity="0"/>
        </radialGradient>
        <radialGradient id="f" cx="0" cy="0" r="1" gradientTransform="matrix(.5625 11.25005 -16.28456 .81423 165.125 40.984)" gradientUnits="userSpaceOnUse">
            <stop offset=".865" stop-color="#DF7D3C" stop-opacity="0"/>
            <stop offset="1" stop-color="#C8692A"/>
        </radialGradient>
        <radialGradient id="e" cx="0" cy="0" r="1" gradientTransform="matrix(0 4.625 -5.24685 0 164 33.734)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#DF7D3C"/>
            <stop offset="1" stop-color="#DF7D3C" stop-opacity="0"/>
        </radialGradient>
        <radialGradient id="d" cx="0" cy="0" r="1" gradientTransform="matrix(0 -6.75 8.9375 0 164 51.047)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#DF7D3C"/>
            <stop offset="1" stop-color="#DF7D3C" stop-opacity="0"/>
        </radialGradient>
        <radialGradient id="c" cx="0" cy="0" r="1" gradientTransform="matrix(4.4375 -.75 2.18382 12.92095 152 46.234)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#FFD375"/>
            <stop offset="1" stop-color="#FFCB5A" stop-opacity="0"/>
        </radialGradient>
        <radialGradient id="b" cx="0" cy="0" r="1" gradientTransform="matrix(-7.31252 3.56245 -6.65989 -13.67053 174.125 42.047)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#FFCB5A"/>
            <stop offset="1" stop-color="#FFCB5A" stop-opacity="0"/>
        </radialGradient>
        <radialGradient id="a" cx="0" cy="0" r="1" gradientTransform="matrix(0 19.5625 -19.4375 0 165.688 34.61)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#FFCB5A"/>
            <stop offset=".767" stop-color="#EA9231"/>
        </radialGradient>
        <linearGradient id="W" x1="14.25" x2="15.283" y1="19.514" y2="18.512" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#5F5254"/>
            <stop offset="1" stop-color="#5F5254" stop-opacity="0"/>
        </linearGradient>
        <linearGradient id="V" x1="17.367" x2="17.367" y1="20.251" y2="17.985" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#552D52"/>
            <stop offset="1" stop-color="#552D52" stop-opacity="0"/>
        </linearGradient>
        <linearGradient id="U" x1="16.438" x2="16.438" y1="17.737" y2="16.238" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop offset=".147" stop-color="#34222C" stop-opacity="0"/>
            <stop offset=".873" stop-color="#34222C"/>
        </linearGradient>
        <linearGradient id="T" x1="18.689" x2="14.784" y1="16.326" y2="19.757" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop offset=".191" stop-color="#5F5254"/>
            <stop offset="1" stop-color="#2E2127"/>
        </linearGradient>
        <linearGradient id="S" x1="15.551" x2="15.551" y1="18.162" y2="20.912" gradientUnits="userSpaceOnUse">
            <stop stop-color="#CC9688"/>
            <stop offset="1" stop-color="#E98F94"/>
        </linearGradient>
        <linearGradient id="P" x1="12.995" x2="12.995" y1="16.564" y2="14.973" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#552D52"/>
            <stop offset="1" stop-color="#552D52" stop-opacity="0"/>
        </linearGradient>
        <linearGradient id="O" x1="10.781" x2="12" y1="14.539" y2="14.539" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#594C4F"/>
            <stop offset="1" stop-color="#594C4F" stop-opacity="0"/>
        </linearGradient>
        <linearGradient id="N" x1="12.67" x2="11.836" y1="14.539" y2="14.539" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop offset=".225" stop-color="#594C4F"/>
            <stop offset="1" stop-color="#392833"/>
        </linearGradient>
        <linearGradient id="M" x1="21.002" x2="21.002" y1="16.564" y2="14.973" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#552D52"/>
            <stop offset="1" stop-color="#552D52" stop-opacity="0"/>
        </linearGradient>
        <linearGradient id="L" x1="20.677" x2="19.843" y1="14.539" y2="14.539" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop offset=".225" stop-color="#594C4F"/>
            <stop offset="1" stop-color="#392833"/>
        </linearGradient>
        <linearGradient id="G" x1="16" x2="16" y1="13.941" y2="23.389" gradientUnits="userSpaceOnUse">
            <stop stop-color="#FDCC98"/>
            <stop offset="1" stop-color="#FBB3BE"/>
            <stop offset="1" stop-color="#F4AD92"/>
        </linearGradient>
        <linearGradient id="H" x1="10.781" x2="13.219" y1="15.514" y2="17.99" gradientUnits="userSpaceOnUse">
            <stop offset=".004" stop-color="#DAA168"/>
            <stop offset="1" stop-color="#DAA168" stop-opacity="0"/>
        </linearGradient>
        <linearGradient id="I" x1="16" x2="16" y1="22.358" y2="19.201" gradientUnits="userSpaceOnUse">
            <stop offset=".268" stop-color="#E98C8C"/>
            <stop offset="1" stop-color="#DC8CE9" stop-opacity="0"/>
        </linearGradient>
        <linearGradient id="A" x1="27.277" x2="28.746" y1="6.014" y2="2.639" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#7E3835" stop-opacity="0"/>
            <stop offset=".572" stop-color="#442524"/>
        </linearGradient>
        <linearGradient id="z" x1="26.683" x2="24.902" y1="5.717" y2="3.795" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#7E3835" stop-opacity="0"/>
            <stop offset=".665" stop-color="#442524"/>
        </linearGradient>
        <linearGradient id="y" x1="4.719" x2="3.25" y1="6.014" y2="2.639" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#7E3835" stop-opacity="0"/>
            <stop offset=".572" stop-color="#442524"/>
        </linearGradient>
        <linearGradient id="x" x1="5.313" x2="7.094" y1="5.717" y2="3.795" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#7E3835" stop-opacity="0"/>
            <stop offset=".665" stop-color="#442524"/>
        </linearGradient>
        <linearGradient id="s" x1="16" x2="16" y1=".514" y2="5.264" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#754B42"/>
            <stop offset="1" stop-color="#754B42" stop-opacity="0"/>
        </linearGradient>
        <linearGradient id="p" x1="32.625" x2="24.125" y1="21.264" y2="21.264" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#996862"/>
            <stop offset=".551" stop-color="#996862" stop-opacity="0"/>
        </linearGradient>
        <linearGradient id="o" x1="1.188" x2="7.375" y1="21.264" y2="21.264" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#9A6A66"/>
            <stop offset="1" stop-color="#7D5956" stop-opacity="0"/>
        </linearGradient>
        <linearGradient id="n" x1="16" x2="16" y1="1.73" y2="40.264" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#9F635E"/>
            <stop offset="1" stop-color="#612A4F"/>
        </linearGradient>
        <linearGradient id="k" x1="10.469" x2="9.469" y1="7.279" y2="6.357" gradientTransform="translate(148 29.408)" gradientUnits="userSpaceOnUse">
            <stop stop-color="#CB6C32"/>
            <stop offset=".587" stop-color="#D1743A" stop-opacity="0"/>
        </linearGradient>
        <filter id="ac" width="3.028" height="4.403" x="23.9" y="1.851" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse">
            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
            <feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
            <feGaussianBlur result="effect1_foregroundBlur_28327_2199" stdDeviation=".5"/>
        </filter>
        <filter id="ab" width="4.813" height="8.394" x="25.472" y="4.679" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse">
            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
            <feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
            <feGaussianBlur result="effect1_foregroundBlur_28327_2199" stdDeviation="1"/>
        </filter>
        <filter id="aa" width="4.813" height="11.854" x="26.156" y="12.848" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse">
            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
            <feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
            <feGaussianBlur result="effect1_foregroundBlur_28327_2199" stdDeviation="1"/>
        </filter>
        <filter id="Z" width="7.281" height="5.875" x="15.297" y="1.592" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse">
            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
            <feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
            <feGaussianBlur result="effect1_foregroundBlur_28327_2199" stdDeviation=".625"/>
        </filter>
        <filter id="X" width="6.122" height="5.484" x="16.55" y="16.279" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse">
            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
            <feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
            <feGaussianBlur result="effect1_foregroundBlur_28327_2199" stdDeviation=".5"/>
        </filter>
        <filter id="R" width="5.898" height="3.844" x="12.602" y="17.1" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse">
            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
            <feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
            <feGaussianBlur result="effect1_foregroundBlur_28327_2199" stdDeviation=".25"/>
        </filter>
        <filter id="Q" width="4.25" height="5.625" x="15.094" y="13.295" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse">
            <feFlood flood-opacity="0" result="BackgroundImageFix"/>
            <feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
            <feGaussianBlur result="effect1_foregroundBlur_28327_2199" stdDeviation=".5"/>
       
<!-- ...[data omitted, click Copy or Download for full SVG]... -->
</svg>

Engineering & Layout Guidelines

Maintain the native 1:1 aspect ratio (viewBox "0 0 64 64") without non-uniform stretching.
Preserve at least 20% clear space around the emblem bounding box.
Contains vector gradients; avoid overriding paths with flat CSS fill: currentColor.

View All in Category

Appwrite

Dev & Tools

Archery DMS

Dev & Tools

Baidu Translate

百度翻译

Baidu Netdisk

百度网盘

CNCF

Dev & Tools

CNCF Landscape

Dev & Tools

Brand Color Palette

Download

Edit & Export

Colors

Background

Brand Visual Specifications & SVG Parameters

Inline SVG Code Snippet

Engineering & Layout Guidelines

Related Brand Logos

Appwrite

Archery DMS

Baidu Translate

Baidu Netdisk

CNCF

CNCF Landscape