Add icons to this collection by clicking the heart icon.
School Bell icon - also known as bell, music, alarm, notification, school bell, and music and multimedia. Created in a clean color 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 510 510"
>
<linearGradient id="a">
<stop offset="0" stop-color="#7e8595" />
<stop offset="1" stop-color="#555a66" />
</linearGradient>
<linearGradient
id="f"
x1="229.145"
x2="342.464"
y1="319.689"
y2="548.019"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="g"
x1="252.652"
x2="72.24"
y1="457.958"
y2="616.476"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#bec3d2" stop-opacity="0" />
<stop offset=".221" stop-color="#c5c9d7" stop-opacity=".221" />
<stop offset=".534" stop-color="#d7dae3" stop-opacity=".534" />
<stop offset=".901" stop-color="#f6f6f8" stop-opacity=".901" />
<stop offset="1" stop-color="#fff" />
</linearGradient>
<linearGradient id="b">
<stop offset="0" stop-color="#555a66" stop-opacity="0" />
<stop offset="1" stop-color="#555a66" />
</linearGradient>
<linearGradient
id="h"
x1="319.974"
x2="307.306"
y1="482.945"
y2="401.394"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="i"
x1="396.678"
x2="461.82"
y1="360.121"
y2="491.379"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#7e8595" />
<stop offset="1" stop-color="#555a66" stop-opacity="0" />
</linearGradient>
<linearGradient id="c">
<stop offset="0" stop-color="#ffda45" />
<stop offset=".304" stop-color="#ffce3e" />
<stop offset=".856" stop-color="#ffae2b" />
<stop offset="1" stop-color="#ffa425" />
</linearGradient>
<radialGradient
id="j"
cx="214.435"
cy="100.521"
r="274.62"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<linearGradient id="d">
<stop offset="0" stop-color="#ffda45" stop-opacity="0" />
<stop offset="1" stop-color="#fcee21" />
</linearGradient>
<linearGradient
id="k"
x1="300.577"
x2="104.541"
y1="214.841"
y2="18.805"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<linearGradient id="e">
<stop offset="0" stop-color="#ffda45" stop-opacity="0" />
<stop offset="1" stop-color="#b53759" />
</linearGradient>
<linearGradient
id="l"
x1="285.71"
x2="551.357"
y1="267.329"
y2="-226.738"
gradientUnits="userSpaceOnUse"
href="#e"
/>
<linearGradient
id="m"
x1="371.51"
x2="257.739"
y1="285.786"
y2="172.015"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#ffda45" stop-opacity="0" />
<stop offset=".519" stop-color="#d9874f" stop-opacity=".519" />
<stop offset="1" stop-color="#b53759" />
</linearGradient>
<linearGradient
id="n"
x1="264.12"
x2="315.621"
y1="178.384"
y2="229.885"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#f9f7fc" />
<stop offset="1" stop-color="#f0ddfc" />
</linearGradient>
<linearGradient
id="o"
x1="283.769"
x2="259.234"
y1="200.026"
y2="165.242"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#e9edf5" stop-opacity="0" />
<stop offset="1" stop-color="#fff" />
</linearGradient>
<linearGradient
id="p"
x1="284.411"
x2="339.069"
y1="201.003"
y2="99.347"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#f0ddfc" stop-opacity="0" />
<stop offset=".289" stop-color="#c8b7e0" stop-opacity=".289" />
<stop offset=".592" stop-color="#a595c8" stop-opacity=".592" />
<stop offset=".84" stop-color="#8f81b8" stop-opacity=".84" />
<stop offset="1" stop-color="#8779b3" />
</linearGradient>
<radialGradient
id="q"
cx="261.624"
cy="203.323"
r="233.628"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#ffda45" />
<stop offset=".509" stop-color="#ffd844" />
<stop offset=".692" stop-color="#ffd140" />
<stop offset=".823" stop-color="#ffc639" />
<stop offset=".928" stop-color="#ffb52f" />
<stop offset="1" stop-color="#ffa425" />
</radialGradient>
<linearGradient
id="r"
x1="67.148"
x2="60.023"
y1="246.25"
y2="203.498"
gradientUnits="userSpaceOnUse"
href="#e"
/>
<radialGradient
id="s"
cx="51.794"
cy="183.135"
r="29.988"
gradientUnits="userSpaceOnUse"
href="#c"
/>
<linearGradient
id="t"
x1="60.946"
x2="41.848"
y1="195.364"
y2="176.266"
gradientUnits="userSpaceOnUse"
href="#d"
/>
<linearGradient
id="u"
x1="59.577"
x2="88.585"
y1="201.35"
y2="147.399"
gradientUnits="userSpaceOnUse"
href="#e"
/>
<linearGradient
id="v"
x1="278.771"
x2="279.257"
y1="467.701"
y2="440.959"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="w"
x1="278.771"
x2="279.257"
y1="494.351"
y2="467.609"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="x"
x1="335.336"
x2="284.493"
y1="463.626"
y2="345.293"
gradientUnits="userSpaceOnUse"
href="#b"
/>
<linearGradient
id="y"
x1="267.407"
x2="293.754"
y1="386.142"
y2="439.231"
gradientUnits="userSpaceOnUse"
href="#a"
/>
<linearGradient
id="z"
x1="291.779"
x2="256.637"
y1="139.473"
y2="-9.386"
gradientUnits="userSpaceOnUse"
>
<stop offset="0" stop-color="#ffda45" stop-opacity="0" />
<stop offset="1" stop-color="#fff" />
</linearGradient>
<path
fill="url(#f)"
d="M424.412 510H133.583c-16.364 0-29.63-13.266-29.63-29.63V359.91c0-16.364 13.266-29.63 29.63-29.63h290.829c16.364 0 29.63 13.266 29.63 29.63v120.46c.001 16.364-13.265 29.63-29.63 29.63z"
/>
<path
fill="url(#g)"
d="M149.201 345.897c-16.364 0-29.63 13.266-29.63 29.63v120.46c0 4.132.848 8.065 2.376 11.638A29.542 29.542 0 0 0 133.585 510h290.829c16.364 0 29.63-13.266 29.63-29.63V359.91c0-4.132-.848-8.065-2.376-11.638a29.525 29.525 0 0 0-11.638-2.376H149.201z"
/>
<path
fill="url(#h)"
d="M424.412 330.28H142.719L322.439 510h101.974c16.364 0 29.63-13.266 29.63-29.63V359.91c0-16.364-13.266-29.63-29.631-29.63z"
/>
<path
fill="url(#i)"
d="M424.412 330.28h-14.276c16.364 0 29.63 13.266 29.63 29.63v120.46c0 16.364-13.266 29.63-29.63 29.63h14.276c16.364 0 29.63-13.266 29.63-29.63V359.91c.001-16.364-13.265-29.63-29.63-29.63z"
/>
<circle cx="278.998" cy="193.262" r="193.262" fill="url(#j)" />
<circle cx="278.998" cy="193.262" r="180.79" fill="url(#k)" />
<path
fill="url(#l)"
d="M365.45 20.382c13.034 26.015 20.382 55.373 20.382 86.452 0 106.735-86.526 193.262-193.262 193.262-31.079 0-60.437-7.347-86.452-20.382 31.731 63.329 97.223 106.81 172.88 106.81 106.735 0 193.262-86.526 193.262-193.262 0-75.657-43.481-141.149-106.81-172.88z"
/>
<path
fill="url(#m)"
d="M440.822 298.933 308.546 166.656c-7.278-8.078-18.819-11.159-30.548-11.159-21.961 0-37.764 16.803-37.764 38.764 0 11.73 4.081 21.27 12.16 28.549L384.67 355.086a194.289 194.289 0 0 0 56.152-56.153z"
/>
<circle cx="278.998" cy="193.262" r="39.764" fill="url(#n)" />
<circle cx="278.998" cy="193.262" r="33.187" fill="url(#o)" />
<path
fill="url(#p)"
d="M296.786 157.691a39.595 39.595 0 0 1 4.194 17.788c0 21.961-17.803 39.764-39.764 39.764a39.595 39.595 0 0 1-17.788-4.194c6.529 13.03 20.004 21.977 35.571 21.977 21.961 0 39.764-17.803 39.764-39.764-.001-15.567-8.947-29.042-21.977-35.571z"
/>
<path
fill="url(#q)"
d="M278.998 421.009c-125.58 0-227.747-102.167-227.747-227.747h17.284c0 116.05 94.413 210.464 210.464 210.464v17.283z"
/>
<path
fill="url(#r)"
d="M68.534 193.262H51.25c0 20.582 2.761 40.529 7.903 59.507h17.961a209.864 209.864 0 0 1-8.58-59.507z"
/>
<circle cx="58.844" cy="193.262" r="21.104" fill="url(#s)" />
<circle cx="58.844" cy="193.262" r="17.613" fill="url(#t)" />
<path
fill="url(#u)"
d="M68.284 174.384a21.02 21.02 0 0 1 2.226 9.44c0 11.655-9.448 21.104-21.104 21.104a21 21 0 0 1-9.44-2.226c3.465 6.915 10.616 11.663 18.878 11.663 11.655 0 21.104-9.448 21.104-21.104 0-8.261-4.748-15.412-11.664-18.877z"
/>
<path
fill="url(#v)"
d="M345.523 462.361H212.472a7.128 7.128 0 0 1-7.128-7.128 7.128 7.128 0 0 1 7.128-7.128h133.051a7.128 7.128 0 0 1 0 14.256z"
/>
<path
fill="url(#w)"
d="M345.523 489.01H212.472a7.128 7.128 0 1 1 0-14.256h133.051a7.128 7.128 0 0 1 0 14.256z"
/>
<path
fill="url(#x)"
d="M424.412 510c3.669 0 7.18-.672 10.423-1.891L318.703 391.976c-1.203-2.012-3.38-3.372-5.895-3.372h-67.621a6.889 6.889 0 0 0-6.889 6.889v28.008c0 1.137.29 2.199.782 3.14L322.439 510z"
/>
<path
fill="url(#y)"
d="M312.808 430.39h-67.62a6.889 6.889 0 0 1-6.889-6.889v-28.008a6.889 6.889 0 0 1 6.889-6.889h67.62a6.889 6.889 0 0 1 6.889 6.889v28.008a6.889 6.889 0 0 1-6.889 6.889z"
/>
<ellipse cx="278.998" cy="85.333" fill="url(#z)" rx="117.269" ry="68.164" />
</svg>
More icons in the same style and category