Add icons to this collection by clicking the heart icon.
Online Education icon - also known as graduation, education, student, mortarboard, website, online education, online learning, and web browser. Created in a clean flat gradient style with a white finish, 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 32 32"
>
<linearGradient
id="b"
x1="2"
x2="30"
y1="16"
y2="16"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#64b5f6" />
<stop offset="1" stop-color="#bbdefb" />
</linearGradient>
<linearGradient
id="c"
x1="6"
x2="16"
y1="17.44"
y2="17.44"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#ffb74d" />
<stop offset="1" stop-color="#ffe0b2" />
</linearGradient>
<linearGradient
id="a"
x1="17"
x2="19"
y1="16"
y2="16"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#1565c0" />
<stop offset="1" stop-color="#1e88e5" />
</linearGradient>
<linearGradient id="d" x1="3" y1="14.5" y2="14.5" href="#a" />
<g>
<rect width="28" height="28" x="2" y="2" fill="url(#b)" rx="1" />
<path
d="M4 30H3a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h1a1 1 0 0 0-1 1v26a1 1 0 0 0 1 1z"
opacity=".1"
/>
<path
fill="#fff"
d="M30 3v26a1 1 0 0 1-1 1h-1a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1h1a1 1 0 0 1 1 1z"
opacity=".2"
/>
<path d="M2 9h28v2H2z" opacity=".1" />
<path fill="#fff" d="M2 8h28v2H2z" />
<path fill="#fff" d="M17 2v7a1 1 0 0 1-2 0V2z" />
<path d="M13 6a1 1 0 0 1-1 1H2V5h10a1 1 0 0 1 1 1z" opacity=".1" />
<circle cx="23" cy="6" r="1" opacity=".1" />
<circle cx="20" cy="6" r="1" opacity=".1" />
<circle cx="26" cy="6" r="1" opacity=".1" />
<path fill="#fff" d="M13 5a1 1 0 0 1-1 1H2V4h10a1 1 0 0 1 1 1z" />
<circle cx="23" cy="5" r="1" fill="#fff" />
<circle cx="20" cy="5" r="1" fill="#fff" />
<circle cx="23" cy="28" r="1" opacity=".1" />
<circle cx="26" cy="28" r="1" opacity=".1" />
<circle cx="6" cy="24" r="1" opacity=".1" />
<circle cx="9" cy="24" r="1" opacity=".1" />
<path
d="M26 17h-5a1 1 0 0 1 0-2h5a1 1 0 0 1 0 2zM26 21h-5a1 1 0 0 1 0-2h5a1 1 0 0 1 0 2zM26 25H12a1 1 0 0 1 0-2h14a1 1 0 0 1 0 2zM20 29H6a1 1 0 0 1 0-2h14a1 1 0 0 1 0 2z"
opacity=".1"
/>
<g fill="#fff">
<circle cx="23" cy="27" r="1" />
<circle cx="26" cy="5" r="1" />
<circle cx="26" cy="27" r="1" />
<circle cx="6" cy="23" r="1" />
<circle cx="9" cy="23" r="1" />
<path
d="M26 16h-5a1 1 0 0 1 0-2h5a1 1 0 0 1 0 2zM26 20h-5a1 1 0 0 1 0-2h5a1 1 0 0 1 0 2zM26 24H12a1 1 0 0 1 0-2h14a1 1 0 0 1 0 2zM20 28H6a1 1 0 0 1 0-2h14a1 1 0 0 1 0 2z"
/>
</g>
<path
fill="url(#c)"
d="M15.57 14.32a1 1 0 0 0-.92-.11L11 15.59l-3.65-1.38a1 1 0 0 0-1.35.93V19c0 1.2 1.52 1.45 2.09 1.55a18.52 18.52 0 0 0 2.91.2c4.41 0 5-.88 5-1.75v-3.86a1 1 0 0 0-.43-.82z"
/>
<path
d="M16 18v1c0 .87-.59 1.75-5 1.75a18.52 18.52 0 0 1-2.91-.2C7.52 20.45 6 20.2 6 19v-1c0 1.2 1.52 1.45 2.09 1.55a18.52 18.52 0 0 0 2.91.2c4.41 0 5-.88 5-1.75z"
opacity=".1"
/>
<path
fill="url(#a)"
d="M18 19a1 1 0 0 1-1-1v-4a1 1 0 0 1 2 0v4a1 1 0 0 1-1 1z"
/>
<path
fill="url(#d)"
d="m18.23 13-7-1.66a.9.9 0 0 0-.46 0l-7 1.66a1 1 0 0 0-.77.91 1 1 0 0 0 .64 1l7 2.66a.91.91 0 0 0 .7 0l7-2.66a1 1 0 0 0 .64-1 1 1 0 0 0-.75-.91z"
/>
<path
d="M19 13.94a1 1 0 0 1-.64 1l-7 2.66a.91.91 0 0 1-.7 0l-7-2.66a1 1 0 0 1-.64-1 1.07 1.07 0 0 1 .13-.44 1 1 0 0 0 .51.43l7 2.66a.91.91 0 0 0 .7 0l7-2.66a1 1 0 0 0 .51-.43 1.07 1.07 0 0 1 .13.44z"
opacity=".1"
/>
</g>
</svg>
More icons in the same style and category