Add icons to this collection by clicking the heart icon.
Layout icon - also known as web design, section, website, layout, browser, ui, seo and web, and user interface. 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 512 512"
>
<linearGradient
id="a"
x1="29.158"
x2="519.495"
y1="482.842"
y2="-7.495"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#003f8a" />
<stop offset=".518" stop-color="#00d7df" />
<stop offset="1" stop-color="#006df0" />
</linearGradient>
<linearGradient
id="b"
x1="-164.842"
x2="325.495"
y1="288.842"
y2="-201.495"
href="#a"
/>
<linearGradient
id="c"
x1="-148.842"
x2="341.495"
y1="304.842"
y2="-185.495"
href="#a"
/>
<linearGradient
id="d"
x1="-132.842"
x2="357.495"
y1="320.842"
y2="-169.495"
href="#a"
/>
<linearGradient
id="e"
x1="1.158"
x2="491.495"
y1="454.842"
y2="-35.495"
href="#a"
/>
<linearGradient
id="f"
x1="-74.842"
x2="415.495"
y1="378.842"
y2="-111.495"
href="#a"
/>
<linearGradient
id="g"
x1="77.158"
x2="567.495"
y1="530.842"
y2="40.505"
href="#a"
/>
<linearGradient
id="h"
x1="43.158"
x2="533.495"
y1="496.842"
y2="6.505"
href="#a"
/>
<linearGradient
id="i"
x1="85.158"
x2="575.495"
y1="538.842"
y2="48.505"
href="#a"
/>
<linearGradient
id="j"
x1="9.158"
x2="499.495"
y1="462.842"
y2="-27.495"
href="#a"
/>
<linearGradient
id="k"
x1="161.158"
x2="651.495"
y1="614.842"
y2="124.505"
href="#a"
/>
<path
fill="url(#a)"
d="M476 48H36A28.032 28.032 0 0 0 8 76v360a28.032 28.032 0 0 0 28 28h440a28.032 28.032 0 0 0 28-28V76a28.032 28.032 0 0 0-28-28zM36 64h440a12.013 12.013 0 0 1 12 12v20H24V76a12.013 12.013 0 0 1 12-12zm440 384H36a12.013 12.013 0 0 1-12-12V112h464v324a12.013 12.013 0 0 1-12 12z"
/>
<path fill="url(#b)" d="M40 88h8a8 8 0 0 0 0-16h-8a8 8 0 0 0 0 16z" />
<path fill="url(#c)" d="M72 88h8a8 8 0 0 0 0-16h-8a8 8 0 0 0 0 16z" />
<path fill="url(#d)" d="M104 88h8a8 8 0 0 0 0-16h-8a8 8 0 0 0 0 16z" />
<path
fill="url(#e)"
d="M220 256h72a20.023 20.023 0 0 0 20-20v-72a20.023 20.023 0 0 0-20-20h-72a20.023 20.023 0 0 0-20 20v72a20.023 20.023 0 0 0 20 20zm-4-92a4 4 0 0 1 4-4h72a4 4 0 0 1 4 4v72a4 4 0 0 1-4 4h-72a4 4 0 0 1-4-4z"
/>
<path
fill="url(#f)"
d="M68 256h72a20.023 20.023 0 0 0 20-20v-72a20.023 20.023 0 0 0-20-20H68a20.023 20.023 0 0 0-20 20v72a20.023 20.023 0 0 0 20 20zm-4-92a4 4 0 0 1 4-4h72a4 4 0 0 1 4 4v72a4 4 0 0 1-4 4H68a4 4 0 0 1-4-4z"
/>
<path
fill="url(#g)"
d="M372 256h72a20.023 20.023 0 0 0 20-20v-72a20.023 20.023 0 0 0-20-20h-72a20.023 20.023 0 0 0-20 20v72a20.023 20.023 0 0 0 20 20zm-4-92a4 4 0 0 1 4-4h72a4 4 0 0 1 4 4v72a4 4 0 0 1-4 4h-72a4 4 0 0 1-4-4z"
/>
<path
fill="url(#h)"
d="M464 264H48a8 8 0 0 0-8 8v24a8 8 0 0 0 8 8h416a8 8 0 0 0 8-8v-24a8 8 0 0 0-8-8zm-8 24H56v-8h400z"
/>
<path
fill="url(#i)"
d="M292 312h-72a20.023 20.023 0 0 0-20 20v72a20.023 20.023 0 0 0 20 20h72a20.023 20.023 0 0 0 20-20v-72a20.023 20.023 0 0 0-20-20zm4 92a4 4 0 0 1-4 4h-72a4 4 0 0 1-4-4v-72a4 4 0 0 1 4-4h72a4 4 0 0 1 4 4z"
/>
<path
fill="url(#j)"
d="M140 312H68a20.023 20.023 0 0 0-20 20v72a20.023 20.023 0 0 0 20 20h72a20.023 20.023 0 0 0 20-20v-72a20.023 20.023 0 0 0-20-20zm4 92a4 4 0 0 1-4 4H68a4 4 0 0 1-4-4v-72a4 4 0 0 1 4-4h72a4 4 0 0 1 4 4z"
/>
<path
fill="url(#k)"
d="M444 312h-72a20.023 20.023 0 0 0-20 20v72a20.023 20.023 0 0 0 20 20h72a20.023 20.023 0 0 0 20-20v-72a20.023 20.023 0 0 0-20-20zm4 92a4 4 0 0 1-4 4h-72a4 4 0 0 1-4-4v-72a4 4 0 0 1 4-4h72a4 4 0 0 1 4 4z"
/>
</svg>
More icons in the same style and category