notification-start-animation.svg

<!-- This Source Code Form is subject to the terms of the Mozilla Public

   - License, v. 2.0. If a copy of the MPL was not distributed with this

   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->

<svg xmlns="http://www.w3.org/2000/svg" width="340" height="20">

  <defs>

    <path d="M14.441 17a2 2 0 0 0 2-2c0 0 0-1.45 0-1.45a.625.625 0 0 0-.209-.39.632.632 0 0 0-.416-.16.636.636 0 0 0-.625.55c0 0 0 1.6 0 1.6 0 0-.601.6-.601.6 0 0-9.549 0-9.549 0 0 0-.6-.6-.6-.6 0 0 0-1.6 0-1.6a.638.638 0 0 0-.625-.55.636.636 0 0 0-.625.55c0 0 0 1.45 0 1.45a2 2 0 0 0 2 2c0 0 9.25 0 9.25 0z" id="tray"/>

  </defs>

  <defs>

    <path stroke-linecap="round" stroke="context-fill" d="M4.869 16.933A8.624 8.624 0 0 1 9.875 1.376M10 1.375A8.624 8.624 0 0 1 18.625 10 8.624 8.624 0 0 1 10 18.625a8.59 8.59 0 0 1-5.131-1.692" fill="none" stroke-width="1.15" id="q"/>

    <path fill="#fff" d="M2.688 12.75c0 0 0 5.562 0 5.562 0 0 .062 0 .062 0 0 0 0-5.562 0-5.562 0 0-.062 0-.062 0" id="h"/>

  </defs>

  <svg viewBox="0 0 20 20" width="20" height="20">

    <use fill="context-stroke" href="#tray"/>

    <path fill="context-stroke" d="M10.109 2.55a.618.618 0 0 0-.207-.39.641.641 0 0 0-.418-.16.636.636 0 0 0-.625.55c0 0 0 8.45 0 8.45 0 0-3.31-3.36-3.31-3.36a.633.633 0 0 0-.88 0 .606.606 0 0 0-.187.44.62.62 0 0 0 .187.44c0 0 4.47 4.48 4.47 4.48 0 0 .72 0 .72 0 0 0 4.47-4.48 4.47-4.48a.604.604 0 0 0 0-.88.633.633 0 0 0-.88 0c0 0-3.34 3.36-3.34 3.36 0 0 0-8.45 0-8.45z"/>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="20">

    <defs>

      <clipPath id="b">

        <path fill="#fff" d="M2.688 12.75c0 0 0 5.562 0 5.562 0 0 13.41 0 13.41 0 0 0 0-5.562 0-5.562 0 0-13.41 0-13.41 0"/>

      </clipPath>

    </defs>

    <g clip-path="url(#b)">

      <use fill="context-stroke" href="#tray"/>

    </g>

    <path fill="context-stroke" d="M10.1 2.621a.612.612 0 0 0-.205-.386.634.634 0 0 0-.414-.158.63.63 0 0 0-.619.544c0 0 0 8.364 0 8.364 0 0-3.276-3.326-3.276-3.326a.627.627 0 0 0-.87 0 .6.6 0 0 0-.186.436.614.614 0 0 0 .185.435c0 0 4.424 4.434 4.424 4.434 0 0 .713 0 .713 0 0 0 4.424-4.434 4.424-4.434a.597.597 0 0 0 0-.87.627.627 0 0 0-.87 0c0 0-3.307 3.325-3.307 3.325 0 0 0-8.364 0-8.364z"/>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="40">

    <defs>

      <clipPath id="c">

        <path fill="#fff" d="M2.688 12.75c0 0 0 5.562 0 5.562 0 0 11.167 0 11.167 0 0 0 0-5.562 0-5.562 0 0-11.167 0-11.167 0"/>

      </clipPath>

    </defs>

    <g clip-path="url(#c)">

        <use fill="context-stroke" href="#tray"/>

    </g>

    <path fill="context-stroke" d="M10.064 2.889a.588.588 0 0 0-.197-.371.61.61 0 0 0-.398-.152.605.605 0 0 0-.594.523c0 0 0 8.038 0 8.038 0 0-3.149-3.196-3.149-3.196a.602.602 0 0 0-.837 0 .577.577 0 0 0-.178.418.59.59 0 0 0 .178.419c0 0 4.252 4.261 4.252 4.261 0 0 .685 0 .685 0 0 0 4.252-4.261 4.252-4.261a.574.574 0 0 0 0-.837.602.602 0 0 0-.837 0c0 0-3.177 3.196-3.177 3.196 0 0 0-8.038 0-8.038z"/>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="60">

    <defs>

      <clipPath id="d">

        <path fill="#fff" d="M2.688 12.75c0 0 0 5.562 0 5.562 0 0 8.7 0 8.7 0 0 0 0-5.562 0-5.562 0 0-8.7 0-8.7 0"/>

      </clipPath>

    </defs>

    <g clip-path="url(#d)">

      <use fill="context-stroke" href="#tray"/>

    </g>

    <path fill="context-stroke" d="M9.974 3.56a.528.528 0 0 0-.177-.333.548.548 0 0 0-.357-.136.543.543 0 0 0-.534.47c0 0 0 7.22 0 7.22 0 0-2.829-2.87-2.829-2.87a.541.541 0 0 0-.752 0 .518.518 0 0 0-.16.376.53.53 0 0 0 .16.376c0 0 3.82 3.828 3.82 3.828 0 0 .616 0 .616 0 0 0 3.82-3.828 3.82-3.828a.516.516 0 0 0 0-.753.541.541 0 0 0-.752 0c0 0-2.855 2.872-2.855 2.872 0 0 0-7.221 0-7.221z"/>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="80">

    <defs>

      <clipPath id="e">

        <path fill="#fff" d="M2.688 12.75c0 0 0 5.562 0 5.562 0 0 6.174 0 6.174 0 0 0 0-5.562 0-5.562 0 0-6.174 0-6.174 0"/>

      </clipPath>

    </defs>

    <path stroke-linecap="round" stroke="context-fill" d="M4.869 16.933a8.628 8.628 0 0 1-1.38-1.275" fill="none" stroke-width="1.15"/>

    <g clip-path="url(#e)">

      <use fill="context-stroke" href="#tray"/>

    </g>

    <path fill="context-stroke" d="M9.759 5.18a.384.384 0 0 0-.13-.242.398.398 0 0 0-.259-.1.395.395 0 0 0-.388.342c0 0 0 5.252 0 5.252 0 0-2.058-2.088-2.058-2.088a.393.393 0 0 0-.632.125.383.383 0 0 0 .085.422c0 0 2.779 2.784 2.779 2.784 0 0 .447 0 .447 0 0 0 2.778-2.784 2.778-2.784a.375.375 0 0 0 0-.547.393.393 0 0 0-.547 0c0 0-2.075 2.088-2.075 2.088 0 0 0-5.252 0-5.252z"/>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="100">

    <defs>

      <clipPath id="f">

        <path fill="#fff" d="M2.688 12.75c0 0 0 5.562 0 5.562 0 0 3.707 0 3.707 0 0 0 0-5.562 0-5.562 0 0-3.707 0-3.707 0"/>

      </clipPath>

    </defs>

    <path stroke-linecap="round" stroke="context-fill" d="M4.869 16.933a8.648 8.648 0 0 1-3.016-4.091" fill="none" stroke-width="1.15"/>

    <g clip-path="url(#f)">

      <use fill="context-stroke" href="#tray"/>

    </g>

    <path fill="context-stroke" d="M9.51 7.041a.219.219 0 0 0-.073-.138.227.227 0 0 0-.148-.056.225.225 0 0 0-.22.194c0 0 0 2.99 0 2.99 0 0-1.172-1.189-1.172-1.189a.224.224 0 0 0-.36.071.218.218 0 0 0 .05.24c0 0 1.58 1.585 1.58 1.585 0 0 .255 0 .255 0 0 0 1.581-1.585 1.581-1.585a.213.213 0 0 0 0-.311.224.224 0 0 0-.31 0c0 0-1.182 1.189-1.182 1.189 0 0 0-2.99 0-2.99z"/>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="120">

    <defs>

      <clipPath id="g">

        <path fill="#fff" d="M2.688 12.75c0 0 0 5.562 0 5.562 0 0 1.464 0 1.464 0 0 0 0-5.562 0-5.562 0 0-1.464 0-1.464 0"/>

      </clipPath>

    </defs>

    <path stroke-linecap="round" stroke="context-fill" d="M4.869 16.933A8.612 8.612 0 0 1 1.375 10a8.58 8.58 0 0 1 1.569-4.961" fill="none" stroke-width="1.15"/>

    <g clip-path="url(#g)">

      <use fill="context-stroke" href="#tray"/>

    </g>

    <path fill="context-stroke" d="M9.375 8.06a.128.128 0 0 0-.043-.08.133.133 0 0 0-.087-.034.132.132 0 0 0-.13.114c0 0 0 1.75 0 1.75 0 0-.685-.695-.685-.695a.131.131 0 0 0-.21.041.128.128 0 0 0 .028.141c0 0 .926.928.926.928 0 0 .149 0 .149 0 0 0 .926-.928.926-.928a.125.125 0 0 0 0-.182.131.131 0 0 0-.182 0c0 0-.692.696-.692.696 0 0 0-1.75 0-1.75z"/>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="140">

    <defs>

      <clipPath id="i">

        <use fill="#fff" href="#h"/>

      </clipPath>

    </defs>

    <path stroke-linecap="round" stroke="context-fill" d="M4.869 16.933A8.624 8.624 0 0 1 9.875 1.376M10 1.375a8.623 8.623 0 0 1 7.542 4.437" fill="none" stroke-width="1.15"/>

    <path fill="context-stroke" d="M9.296 8.65a.076.076 0 0 0-.025-.047.078.078 0 0 0-.051-.02.078.078 0 0 0-.077.067c0 0 0 1.033 0 1.033 0 0-.404-.41-.404-.41a.077.077 0 0 0-.125.024.075.075 0 0 0 .017.083c0 0 .547.548.547.548 0 0 .088 0 .088 0 0 0 .546-.548.546-.548a.074.074 0 0 0 0-.107.077.077 0 0 0-.107 0c0 0-.409.41-.409.41 0 0 0-1.033 0-1.033z"/>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="160">

    <defs>

      <clipPath id="j">

        <use fill="#fff" href="#h"/>

      </clipPath>

    </defs>

    <path stroke-linecap="round" stroke="context-fill" d="M4.869 16.933A8.624 8.624 0 0 1 9.875 1.376M10 1.375A8.624 8.624 0 0 1 18.625 10c0 1.918-.626 3.69-1.685 5.122" fill="none" stroke-width="1.15"/>

    <path fill="context-stroke" d="M9.247 9.02a.043.043 0 0 0-.014-.028.044.044 0 0 0-.03-.011.044.044 0 0 0-.042.038c0 0 0 .585 0 .585 0 0-.23-.233-.23-.233a.044.044 0 0 0-.07.014.043.043 0 0 0 .01.047c0 0 .309.31.309.31 0 0 .05 0 .05 0 0 0 .31-.31.31-.31a.042.042 0 0 0 0-.06.044.044 0 0 0-.062 0c0 0-.23.232-.23.232 0 0 0-.585 0-.585z"/>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="180">

    <defs>

      <clipPath id="k">

        <use fill="#fff" href="#h"/>

      </clipPath>

    </defs>

    <path stroke-linecap="round" stroke="context-fill" d="M4.869 16.933A8.624 8.624 0 0 1 9.875 1.376M10 1.375A8.624 8.624 0 0 1 18.625 10a8.626 8.626 0 0 1-5.747 8.133" fill="none" stroke-width="1.15"/>

    <g clip-path="url(#k)">

      <use fill="context-fill" href="#tray"/>

    </g>

    <path fill="context-stroke" d="M9.216 9.254a.022.022 0 0 0-.008-.014.023.023 0 0 0-.014-.006.023.023 0 0 0-.022.02c0 0 0 .3 0 .3 0 0-.118-.12-.118-.12a.022.022 0 0 0-.036.007.022.022 0 0 0 .005.024c0 0 .158.16.158.16 0 0 .026 0 .026 0 0 0 .158-.16.158-.16a.021.021 0 0 0 0-.031.022.022 0 0 0-.03 0c0 0-.12.12-.12.12 0 0 0-.3 0-.3z"/>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="200">

    <path stroke-linecap="round" stroke="context-fill" d="M4.869 16.933A8.624 8.624 0 0 1 9.875 1.376M10 1.375A8.624 8.624 0 0 1 18.625 10a8.624 8.624 0 0 1-8.865 8.622" fill="none" stroke-width="1.15"/>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="220">

    <defs>

      <clipPath id="m">

        <use fill="#fff" href="#h"/>

      </clipPath>

    </defs>

    <path stroke-linecap="round" stroke="context-fill" d="M4.869 16.933A8.624 8.624 0 0 1 9.875 1.376M10 1.375A8.624 8.624 0 0 1 18.625 10 8.624 8.624 0 0 1 10 18.625c-.8 0-1.574-.11-2.31-.313" fill="none" stroke-width="1.15"/>

    <g clip-path="url(#m)">

      <use fill="context-fill" href="#tray"/>

    </g>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="240">

    <path stroke-linecap="round" stroke="context-fill" d="M4.869 16.933A8.624 8.624 0 0 1 9.875 1.376M10 1.375A8.624 8.624 0 0 1 18.625 10 8.624 8.624 0 0 1 10 18.625a8.582 8.582 0 0 1-3.633-.8" fill="none" stroke-width="1.15"/>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="260">

    <path stroke-linecap="round" stroke="context-fill" d="M4.869 16.933A8.624 8.624 0 0 1 9.875 1.376M10 1.375A8.624 8.624 0 0 1 18.625 10 8.624 8.624 0 0 1 10 18.625a8.578 8.578 0 0 1-4.444-1.232" fill="none" stroke-width="1.15"/>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="280">

    <path stroke-linecap="round" stroke="context-fill" d="M4.869 16.933A8.624 8.624 0 0 1 9.875 1.376M10 1.375A8.624 8.624 0 0 1 18.625 10 8.624 8.624 0 0 1 10 18.625a8.586 8.586 0 0 1-4.912-1.534" fill="none" stroke-width="1.15"/>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="300">

    <use stroke-linecap="round" stroke="context-fill" fill="none" stroke-width="1.15" href="#q"/>

  </svg>

  <svg viewBox="0 0 20 20" width="20" height="20" x="320">

    <use stroke-linecap="round" stroke="context-fill" fill="none" stroke-width="1.15" href="#q"/>

  </svg>

</svg>

Source code

Revision control

Copy as Markdown

Other Tools

SVG Preview (Scaled)