Add icons to this collection by clicking the heart icon.
Coding icon - also known as interface, keyboard, website, multimedia, browser, web page, coding, html, and art and design. Created in a clean lineal gradient style, perfect for web, apps, and UI projects. Available in SVG and PNG, with multiple style variants.
<svg
xmlns="http://www.w3.org/2000/svg"
width="512"
height="512"
viewBox="0 0 64 64"
>
<defs>
<linearGradient
id="a"
x1="32"
x2="32"
y1="2.633"
y2="64.995"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#fc5c7d" />
<stop offset=".129" stop-color="#f35e85" />
<stop offset=".343" stop-color="#d9659b" />
<stop offset=".616" stop-color="#b070bf" />
<stop offset=".934" stop-color="#777ff0" />
<stop offset="1" stop-color="#6a82fb" />
</linearGradient>
<linearGradient id="b" x1="9" x2="9" y1="2.633" y2="64.995" href="#a" />
<linearGradient
id="c"
x1="10"
x2="10"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="d"
x1="15"
x2="15"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="e"
x1="19"
x2="19"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="f"
x1="23"
x2="23"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="g"
x1="27"
x2="27"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="h"
x1="31"
x2="31"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="i"
x1="35"
x2="35"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="j"
x1="40"
x2="40"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="k"
x1="13"
x2="13"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="l"
x1="17"
x2="17"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="m"
x1="21"
x2="21"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="n"
x1="25"
x2="25"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="o"
x1="29"
x2="29"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="p"
x1="33"
x2="33"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="q"
x1="37"
x2="37"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="r"
x1="41"
x2="41"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="s"
x1="14.854"
x2="14.854"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="t"
x1="23.146"
x2="23.146"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="u"
x1="19"
x2="19"
y1="2.633"
y2="64.995"
gradientTransform="rotate(71.547 19 22)"
href="#a"
/>
<linearGradient
id="v"
x1="28"
x2="28"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="w"
x1="14"
x2="14"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="x"
x1="49"
x2="49"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="y"
x1="9.5"
x2="9.5"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="z"
x1="59"
x2="59"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="A"
x1="37.854"
x2="37.854"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="B"
x1="46.146"
x2="46.146"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="C"
x1="42"
x2="42"
y1="2.633"
y2="64.995"
gradientTransform="rotate(71.547 42 9)"
href="#a"
/>
<linearGradient
id="D"
x1="51"
x2="51"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="E"
x1="48"
x2="48"
y1="2.633"
y2="64.995"
href="#a"
/>
<linearGradient
id="F"
x1="55"
x2="55"
y1="2.633"
y2="64.995"
href="#a"
/>
</defs>
<g>
<path
d="M46 57v-3h6a4 4 0 0 0 4-4V20a4 4 0 0 0 4-4V6a4 4 0 0 0-4-4H36a4 4 0 0 0-4 4H12a4 4 0 0 0-4 4v30H5a1 1 0 0 0-1 1v16a1 1 0 0 0 1 1h40a1 1 0 0 0 1-1ZM34 6a2 2 0 0 1 2-2h20a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H44a1.006 1.006 0 0 0-.555.168L39 21.132V19a1 1 0 0 0-1-1h-2a2 2 0 0 1-2-2ZM10 16h20v-2H10v-4a2 2 0 0 1 2-2h20v8a4 4 0 0 0 4 4h1v3a1 1 0 0 0 1.555.832L44.3 20H54v30a2 2 0 0 1-2 2h-6V41a1 1 0 0 0-1-1H10Zm34 40H6V42h38Z"
fill="url(#a)"
/>
<path d="M8 52h2v2H8z" fill="url(#b)" />
<path d="M8 48h4v2H8z" fill="url(#c)" />
<path d="M14 48h2v2h-2z" fill="url(#d)" />
<path d="M18 48h2v2h-2z" fill="url(#e)" />
<path d="M22 48h2v2h-2z" fill="url(#f)" />
<path d="M26 48h2v2h-2z" fill="url(#g)" />
<path d="M30 48h2v2h-2z" fill="url(#h)" />
<path d="M34 48h2v2h-2z" fill="url(#i)" />
<path d="M38 48h4v2h-4z" fill="url(#j)" />
<path d="M8 44h2v2H8z" fill="url(#b)" />
<path d="M12 44h2v2h-2z" fill="url(#k)" />
<path d="M16 44h2v2h-2z" fill="url(#l)" />
<path d="M20 44h2v2h-2z" fill="url(#m)" />
<path d="M24 44h2v2h-2z" fill="url(#n)" />
<path d="M28 44h2v2h-2z" fill="url(#o)" />
<path d="M32 44h2v2h-2z" fill="url(#p)" />
<path d="M36 44h2v2h-2z" fill="url(#q)" />
<path d="M40 44h2v2h-2z" fill="url(#r)" />
<path d="M12 52h2v2h-2z" fill="url(#k)" />
<path d="M40 52h2v2h-2z" fill="url(#r)" />
<path d="M36 52h2v2h-2z" fill="url(#q)" />
<path d="M16 52h18v2H16z" fill="url(#n)" />
<path d="M12 10h2v2h-2z" fill="url(#k)" />
<path d="M16 10h2v2h-2z" fill="url(#l)" />
<path d="M20 10h2v2h-2z" fill="url(#m)" />
<path
d="m15.293 19.293-2 2a1 1 0 0 0 0 1.414l2 2 1.414-1.414L15.414 22l1.293-1.293Z"
fill="url(#s)"
/>
<path
d="m22.707 24.707 2-2a1 1 0 0 0 0-1.414l-2-2-1.414 1.414L22.586 22l-1.293 1.293Z"
fill="url(#t)"
/>
<path
d="M15.838 21h6.325v1.999h-6.325z"
transform="rotate(-71.547 19 22)"
fill="url(#u)"
/>
<path d="M27 23h2v2h-2z" fill="url(#v)" />
<path d="M13 27h2v2h-2zM13 31h2v2h-2zM13 35h2v2h-2z" fill="url(#w)" />
<path d="M17 27h28v2H17z" fill="url(#h)" />
<path d="M31 23h2v2h-2z" fill="url(#a)" />
<path d="M17 31h4v2h-4zM17 35h4v2h-4z" fill="url(#e)" />
<path d="M23 35h4v2h-4z" fill="url(#n)" />
<path d="M29 35h4v2h-4z" fill="url(#h)" />
<path d="M23 31h4v2h-4z" fill="url(#n)" />
<path d="M29 31h4v2h-4z" fill="url(#h)" />
<path d="M35 31h4v2h-4z" fill="url(#q)" />
<path d="M47 27h4v2h-4z" fill="url(#x)" />
<path d="M10 60h26v2H10z" fill="url(#f)" />
<path
d="M4 9v16h2V9a5.006 5.006 0 0 1 5-5h4V2h-4a7.009 7.009 0 0 0-7 7Z"
fill="url(#y)"
/>
<path d="M58 45h2v2h-2zM58 25h2v18h-2z" fill="url(#z)" />
<path
d="m38.293 11.707 1.414-1.414L38.414 9l1.293-1.293-1.414-1.414-2 2a1 1 0 0 0 0 1.414Z"
fill="url(#A)"
/>
<path
d="m45.707 11.707 2-2a1 1 0 0 0 0-1.414l-2-2-1.414 1.414L45.586 9l-1.293 1.293Z"
fill="url(#B)"
/>
<path
d="M38.838 8h6.325v1.999h-6.325z"
transform="rotate(-71.547 42 9)"
fill="url(#C)"
/>
<path d="M50 8h2v2h-2z" fill="url(#D)" />
<path d="M36 14h2v2h-2z" fill="url(#q)" />
<path d="M40 14h16v2H40z" fill="url(#E)" />
<path d="M54 8h2v2h-2z" fill="url(#F)" />
</g>
</svg>
More icons in the same style and category