SWELLで使える!動くアイコン 一覧【SVG】

SWELLやArkheで使える!動くアイコンをご紹介いたします。
SVGタグで簡単にアニメーション付きアイコンが使用できます。

編集画面でも表示され、とても使いやすいためSWELLユーザー必見です。

Contents

動くアイコン(SVGタグ)
の使い方

STEP
使用したいアイコンを見つける

使用したいアイコンをタップして詳細画面へ移動しよう!

STEP
SVGタグをコピーする

SVGタグ(コード)をコピーしてください。
(コード右端をクリックするとコピーボタンが表示され、簡単にコピーできます)

STEP

投稿編集画面にて「インラインアイコン機能」をクリック

下のボックス欄に先ほどコピーしたSVGタグをペーストし、「決定」をクリック

STEP
アイコン表示完了

以上の手順でアイコンが表示されます。

SWELLでアイコンを使用する場合、色がうまく表示されない場合がありますのでご注意ください。

動くアイコン 一覧

アイコンをクリックでSVG タグを取得できます

Basic

Emojis

Notifications

Celebrate

Branding

Communication

Devices

Christmas

アイコンSVGタグ 一覧

Archive

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes slide-top{0%{transform:translateY(1px)}to{transform:translateY(-2px)}}</style><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M6 8.55v8.334c0 .92.768 1.667 1.714 1.667h8.572c.947 0 1.714-.746 1.714-1.667V8.551m-7 2.899h2"/><path fill="#265BFF" fill-rule="evenodd" d="M4.087 5.45H3.87a.533.533 0 00-.533.532v.967c0 .295.238.533.533.533h16.26a.533.533 0 00.533-.533v-.967a.533.533 0 00-.533-.533H4.087z" clip-rule="evenodd" style="animation:slide-top 1s cubic-bezier(.86,0,.07,1) infinite alternate-reverse both"/></svg>

Article

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style> @keyframes check {
      to {
        stroke-dashoffset: 0;
      }
    }</style><rect width="10" height="14" x="7" y="5" stroke="#0A0A30" stroke-width="1.5" rx="1"/><path stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M10 8.973h4m-4 3.64h2" style="animation:check 3s infinite cubic-bezier(.99,-.1,.01,1.02)" stroke-dashoffset="100" stroke-dasharray="100"/></svg>

Bookmark

 <svg viewBox="0 0 24 24" width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><style>@keyframes add{0%,80%,to{opacity:0}10%{opacity:1}}</style><path d="M7 5.61a1 1 0 011-1h8a1 1 0 011 1v12.77a.5.5 0 01-.803.398l-3.603-2.745a1 1 0 00-1.214.002l-3.576 2.739A.5.5 0 017 18.377V5.61z" stroke="#0A0A30" stroke-width="1.5"/><path d="M10.335 9h3.33" stroke="#265BFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path d="M12 7.335v3.33" stroke="#265BFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" style="animation:add 2s cubic-bezier(.5,.52,.21,.43) infinite alternate both"/></svg>

Chart

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes slide-tr{0%{transform:translateY(0) translateX(0)}to{transform:translateY(-2px) translateX(2px)}}</style><path stroke="#0A0A30" stroke-width="1.5" d="M17.82 16.889a7 7 0 001.162-3.39A.473.473 0 0018.5 13h-6a.5.5 0 01-.5-.5v-6a.473.473 0 00-.5-.482 7 7 0 106.32 10.871z"/><path stroke="#265BFF" stroke-width="1.5" d="M19 11c.552 0 1.009-.45.917-.995a6 6 0 00-4.922-4.922C14.451 4.992 14 5.448 14 6v4a1 1 0 001 1h4z" style="animation:slide-tr 1s cubic-bezier(.47,0,.745,.715) infinite alternate-reverse both"/></svg>

Check Circle

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes check {
      to {
        stroke-dashoffset: 0;
      }
    }</style><circle cx="12" cy="12" r="8" stroke="#0A0A30" stroke-width="1.5"/><path stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M9.215 12.052l1.822 1.805 3.748-3.714" style="animation:check 2s infinite cubic-bezier(.99,-.1,.01,1.02)" stroke-dashoffset="100" stroke-dasharray="100"/></svg>

Check Square

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes check {
      to {
        stroke-dashoffset: 0;
      }
    }</style><rect width="16" height="16" x="4" y="4" stroke="#0A0A30" stroke-width="1.5" rx="2.075"/><path stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M9.215 12.052l1.822 1.805 3.748-3.714" style="animation:check 2s infinite cubic-bezier(.99,-.1,.01,1.02)" stroke-dashoffset="100" stroke-dasharray="100"/></svg>

Check

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes check {
      to {
        stroke-dashoffset: 0;
      }
    }</style><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M5.387 12.68l3.955 3.956 9.271-9.272" style="animation:check 2s infinite cubic-bezier(.99,-.1,.01,1.02)" stroke-dashoffset="100" stroke-dasharray="100"/></svg>

Clock Circle

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}</style><rect width="16" height="16" x="4" y="4" stroke="#0A0A30" stroke-width="1.5" rx="8"/><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M12.021 12l2.325 2.325"/><path stroke="#265BFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12.021 12V6.84" style="animation:rotate 2s linear infinite both;transform-origin:center"/></svg>

Clock Square

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
  <style>
.rotate {
	animation: rotate 2s linear infinite both;
  transform-origin: center;
}
@keyframes rotate {
  0% {
    transform: rotate(0);
   }
  100% {
    transform: rotate(360deg);
   }
}
</style>
  <rect width="16" height="16" x="4" y="4" stroke="#0A0A30" stroke-width="1.5" rx="2.075"/>
  <path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M12.021 12l2.325 2.325"/>
  <path class="rotate" stroke="#265BFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12.021 12V6.84"/>
</svg>

Close Square

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes blink-1{0%,50%,to{opacity:1}25%{opacity:0}}</style><rect width="16" height="16" x="4" y="4" stroke="#0A0A30" stroke-width="1.5" rx="2.075"/><path fill="#265BFF" d="M10.242 9.18a.75.75 0 00-1.061 1.062l1.79 1.79-1.79 1.79a.75.75 0 001.06 1.06l1.79-1.79 1.79 1.79a.75.75 0 001.062-1.06l-1.79-1.79 1.79-1.79a.75.75 0 10-1.061-1.061l-1.79 1.79-1.79-1.79z" style="animation:blink-1 2s steps(1,end) infinite both"/></svg>

Cloud Done

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes check {
      to {
        stroke-dashoffset: 0;
      }
    }</style><path stroke="#0A0A30" stroke-width="1.5" d="M7.059 11.765A3.059 3.059 0 004 14.824c0 .461.42.774.882.774h14.236c.461 0 .882-.313.882-.774a3.06 3.06 0 00-3.059-3.06.182.182 0 01-.175-.132 4.943 4.943 0 00-9.532 0 .182.182 0 01-.175.133z"/><path stroke="#265BFF" stroke-linecap="round" stroke-width="1.26" d="M10.248 12.033l1.146 1.135 2.358-2.336" style="animation:check 2s infinite cubic-bezier(.99,-.1,.01,1.02)" stroke-dashoffset="100" stroke-dasharray="100"/></svg>

Cloud Download

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes slide-right{0%{transform:translateY(0)}to{transform:translateY(1px)}}</style><path fill="#0A0A30" d="M7.77 9.87l.724.2-.723-.2zm8.46 0l.723-.197-.724.198zm-7.198 4.27a.75.75 0 000-1.5v1.5zm5.982-1.5a.75.75 0 100 1.5v-1.5zm-9.363.063c0-1.085.88-1.964 1.964-1.964v-1.5a3.464 3.464 0 00-3.464 3.464h1.5zm1.964-1.964a.911.911 0 00.88-.67l-1.447-.396a.589.589 0 01.567-.434v1.5zm.88-.67A3.637 3.637 0 0112 7.398v-1.5a5.137 5.137 0 00-4.952 3.775l1.446.396zM12 7.398a3.636 3.636 0 013.506 2.671l1.447-.396A5.137 5.137 0 0012 5.898v1.5zm3.506 2.671c.11.402.475.67.879.67v-1.5c.259 0 .496.171.567.434l-1.446.396zm.879.67c1.085 0 1.964.879 1.964 1.964h1.5a3.464 3.464 0 00-3.464-3.464v1.5zM5.684 14.14h3.348v-1.5H5.684v1.5zm9.33 0h3.302v-1.5h-3.301v1.5zm3.335-1.438c0-.014.004-.034.013-.053a.083.083 0 01.018-.025c.001-.001-.004.003-.017.008a.146.146 0 01-.047.008v1.5c.692 0 1.533-.493 1.533-1.438h-1.5zm-14.198 0c0 .945.842 1.438 1.533 1.438v-1.5a.145.145 0 01-.047-.008c-.013-.005-.018-.009-.017-.008a.114.114 0 01.031.078h-1.5z"/><path fill="#265BFF" d="M12.566 12a.566.566 0 10-1.132 0h1.132zm-1.132 4.53a.566.566 0 001.132 0h-1.132zm-.921-1.91a.566.566 0 10-.801.8l.8-.8zM12 16.908l-.4.4c.22.222.58.222.8 0l-.4-.4zm2.288-1.487a.566.566 0 10-.8-.801l.8.8zM11.434 12v4.53h1.132V12h-1.132zm-1.722 3.42l1.888 1.888.8-.8-1.887-1.888-.801.8zm2.688 1.888l1.888-1.887-.8-.801-1.888 1.888.8.8z" style="animation:slide-right .5s cubic-bezier(1,-.43,.68,.57) infinite alternate both"/></svg>

Cloud Upload

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes slide-right{0%{transform:translateY(0)}to{transform:translateY(-1px)}}</style><path fill="#0A0A30" d="M7.77 9.87l.724.2-.723-.2zm8.46 0l.723-.197-.724.198zm-7.198 4.27a.75.75 0 000-1.5v1.5zm5.982-1.5a.75.75 0 100 1.5v-1.5zm-9.363.063c0-1.085.88-1.964 1.964-1.964v-1.5a3.464 3.464 0 00-3.464 3.464h1.5zm1.964-1.964a.911.911 0 00.88-.67l-1.447-.396a.589.589 0 01.567-.434v1.5zm.88-.67A3.637 3.637 0 0112 7.398v-1.5a5.137 5.137 0 00-4.952 3.775l1.446.396zM12 7.398a3.636 3.636 0 013.506 2.671l1.447-.396A5.137 5.137 0 0012 5.898v1.5zm3.506 2.671c.11.402.475.67.879.67v-1.5c.259 0 .496.171.567.434l-1.446.396zm.879.67c1.085 0 1.964.879 1.964 1.964h1.5a3.464 3.464 0 00-3.464-3.464v1.5zM5.684 14.14h3.348v-1.5H5.684v1.5zm9.33 0h3.302v-1.5h-3.301v1.5zm3.335-1.438c0-.014.004-.034.013-.053a.083.083 0 01.018-.025c.001-.001-.004.003-.017.008a.146.146 0 01-.047.008v1.5c.692 0 1.533-.493 1.533-1.438h-1.5zm-14.198 0c0 .945.842 1.438 1.533 1.438v-1.5a.145.145 0 01-.047-.008c-.013-.005-.018-.009-.017-.008a.114.114 0 01.031.078h-1.5z"/><path fill="#265BFF" d="M12.566 14.927a.566.566 0 11-1.132 0h1.132zm-1.132-4.53a.566.566 0 011.132 0h-1.132zm-.921 1.91a.566.566 0 11-.801-.8l.8.8zM12 10.02l-.4-.4a.566.566 0 01.8 0l-.4.4zm2.288 1.487a.566.566 0 11-.8.801l.8-.8zm-2.854 3.421v-4.53h1.132v4.53h-1.132zm-1.722-3.42l1.888-1.89.8.8-1.887 1.888-.801-.8zm2.688-1.89l1.888 1.887-.8.801L11.6 10.42l.8-.801z" style="animation:slide-right .5s cubic-bezier(1,-.43,.68,.57) infinite alternate both"/></svg>

Compass

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes rotate{0%{transform:rotateZ(0)}to{transform:rotateZ(90deg)}}</style><g style="animation:rotate 3s cubic-bezier(.7,-.03,.43,.72) both infinite alternate-reverse;transform-origin:center center"><path stroke="#0A0A30" stroke-width="1.5" d="M12 20a8 8 0 100-16 8 8 0 000 16z"/><path fill="#265BFF" fill-rule="evenodd" d="M14.246 9.033l-.516 3.97-3.18 2.431a.5.5 0 01-.8-.461l.516-3.97 3.18-2.431a.5.5 0 01.8.461zM12 13a1 1 0 100-2 1 1 0 000 2z" clip-rule="evenodd"/></g></svg>

Cut

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
  <style>
      .cut-sc {
    animation: cut-sc 1s cubic-bezier(1, -0.28, 0.01, 1.13) infinite alternate-reverse both;
    transform-origin: center center;

}
@keyframes cut-sc {
 0% {
    transform: rotate(0);
   }
  100% {
    transform: rotate(-20deg);
  }
}
   .cut-sc-2 {
    animation: cut-sc-2 1s cubic-bezier(1, -0.28, 0.01, 1.13) infinite alternate-reverse both;
    transform-origin: center center;

}
@keyframes cut-sc-2 {
 0% {
    transform: rotate(0);
   }
  100% {
    transform: rotate(20deg);
  }
}
  </style>
  <g class="cut-sc">
  <path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M10.025 10.025l7.9 7.9"/>
  <circle cx="8.05" cy="8.05" r="2.043" stroke="#265BFF" stroke-width="1.5" transform="rotate(45 8.05 8.05)"/>
  </g>
  <g class="cut-sc-2">
    <path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M10.025 13.975l7.9-7.9"/>
    <circle r="2.043" stroke="#265BFF" stroke-width="1.5" transform="scale(1 -1) rotate(45 23.279 1.742)"/>
  </g>
</svg>

Discount

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes rotate{0%{transform:rotateZ(0)}to{transform:rotateZ(360deg)}}</style><path stroke="#0A0A30" stroke-width="1.5" d="M10.524 4.614a2 2 0 012.952 0l.459.502a2 2 0 001.565.648l.68-.03a2 2 0 012.087 2.087l-.03.68a2 2 0 00.648 1.564l.501.46a2 2 0 010 2.95l-.502.46a2 2 0 00-.648 1.565l.03.68a2 2 0 01-2.086 2.087l-.68-.03a2 2 0 00-1.565.648l-.46.501a2 2 0 01-2.95 0l-.46-.502a2 2 0 00-1.565-.648l-.68.03a2 2 0 01-2.087-2.086l.03-.68a2 2 0 00-.647-1.565l-.502-.46a2 2 0 010-2.95l.502-.46A2 2 0 005.764 8.5l-.03-.68A2 2 0 017.82 5.734l.68.03a2 2 0 001.564-.647l.46-.502z" style="animation:rotate 2s linear both infinite;transform-origin:center center"/><path stroke="#265BFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M13.873 10.004l-3.746 3.992"/><circle cx="10.127" cy="10.004" r="1.074" fill="#265BFF"/><circle cx="13.873" cy="13.995" r="1.074" fill="#265BFF"/></svg>

Download

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<style>
      .slide {
	animation: slide-right 0.5s cubic-bezier(1,-0.43, 0.68, 0.57) infinite alternate both;
}
@keyframes slide-right {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(1px);
  }
}
</style>
  <circle cx="12" cy="12" r="8" stroke="#0A0A30" stroke-width="1.5"/>
  <path class="slide" fill="#265BFF" d="M12.75 8.75a.75.75 0 00-1.5 0h1.5zm-1.5 6a.75.75 0 001.5 0h-1.5zm-1.22-2.53a.75.75 0 10-1.06 1.06l1.06-1.06zM12 15.25l-.53.53a.75.75 0 001.06 0l-.53-.53zm3.03-1.97a.75.75 0 10-1.06-1.06l1.06 1.06zm-3.78-4.53v6h1.5v-6h-1.5zm-2.28 4.53l2.5 2.5 1.06-1.06-2.5-2.5-1.06 1.06zm3.56 2.5l2.5-2.5-1.06-1.06-2.5 2.5 1.06 1.06z"/>
</svg>

Download 2

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes slide-right{0%{transform:translateY(0)}to{transform:translateY(1px)}}</style><path fill="#265BFF" d="M12.75 6.432a.75.75 0 00-1.5 0h1.5zm-1.5 6a.75.75 0 001.5 0h-1.5zm-1.22-2.53a.75.75 0 10-1.06 1.06l1.06-1.06zm1.97 3.03l-.53.53a.75.75 0 001.06 0l-.53-.53zm3.03-1.97a.75.75 0 00-1.06-1.06l1.06 1.06zm-3.78-4.53v6h1.5v-6h-1.5zm-2.28 4.53l2.5 2.5 1.06-1.06-2.5-2.5-1.06 1.06zm3.56 2.5l2.5-2.5-1.06-1.06-2.5 2.5 1.06 1.06z" style="animation:slide-right .5s cubic-bezier(1,-.43,.68,.57) infinite alternate both"/><path stroke="#0A0A30" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M8 17.274h8"/></svg>

Download 3

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes slide-right{0%{transform:translateY(0)}to{transform:translateY(1px)}}</style><path fill="#265BFF" d="M12.75 6.432a.75.75 0 00-1.5 0h1.5zm-1.5 6a.75.75 0 001.5 0h-1.5zm-1.22-2.53a.75.75 0 10-1.06 1.06l1.06-1.06zm1.97 3.03l-.53.53a.75.75 0 001.06 0l-.53-.53zm3.03-1.97a.75.75 0 00-1.06-1.06l1.06 1.06zm-3.78-4.53v6h1.5v-6h-1.5zm-2.28 4.53l2.5 2.5 1.06-1.06-2.5-2.5-1.06 1.06zm3.56 2.5l2.5-2.5-1.06-1.06-2.5 2.5 1.06 1.06z" style="animation:slide-right .5s cubic-bezier(1,-.43,.68,.57) infinite alternate both"/><path fill="#0A0A30" d="M8.398 15.37a.75.75 0 10-.796 1.27l.796-1.27zm-.319.685l.398-.636-.398.636zm8.327.58a.75.75 0 00-.812-1.26l.812 1.26zm-8.804.006l.08.05.795-1.272-.079-.05-.796 1.272zm.08.05a8.14 8.14 0 008.724-.055l-.812-1.262a6.64 6.64 0 01-7.117.045l-.796 1.271z"/></svg>

Edit

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
  <style>
    .rotate-right {
      animation: rotate-right 1s cubic-bezier(1, -0.01, 0.13, 1.15) infinite alternate-reverse both;
      transform-origin: top center;
    }

    @keyframes rotate-right {
      0% {
        transform: rotate(0);
      }

      25% {
        transform: rotate(10deg);
      }

      50 {
        transform: rotate(0deg);
      }

      100% {
        transform: rotate(-10deg);
      }
    }
  </style>
  <g class="rotate-right">
    <path stroke="#265BFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M9.5 7.307h5" />
    <path stroke="#0A0A30" stroke-width="1.5"
      d="M9 5.5A1.5 1.5 0 0110.5 4h3A1.5 1.5 0 0115 5.5v11.3a1.5 1.5 0 01-.54 1.152l-1.5 1.249a1.5 1.5 0 01-1.92 0l-1.5-1.249A1.5 1.5 0 019 16.8V5.5z" />
  </g>
</svg>

Eye

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
  <style>
    .eye-1 {
      animation: eye 2.4s infinite;
    }

    .eye-2 {
      animation: squeeze 2.4s infinite;
    }

    @keyframes eye {
      90% {
        transform: none;
        animation-timing-function: ease-in;
      }

      93% {
        transform: translateY(15px) scaleY(0)
      }

      100% {
        animation-timing-function: ease-out;
      }
    }

    @keyframes squeeze {
      90% {
        transform: none;
        animation-timing-function: ease-in;
      }

      93% {
        transform: translateY(3px) scaleY(0.8)
      }

      100% {
        animation-timing-function: ease-out;
      }
    }
  </style>
  <path class="eye-1" stroke="#0A0A30" stroke-width="1.5"
    d="M19.195 11.31c.325.41.325.97 0 1.38-1.114 1.4-3.916 4.45-7.195 4.45-3.28 0-6.08-3.05-7.195-4.45a1.097 1.097 0 010-1.38C5.92 9.91 8.721 6.86 12 6.86c3.28 0 6.08 3.05 7.195 4.45z" />
  <circle class="eye-2" cx="12" cy="12" r="1.972" stroke="#265BFF" stroke-width="1.5" />
</svg>

Eye Off

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
  <style>
.eye-off {
       animation: eye-off 2s infinite cubic-bezier(0.99, -0.1, 0.01, 1.02) alternate;  
      stroke-dashoffset: 100;
      stroke-dasharray: 100;
    }

    @keyframes eye-off {
      to {
        stroke-dashoffset: 0;
      }
    }
</style>
  <path stroke="#0A0A30" stroke-width="1.5" d="M19.195 11.31c.325.41.325.97 0 1.38-1.114 1.4-3.916 4.45-7.195 4.45-3.28 0-6.08-3.05-7.195-4.45a1.097 1.097 0 010-1.38C5.92 9.91 8.721 6.86 12 6.86c3.28 0 6.08 3.05 7.195 4.45z"/>
  <circle cx="12" cy="12" r="1.972" stroke="#0A0A30" stroke-width="1.5"/>
  <path class="eye-off" stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M18.514 5.487L5.487 18.514"/>
</svg>

Flash

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes splash{0%{transform:scale(.2);opacity:.8}80%{transform:scale(1.2);opacity:0}to{transform:scale(2.2);opacity:0}}</style><path fill="#0A0A30" d="M13.295 10.769l2.552-5.787-7.979 7.28 3.254.225-3.353 6.362 8.485-7.388-2.959-.692z" style="animation:splash 1.5s cubic-bezier(.165,.84,.44,1) infinite both;transform-origin:center center"/></svg>

Heart

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes pulsate{0%,to{transform:scale(1)}50%{transform:scale(.9)}}</style><g style="animation:pulsate .5s ease-in-out infinite both;transform-origin:center center" stroke-width="1.5"><path stroke="#0A0A30" d="M11.515 6.269l.134.132a.5.5 0 00.702 0l.133-.132A4.44 4.44 0 0115.599 5c.578 0 1.15.112 1.684.33a4.41 4.41 0 011.429.939c.408.402.733.88.954 1.406a4.274 4.274 0 010 3.316 4.331 4.331 0 01-.954 1.405l-6.36 6.259a.5.5 0 01-.702 0l-6.36-6.259A4.298 4.298 0 014 9.333c0-1.15.464-2.252 1.29-3.064A4.439 4.439 0 018.401 5c1.168 0 2.288.456 3.114 1.269z"/><path stroke="#265BFF" stroke-linecap="round" stroke-linejoin="round" d="M15.5 7.5c.802.304 1.862 1.43 2 2"/></g></svg>

Image

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes slide{0%{transform:translateX(0)}to{transform:translateX(5.5px) translateY(-1px)}}</style><path stroke="#0A0A30" stroke-width="1.5" d="M4 8a4 4 0 014-4h8a4 4 0 014 4v8a4 4 0 01-4 4H8a4 4 0 01-4-4V8z"/><path stroke="#0A0A30" stroke-width="1.5" d="M4.221 17.607c.498-.603.767-.816 1.263-1.426.944-1.169 1.58-1.507 2.287-1.21.287.123.575.308.87.503.79.523 1.888 1.24 3.334.461.994-.544 1.57-1.477 2.07-2.286.206-.329.4-.657.627-.954.235-.308 1.107-1.271 2.234-.586.719.432 1.314.915 1.96 1.54.247.24.433.614.55.905.352.88.457 1.372.457 2.488"/><path stroke="#265BFF" stroke-width="1.33" d="M8.647 11.032c.977 0 1.773-.796 1.773-1.773 0-.977-.796-1.773-1.773-1.773-.978 0-1.773.796-1.773 1.773 0 .977.795 1.773 1.773 1.773" style="transform-origin:center;animation:slide 1.5s cubic-bezier(.86,0,.07,1) infinite alternate-reverse both"/></svg>

Input

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes blink{0%,50%,to{opacity:1}25%,75%{opacity:0}}</style><rect width="14" height="8" x="5" y="8" stroke="#0A0A30" stroke-width="1.5" rx="1"/><path stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M7.593 10.2v3.6" style="animation:blink 3s infinite both"/></svg>

Location

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes slide-right{0%{transform:translateY(0)}to{transform:translateY(-2px)}}</style><g style="animation:slide-right 1s cubic-bezier(.75,.02,.2,1.06) infinite alternate both" stroke-width="1.5"><path stroke="#0A0A30" d="M17 10.193c0 2.867-4.5 8.307-5 8.307s-5-5.44-5-8.307C7 7.325 9.239 5 12 5s5 2.325 5 5.193z"/><circle cx="12" cy="10" r="2" stroke="#265BFF"/></g></svg>

Lock

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes lock{0%{transform:translateY(-2px)}to{transform:translateY(0)}}</style><path fill="#265BFF" d="M15.236 10.811a.736.736 0 01-.736-.736V8.811a2.5 2.5 0 00-5 0v5H8v-5a4 4 0 018 0v1.236a.764.764 0 01-.764.764z" style="animation:lock 1s cubic-bezier(1,-.43,0,1.29) both infinite alternate-reverse"/><path fill="#fff" d="M6.6 13.704a3 3 0 013-3h4.8a3 3 0 013 3v3a3 3 0 01-3 3H9.6a3 3 0 01-3-3v-3z"/><path fill="#0A0A30" d="M9.6 11.454h4.8v-1.5H9.6v1.5zm7.05 2.25v3h1.5v-3h-1.5zm-2.25 5.25H9.6v1.5h4.8v-1.5zm-7.05-2.25v-3h-1.5v3h1.5zm2.25 2.25a2.25 2.25 0 01-2.25-2.25h-1.5a3.75 3.75 0 003.75 3.75v-1.5zm7.05-2.25a2.25 2.25 0 01-2.25 2.25v1.5a3.75 3.75 0 003.75-3.75h-1.5zm-2.25-5.25a2.25 2.25 0 012.25 2.25h1.5a3.75 3.75 0 00-3.75-3.75v1.5zm-4.8-1.5a3.75 3.75 0 00-3.75 3.75h1.5a2.25 2.25 0 012.25-2.25v-1.5zm1.543 5.198a.857.857 0 011.714 0v.104a.857.857 0 11-1.714 0v-.104z"/></svg>

Log In

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<style>
      .login {
	animation: login-right 1s cubic-bezier(1, -0.17, 0.29, 0.99) infinite alternate both;
}
@keyframes login-right {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(2px);
  }
}
</style>
  <path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M9.083 14.508V17a2.5 2.5 0 002.5 2.5h5a2.5 2.5 0 002.5-2.5V7a2.5 2.5 0 00-2.5-2.5h-5a2.5 2.5 0 00-2.5 2.5v2.563"/>
  <path class="login" fill="#265BFF" d="M4.917 11.25a.75.75 0 000 1.5v-1.5zm8.66 1.5a.75.75 0 000-1.5v1.5zm-2.552 1.216a.75.75 0 001.054 1.068l-1.054-1.068zM14.083 12l.527.534a.75.75 0 000-1.068l-.527.534zM12.08 8.966a.75.75 0 00-1.054 1.068l1.054-1.068zM4.917 12.75h8.66v-1.5h-8.66v1.5zm7.162 2.284l2.531-2.5-1.054-1.068-2.53 2.5 1.053 1.068zm2.531-3.568l-2.53-2.5-1.055 1.068 2.531 2.5 1.054-1.068z"/>
</svg>

Log Out

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<style>
      .logout {
	animation: logout-right 1s cubic-bezier(1, -0.17, 0.29, 0.99) infinite alternate both;
}
@keyframes logout-right {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(2px);
  }
}
</style>
  <path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M14.5 14.508V17a2.5 2.5 0 01-2.5 2.5H7A2.5 2.5 0 014.5 17V7A2.5 2.5 0 017 4.5h5A2.5 2.5 0 0114.5 7v2.563"/>
  <path class="logout" fill="#265BFF" d="M10.333 12.75a.75.75 0 010-1.5v1.5zm8.66-1.5a.75.75 0 010 1.5v-1.5zm-2.551-1.216a.75.75 0 111.054-1.068l-1.054 1.068zM19.5 12l.527-.534a.75.75 0 010 1.068L19.5 12zm-2.004 3.034a.75.75 0 11-1.054-1.068l1.054 1.068zm-7.163-3.784h8.66v1.5h-8.66v-1.5zm7.163-2.284l2.531 2.5-1.054 1.068-2.531-2.5 1.054-1.068zm2.531 3.568l-2.531 2.5-1.054-1.068 2.531-2.5 1.054 1.068z"/>
</svg>

Mail

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes open{0%{transform:translateX(10px) scale(0);transform-origin:50% 100%}to{transform:scale(1);transform-origin:50% 100%}}</style><rect width="12" height="10" x="6" y="8.804" stroke="#0A0A30" stroke-width="1.5" rx="2"/><path fill="#fff" stroke="#265BFF" stroke-width="1.5" d="M9 6.196a1 1 0 011-1h4a1 1 0 011 1v5.082a1 1 0 01-.37.777l-2.006 1.628a1 1 0 01-1.263-.002l-1.993-1.626A1 1 0 019 11.28V6.196z" style="animation:open 2s cubic-bezier(.49,.39,.35,1.06) both infinite"/><path stroke="#0A0A30" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M8.465 11.413l3.573 2.783 3.497-2.783"/></svg>

Minus

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes bounce{0%{transform:scale3d(1,1,1)}30%{transform:scale3d(1.25,.75,1)}40%{transform:scale3d(.75,1.25,1)}50%{transform:scale3d(1.15,.85,1)}65%{transform:scale3d(.95,1.05,1)}75%{transform:scale3d(1.05,.95,1)}}</style><path fill="#265BFF" fill-rule="evenodd" d="M7.994 12a.75.75 0 01.75-.75h6.512a.75.75 0 010 1.5H8.744a.75.75 0 01-.75-.75z" clip-rule="evenodd" style="animation:bounce 1s 1s infinite both;transform-origin:center center"/><rect width="16" height="16" x="4" y="4" stroke="#0A0A30" stroke-width="1.5" rx="2.075"/></svg>

Plus

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes bounce{0%{transform:scale3d(1,1,1)}30%{transform:scale3d(1.25,.75,1)}40%{transform:scale3d(.75,1.25,1)}50%{transform:scale3d(1.15,.85,1)}65%{transform:scale3d(.95,1.05,1)}75%{transform:scale3d(1.05,.95,1)}}</style><path fill="#265BFF" fill-rule="evenodd" d="M12.75 8.744a.75.75 0 00-1.5 0v2.506H8.744a.75.75 0 000 1.5h2.506v2.506a.75.75 0 001.5 0V12.75h2.506a.75.75 0 000-1.5H12.75V8.744z" clip-rule="evenodd" style="animation:bounce 1s 1s infinite both;transform-origin:center center"/><rect width="16" height="16" x="4" y="4" stroke="#0A0A30" stroke-width="1.5" rx="2.075"/></svg>

Refresh

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes rotate-center{0%{transform:rotate(0)}to{transform:rotate(360deg)}}</style><g style="animation:rotate-center 2s ease-in-out infinite both;transform-origin:center center" stroke-width="1.5"><path stroke="#0A0A30" stroke-linecap="round" d="M15.473 8.41a5 5 0 10.939 5.952"/><path fill="#265BFF" stroke="#265BFF" d="M17.195 10.373l-2.308-.347a.065.065 0 01-.018-.005.023.023 0 01-.007-.005.056.056 0 01-.015-.024.056.056 0 01-.002-.03.03.03 0 01.002-.007.069.069 0 01.013-.015l1.995-1.964a.066.066 0 01.015-.012.027.027 0 01.007-.003.056.056 0 01.029.003c.012.004.02.01.024.015a.027.027 0 01.005.007.069.069 0 01.004.019l.313 2.312a.047.047 0 01-.002.023.053.053 0 01-.013.02.053.053 0 01-.02.012.046.046 0 01-.022.001z"/></g></svg>

Refresh 2

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes rotate-center{0%{transform:rotate(0)}to{transform:rotate(360deg)}}</style><g style="animation:rotate-center 1.5s ease-in-out infinite both;transform-origin:center center" stroke-width="1.5"><path stroke="#0A0A30" stroke-linecap="round" d="M6.883 11.778a5 5 0 018.473-3.597m1.761 4.131a5 5 0 01-8.473 3.597"/><path fill="#265BFF" stroke="#265BFF" d="M17.078 10.145l-2.308-.347a.066.066 0 01-.018-.005.026.026 0 01-.007-.005.056.056 0 01-.015-.024.056.056 0 01-.002-.03l.003-.007a.069.069 0 01.012-.015l1.995-1.964a.064.064 0 01.015-.012.028.028 0 01.007-.003.056.056 0 01.029.003c.012.004.02.01.024.015a.03.03 0 01.005.007.069.069 0 01.004.019l.313 2.312a.046.046 0 01-.015.042.045.045 0 01-.043.014zm-10.156 3.8l2.308.348.018.005a.03.03 0 01.007.005c.004.003.01.011.015.024a.056.056 0 01.002.029.027.027 0 01-.003.007.065.065 0 01-.012.015l-1.995 1.965a.072.072 0 01-.015.012.03.03 0 01-.007.003.056.056 0 01-.029-.003.057.057 0 01-.024-.016.028.028 0 01-.005-.006.066.066 0 01-.004-.019l-.313-2.312a.046.046 0 01.002-.023.053.053 0 01.013-.02.052.052 0 01.02-.012.046.046 0 01.022-.002z"/></g></svg>

Send

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<style>
  .send {
	animation: send 2s cubic-bezier(1, -0.47, 0.01, 1.37) infinite both;
}
@keyframes send {
  0% {
    transform: translateY(0) translateX(0);
  }
  100% {
    transform: translateY(-20px) translateX(20px);
  }
}

</style>
<g class="send">
  <path  stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M9.407 14.593l3.058-3.058"/>
  <path stroke="#0A0A30" stroke-width="1.5" d="M15.564 7.908a.432.432 0 01.528.528l-2.677 10.175a.432.432 0 01-.724.195L5.194 11.31a.432.432 0 01.195-.724l10.175-2.677z"/>
</g>
</svg>

Setting

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes rotate{0%{transform:rotateZ(0)}to{transform:rotateZ(360deg)}}</style><g style="animation:rotate 3s cubic-bezier(.7,-.03,.26,1.05) both infinite;transform-origin:center center" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"><path stroke="#0A0A30" d="M5.262 15.329l.486.842a1.49 1.49 0 002.035.55 1.486 1.486 0 012.036.529c.128.216.197.463.2.714a1.493 1.493 0 001.493 1.536h.979a1.486 1.486 0 001.485-1.493 1.493 1.493 0 011.493-1.471c.252.002.498.071.714.2a1.493 1.493 0 002.036-.55l.521-.857a1.493 1.493 0 00-.542-2.036 1.493 1.493 0 010-2.586c.71-.41.952-1.318.543-2.028l-.493-.85a1.493 1.493 0 00-2.036-.579 1.479 1.479 0 01-2.029-.543 1.428 1.428 0 01-.2-.714c0-.825-.668-1.493-1.492-1.493h-.98c-.82 0-1.488.664-1.492 1.486a1.485 1.485 0 01-1.493 1.493 1.521 1.521 0 01-.714-.2 1.493 1.493 0 00-2.036.542l-.514.858a1.486 1.486 0 00.543 2.035 1.486 1.486 0 01.543 2.036c-.13.226-.317.413-.543.543a1.493 1.493 0 00-.543 2.028v.008z" clip-rule="evenodd"/><path stroke="#265BFF" d="M12.044 10.147a1.853 1.853 0 100 3.706 1.853 1.853 0 000-3.706z"/></g></svg>

Setting 2

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes rotate{0%{transform:rotateZ(0)}to{transform:rotateZ(360deg)}}</style><g style="animation:rotate 2s cubic-bezier(.7,-.03,.26,1.05) both infinite alternate-reverse;transform-origin:center center" stroke-width="1.5"><circle cx="12" cy="12" r="2" stroke="#265BFF"/><path stroke="#0A0A30" d="M19.785 11.515a1 1 0 01-.014.963l-1.703 3-1.778 3.03a1 1 0 01-.863.494H8.484a1 1 0 01-.86-.49l-1.898-3.2-1.578-2.82a1 1 0 01.003-.982l1.832-3.23 1.642-2.79a1 1 0 01.862-.493h6.961a1 1 0 01.846.467l1.774 2.816 1.717 3.234z"/></g></svg>

Share

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes slide-right{0%{transform:translateY(0)}to{transform:translateY(-2px)}}</style><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M14.508 9.5H17a2.5 2.5 0 012.5 2.5v5a2.5 2.5 0 01-2.5 2.5H7A2.5 2.5 0 014.5 17v-5A2.5 2.5 0 017 9.5h2.563"/><path fill="#265BFF" d="M12.75 13.667a.75.75 0 01-1.5 0h1.5zm-1.5-8.66a.75.75 0 011.5 0h-1.5zm-1.216 2.551a.75.75 0 11-1.068-1.054l1.068 1.054zM12 4.5l-.534-.527a.75.75 0 011.068 0L12 4.5zm3.034 2.004a.75.75 0 11-1.068 1.054l1.068-1.054zm-3.784 7.163v-8.66h1.5v8.66h-1.5zM8.966 6.504l2.5-2.531 1.068 1.054-2.5 2.531-1.068-1.054zm3.568-2.531l2.5 2.531-1.068 1.054-2.5-2.531 1.068-1.054z" style="animation:slide-right 1s cubic-bezier(1,-.17,.29,.99) infinite alternate both"/></svg>

Shield Check

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes check {
      to {
        stroke-dashoffset: 0;
      }
    }</style><path stroke="#0A0A30" stroke-width="1.5" d="M5.9 8.053a2 2 0 011.507-1.938l4.683-1.192 4.517 1.184A2 2 0 0118.1 8.042v3.75a7 7 0 01-3.98 6.314l-.755.361a3 3 0 01-2.557.015l-.856-.398A7 7 0 015.9 11.736V8.053z"/><path stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M9.215 12.052l1.822 1.805 3.748-3.714" style="animation:check 2s infinite cubic-bezier(.99,-.1,.01,1.02)" stroke-dashoffset="100" stroke-dasharray="100"/></svg>

Slider

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
 <style>
  .sliders {
	animation: sliders 1.5s cubic-bezier(0.860, 0.000, 0.070, 1.000) infinite alternate both;
}
@keyframes sliders {
  0% {
    transform: translateX(0px); 
  }
  100% {
    transform: translateX(10px); 
  }
}
  .sliders-2 {
	animation: sliders-2 1.5s cubic-bezier(0.860, 0.000, 0.070, 1.000) infinite alternate both;
}
@keyframes sliders-2 {
  0% {
    transform: translateX(0px); 
  }
  100% {
    transform: translateX(-10px); 
  }
}
</style>
  <path stroke="#000" stroke-linecap="round" stroke-width="1.5" d="M6 8.746h12M6 15.317h12"/>
  <circle class="sliders" cx="7.5" cy="8.746" r="1.5" fill="#265BFF" stroke="#265BFF" stroke-width="1.5"/>
  <circle class="sliders-2" cx="16.5" cy="15.254" r="1.5" fill="#265BFF" stroke="#265BFF" stroke-width="1.5"/>
</svg>

Star

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes jello{0%,to{transform:scale3d(1,1,1)}30%{transform:scale3d(1.25,.75,1)}40%{transform:scale3d(.75,1.25,1)}50%{transform:scale3d(1.15,.85,1)}65%{transform:scale3d(.95,1.05,1)}75%{transform:scale3d(1.05,.95,1)}}</style><path stroke="#0A0A30" stroke-width="1.5" d="M11.081 5.141c.347-.807 1.491-.807 1.838 0l1.274 2.97a1 1 0 00.828.601l3.218.295c.875.08 1.229 1.168.568 1.748l-2.43 2.13a1 1 0 00-.316.972l.714 3.152c.194.857-.732 1.53-1.487 1.08l-2.776-1.653a1 1 0 00-1.024 0l-2.776 1.653c-.755.45-1.681-.223-1.487-1.08l.715-3.152a1 1 0 00-.317-.973l-2.43-2.13c-.66-.579-.307-1.667.568-1.747l3.218-.295a1 1 0 00.828-.601l1.274-2.97z" style="animation:jello 1s both infinite cubic-bezier(.69,.34,.09,.6);transform-origin:center"/></svg>

Stopwatch

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}</style><rect width="13.262" height="13.262" x="5.369" y="6.554" stroke="#0A0A30" stroke-width="1.5" rx="6.631"/><path stroke="#265BFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12.018 13.185V8.908" style="animation:rotate 1s cubic-bezier(.73,.07,.57,.68) infinite both;transform-origin:50% 55%"/><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M10.5 4.185h3"/></svg> <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}</style><rect width="13.262" height="13.262" x="5.369" y="6.554" stroke="#0A0A30" stroke-width="1.5" rx="6.631"/><path stroke="#265BFF" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12.018 13.185V8.908" style="animation:rotate 1s cubic-bezier(.73,.07,.57,.68) infinite both;transform-origin:50% 55%"/><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M10.5 4.185h3"/></svg>

Toggle

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<style>
  .toggle {
	animation: toggle 1.5s cubic-bezier(0.860, 0.000, 0.070, 1.000) infinite alternate-reverse both;
}
@keyframes toggle {
  0% {
    transform: translateX(0px);
    fill: none;
  }
  100% {
    transform: translateX(5.5px);
    fill: #265BFF;
  }
}
</style>
  <rect width="16" height="10" x="4" y="7" stroke="#0A0A30" stroke-width="1.5" rx="5"/>
  <circle class="toggle" cx="9" cy="12" r="2" stroke="#265BFF" stroke-width="1.5"/>
</svg>

Trash

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes rotate-tr{0%{transform:rotate(0)}to{transform:rotate(20deg)}}</style><path fill="#0A0A30" d="M16.773 10.083a.75.75 0 00-1.49-.166l1.49.166zm-1.535 7.027l.745.083-.745-.083zm-6.198 0l-.745.083.745-.083zm-.045-7.193a.75.75 0 00-1.49.166l1.49-.166zm5.249 7.333h-4.21v1.5h4.21v-1.5zm1.038-7.333l-.79 7.11 1.491.166.79-7.11-1.49-.166zm-5.497 7.11l-.79-7.11-1.49.166.79 7.11 1.49-.165zm.249.223a.25.25 0 01-.249-.222l-1.49.165a1.75 1.75 0 001.739 1.557v-1.5zm4.21 1.5c.892 0 1.64-.67 1.74-1.557l-1.492-.165a.25.25 0 01-.248.222v1.5z"/><path fill="#265BFF" fill-rule="evenodd" d="M11 6a1 1 0 00-1 1v.25H7a.75.75 0 000 1.5h10a.75.75 0 000-1.5h-3V7a1 1 0 00-1-1h-2z" clip-rule="evenodd" style="animation:rotate-tr 1s cubic-bezier(1,-.28,.01,1.13) infinite alternate-reverse both;transform-origin:right center"/></svg>

User

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
<style>
  .user-1 {
	animation: user-1 1s cubic-bezier(0.83, -0.07, 0, 1.04) both infinite alternate-reverse;
}
@keyframes user-1 {
  0% {
    transform: translateY(0) translateX(0);
  }
  100% {
    transform: translateY(-1px) translateX(-2px);
  }
}
</style>
  <circle class="user-1" cx="12" cy="8.245" r="2.5" stroke="#265BFF" stroke-width="1.5"/>
  <ellipse cx="12" cy="15.926" stroke="#0A0A30" stroke-width="1.5" rx="5" ry="2.329"/>
</svg>

User 2

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
  <style>
  .user-2 {
	animation: user-2 1s cubic-bezier(0.83, -0.07, 0, 1.04) both infinite alternate-reverse;
}
@keyframes user-2 {
  0% {
    transform: translateY(0) translateX(0);
  }
  100% {
    transform: translateY(-1px) translateX(2px);
  }
}
</style>
  <circle class="user-2" cx="12" cy="7.858" r="2.5" stroke="#265BFF" stroke-width="1.5"/>
  <rect width="10" height="4" x="7" y="13.926" stroke="#0A0A30" stroke-width="1.5" rx="2"/>
</svg>

Zoom In

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes scale-in-center{0%{transform:scale(0);opacity:1}to{transform:scale(1);opacity:1}}</style><g style="animation:scale-in-center 2s cubic-bezier(.25,.46,.45,.94) infinite both;transform-origin:center" stroke-width="1.5"><path stroke="#265BFF" stroke-linecap="round" stroke-linejoin="round" d="M11.5 9v4m-2-2h4"/><rect width="12" height="12" x="5.5" y="5" stroke="#0A0A30" rx="6"/><path stroke="#0A0A30" stroke-linecap="round" d="M15.5 16l3 3"/></g></svg>

Zoom Out

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes scale-out-center{0%{transform:scale(1);opacity:1}to{transform:scale(0);opacity:1}}</style><g style="animation:scale-out-center 2s cubic-bezier(.55,.085,.68,.53) infinite both;transform-origin:center" stroke-width="1.5"><path stroke="#265BFF" stroke-linecap="round" stroke-linejoin="round" d="M9.5 11h4"/><rect width="12" height="12" x="5.5" y="5" stroke="#0A0A30" rx="6"/><path stroke="#0A0A30" stroke-linecap="round" d="M15.5 16l3 3"/></g></svg>

Loader 13

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes loader13-1{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes loader13-2{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}</style><path stroke="#0A0A30" stroke-width=".8" d="M7.157 7.157h10v10h-10z" style="animation:loader13-1 3s linear infinite both;transform-origin:center center"/><path stroke="#265BFF" stroke-width=".8" d="M12 5.151l7.071 7.071L12 19.293l-7.071-7.071z" style="animation:loader13-2 3s linear infinite both;transform-origin:center center"/></svg>

Play Loader

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes loader15{0%{transform:scale(.2);opacity:.8}80%{transform:scale(1.2);opacity:0}to{transform:scale(2.2);opacity:0}}</style><circle cx="12" cy="12" r="6" fill="#0A0A30" style="animation:loader15 1.5s cubic-bezier(.165,.84,.44,1) infinite both;transform-origin:center center"/><path fill="#265BFF" fill-rule="evenodd" d="M13.41 11.591a.5.5 0 010 .817l-1.73 1.222a.5.5 0 01-.788-.409v-2.442a.5.5 0 01.789-.409l1.729 1.222z" clip-rule="evenodd"/></svg>

Loader 8

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes loader8{0%{transform:scale(1) rotateZ(0)}50%{transform:scale(1.5) rotateZ(180deg)}to{transform:scale(1) rotateZ(360deg)}}</style><g style="animation:loader8 1s cubic-bezier(.72,.08,.38,.87) infinite both;transform-origin:center"><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M12.035 8v8M16 12H8"/><circle cx="12" cy="12" r="1.635" fill="#265BFF"/></g></svg>

Happy

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes happy{0%{stroke-dashoffset:0}to{stroke-dashoffset:200}}</style><circle cx="12.735" cy="12" r="7" stroke="#0A0A30" stroke-width="1.5"/><circle cx="9.735" cy="10.277" r="1" fill="#0A0A30"/><circle cx="15.735" cy="10.277" r="1" fill="#0A0A30"/><path stroke="#265BFF" stroke-linecap="round" d="M15.735 14.147l-.049.04a4.631 4.631 0 01-5.951-.04" style="animation:happy 3s infinite linear" stroke-dasharray="100"/></svg>

Love

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes love-face{0%,to{transform:scale(.9)}50%{transform:scale(1.2)}}</style><circle cx="12.867" cy="12" r="7" stroke="#0A0A30" stroke-width="1.5"/><path stroke="#0A0A30" stroke-linecap="round" d="M15.867 14.147l-.048.04a4.631 4.631 0 01-5.952-.04"/><path fill="#265BFF" d="M9.792 9.65c.042.042.11.042.151 0a.694.694 0 011.122.22.667.667 0 01-.149.738l-.698.687a.5.5 0 01-.701 0l-.698-.687a.672.672 0 010-.957.694.694 0 01.973 0zm6 0c.042.042.11.042.151 0a.694.694 0 011.122.22.667.667 0 01-.149.738l-.698.687a.5.5 0 01-.701 0l-.698-.687a.672.672 0 010-.957.693.693 0 01.973 0z" style="animation:love-face 1s ease-in-out infinite both;transform-origin:center center"/></svg>

Neutral

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes neutral{0%{stroke-dashoffset:0}to{stroke-dashoffset:150}}</style><circle cx="12.867" cy="12" r="7" stroke="#0A0A30" stroke-width="1.5"/><circle cx="9.867" cy="10.277" r="1" fill="#0A0A30"/><circle cx="15.867" cy="10.277" r="1" fill="#0A0A30"/><path stroke="#265BFF" stroke-linecap="round" d="M9.867 14.147h6" style="animation:neutral 3s infinite linear alternate-reverse" stroke-dasharray="100"/></svg>

Sad

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes sad{0%{stroke-dashoffset:0}to{stroke-dashoffset:200}}</style><circle cx="12" cy="12" r="7" stroke="#0A0A30" stroke-width="1.5"/><circle cx="9" cy="10.277" r="1" fill="#0A0A30"/><circle cx="15" cy="10.277" r="1" fill="#0A0A30"/><path stroke="#265BFF" stroke-linecap="round" d="M15 15.25l-.049-.04A4.631 4.631 0 009 15.25" style="animation:sad 4s infinite linear" stroke-dasharray="100"/></svg>

Upside Down

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes upside{0%{transform:rotateZ(0)}50%{transform:rotateZ(180deg)}to{transform:rotateZ(360deg)}}</style><g style="animation:upside 3s cubic-bezier(.91,.23,.15,.88) both infinite alternate-reverse;transform-origin:center center"><circle cx="12" cy="12" r="7" stroke="#0A0A30" stroke-width="1.5" transform="rotate(-180 12 12)"/><circle cx="15" cy="13.723" r="1" fill="#0A0A30" transform="rotate(-180 15 13.723)"/><circle cx="9" cy="13.723" r="1" fill="#0A0A30" transform="rotate(-180 9 13.723)"/><path stroke="#265BFF" stroke-linecap="round" d="M9 9.853l.049-.04a4.631 4.631 0 015.951.04"/></g></svg>

Wow

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes wow{0%,to{transform:translate(0,0) scaleX(.8) scaleY(.8)}50%{transform:translate(0,-1px) scaleX(1.1) scaleY(1.1)}}</style><circle cx="12.602" cy="12" r="7" stroke="#0A0A30" stroke-width="1.5"/><g style="animation:wow cubic-bezier(1,-.1,0,1.04) 3s infinite;transform-origin:50% 50%"><circle cx="9.602" cy="10.277" r="1" fill="#0A0A30"/><circle cx="15.602" cy="10.277" r="1" fill="#0A0A30"/><ellipse cx="12.602" cy="14.5" stroke="#265BFF" rx="2" ry="2.5"/></g></svg>

Ban

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes ban-n{0%{transform:scale(1)}to{transform:scale(.5)}}</style><path fill="#0A0A30" fill-rule="evenodd" d="M4.75 12a7.25 7.25 0 0111.819-5.63L6.37 16.57A7.22 7.22 0 014.75 12zm2.681 5.63A7.25 7.25 0 0017.63 7.431L7.431 17.63zM12 3.25a8.75 8.75 0 100 17.5 8.75 8.75 0 000-17.5z" clip-rule="evenodd" style="transform-origin:center center;animation:ban-n 1s cubic-bezier(.25,.46,.45,.94) infinite alternate both"/></svg>

Exclamation Circle

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes n-info-cir{0%,to{transform:rotate(0deg);transform-origin:center}10%,90%{transform:rotate(2deg)}20%,40%,60%{transform:rotate(-6deg)}30%,50%,70%{transform:rotate(6deg)}80%{transform:rotate(-2deg)}}</style><g style="animation:n-info-cir .8s cubic-bezier(.455,.03,.515,.955) both infinite"><circle cx="12.29" cy="12" r="8" stroke="#0A0A30" stroke-width="1.5"/><path stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M12.29 8.143v4.55"/><circle cx="12.29" cy="14.957" r=".9" fill="#265BFF"/></g></svg>

Exclamation Triangle

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes n-info-tri{0%,to{transform:rotate(0deg);transform-origin:center}10%,90%{transform:rotate(2deg)}20%,40%,60%{transform:rotate(-6deg)}30%,50%,70%{transform:rotate(6deg)}80%{transform:rotate(-2deg)}}.prefix__n-info-tri{animation:n-info-tri .8s cubic-bezier(.455,.03,.515,.955) both infinite}</style><path class="prefix__n-info-tri" style="animation-delay:1s" stroke="#0A0A30" stroke-width="1.5" d="M11.134 6.844a1 1 0 011.732 0l5.954 10.312a1 1 0 01-.866 1.5H6.046a1 1 0 01-.866-1.5l5.954-10.312z"/><g class="prefix__n-info-tri"><path stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M12 10.284v3.206"/><circle cx="12" cy="15.605" r=".832" fill="#265BFF"/></g></svg>

Hexagon Exclamation

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes n-info-hex{0%,to{transform:rotate(0deg);transform-origin:center}10%,90%{transform:rotate(2deg)}20%,40%,60%{transform:rotate(-6deg)}30%,50%,70%{transform:rotate(6deg)}80%{transform:rotate(-2deg)}}.prefix__n-info-hex{animation:n-info-hex .8s cubic-bezier(.455,.03,.515,.955) both infinite}</style><g class="prefix__n-info-hex"><path stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M12 8.143v4.55"/><circle cx="12" cy="14.957" r=".9" fill="#265BFF"/></g><path class="prefix__n-info-hex" style="animation-delay:1s" stroke="#0A0A30" stroke-width="1.5" d="M19.994 14.753a1 1 0 01-.282.712l-4.007 4.134a1 1 0 01-.702.304l-5.756.09a1 1 0 01-.712-.281l-4.134-4.007a1 1 0 01-.304-.702l-.09-5.756a1 1 0 01.281-.712l4.007-4.134a1 1 0 01.702-.304l5.756-.09a1 1 0 01.712.281l4.134 4.007a1 1 0 01.304.702l.09 5.756z"/></svg>

Info Question

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes n-info-ques{0%,to{transform:rotate(0deg);transform-origin:center}10%,90%{transform:rotate(2deg)}20%,40%,60%{transform:rotate(-6deg)}30%,50%,70%{transform:rotate(6deg)}80%{transform:rotate(-2deg)}}</style><circle cx="12" cy="12" r="8" stroke="#0A0A30" stroke-width="1.5"/><path fill="#265BFF" d="M14.325 9.956c0 .298-.103.605-.308.924a3.726 3.726 0 01-.68.786c-.657.566-.987.983-.987 1.252 0 .595-.233.892-.7.892a.688.688 0 01-.531-.233c-.135-.156-.202-.365-.202-.627s.064-.506.191-.732c.135-.234.294-.44.478-.616.184-.184.368-.361.552-.531.453-.41.68-.782.68-1.115a.627.627 0 00-.277-.53.957.957 0 00-.615-.213.943.943 0 00-.606.212c-.17.135-.332.273-.488.414a.738.738 0 01-.51.202.614.614 0 01-.467-.19.68.68 0 01-.18-.468c0-.333.23-.669.69-1.009a2.47 2.47 0 011.518-.52c.722 0 1.31.202 1.763.605.452.404.679.903.679 1.497zm-2.697 4.449c.248 0 .443.081.584.244.142.156.213.35.213.584a.959.959 0 01-.245.637.787.787 0 01-.615.276.721.721 0 01-.574-.244.903.903 0 01-.201-.595c0-.234.078-.442.233-.626a.776.776 0 01.605-.276z" style="animation:n-info-ques .8s cubic-bezier(.455,.03,.515,.955) both infinite"/></svg>

Info

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 25 24"><style>@keyframes n-info{0%,to{transform:rotate(0deg);transform-origin:center}10%,90%{transform:rotate(2deg)}20%,40%,60%{transform:rotate(-6deg)}30%,50%,70%{transform:rotate(6deg)}80%{transform:rotate(-2deg)}}</style><circle cx="12.29" cy="12" r="8" stroke="#0A0A30" stroke-width="1.5"/><path fill="#265BFF" d="M12.924 15.106h.713c.113 0 .17.057.17.17v.554c0 .113-.057.17-.17.17h-2.693c-.113 0-.17-.057-.17-.17v-.554c0-.113.057-.17.17-.17h.713v-3.78h-.611c-.113 0-.17-.056-.17-.169v-.588c0-.114.057-.17.17-.17h1.709c.113 0 .17.056.17.17v4.537zm-1.369-5.714a.804.804 0 01-.215-.577c0-.234.072-.427.215-.577A.776.776 0 0112.143 8c.25 0 .445.08.589.238.15.15.226.343.226.577a.782.782 0 01-.226.577c-.151.15-.35.226-.6.226-.241 0-.434-.075-.577-.226z" style="animation:n-info .8s cubic-bezier(.455,.03,.515,.955) both infinite"/></svg>

Notification Add

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes add-notify{0%{transform:scale3d(1,1,1)}30%{transform:scale3d(1.25,.75,1)}40%{transform:scale3d(.75,1.25,1)}50%{transform:scale3d(1.15,.85,1)}65%{transform:scale3d(.95,1.05,1)}75%{transform:scale3d(1.05,.95,1)}}@keyframes n-add-2{0%,to{transform:rotate(0deg);transform-origin:top center}10%,90%{transform:rotate(2deg)}20%,40%,60%{transform:rotate(-4deg)}30%,50%,70%{transform:rotate(4deg)}80%{transform:rotate(-2deg)}}</style><g style="animation:n-add-2 5s cubic-bezier(.455,.03,.515,.955) both infinite" stroke="#0A0A30" stroke-width="1.5"><path d="M12 3.398a5 5 0 00-5 5v2c0 .758-.442 1.505-1.005 2.012A3 3 0 008 17.642h8a3 3 0 002.005-5.232C17.442 11.903 17 11.156 17 10.398v-2a5 5 0 00-5-5z"/><path stroke-linecap="round" d="M14.39 20.312l-.043.01a9.715 9.715 0 01-4.67-.01"/></g><path fill="#265BFF" fill-rule="evenodd" d="M12.75 9.49a.75.75 0 00-1.5 0v1.401h-1.4a.75.75 0 000 1.5h1.4v1.401a.75.75 0 001.5 0v-1.4h1.4a.75.75 0 000-1.5h-1.4V9.49z" clip-rule="evenodd" style="animation:add-notify 1s 1s infinite both;transform-origin:center center"/></svg>

Notification Info

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes n-info-2{0%,to{transform:rotate(0deg);transform-origin:top center}10%,90%{transform:rotate(2deg)}20%,40%,60%{transform:rotate(-6deg)}30%,50%,70%{transform:rotate(6deg)}80%{transform:rotate(-2deg)}}</style><path stroke="#0A0A30" stroke-width="1.5" d="M12 3.398a5 5 0 00-5 5v2c0 .758-.442 1.505-1.005 2.012A3 3 0 008 17.642h8a3 3 0 002.005-5.232C17.442 11.903 17 11.156 17 10.398v-2a5 5 0 00-5-5z"/><g style="animation:n-info-2 1.5s cubic-bezier(.455,.03,.515,.955) both infinite"><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M14.39 20.312l-.043.01a9.715 9.715 0 01-4.67-.01"/><path stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M12 7.923v3.206"/><circle cx="12" cy="13.245" r=".832" fill="#265BFF"/></g></svg>

Notification Remove

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes remove-notify{0%{transform:scale3d(1,1,1)}30%{transform:scale3d(1.25,.75,1)}40%{transform:scale3d(.75,1.25,1)}50%{transform:scale3d(1.15,.85,1)}65%{transform:scale3d(.95,1.05,1)}75%{transform:scale3d(1.05,.95,1)}}@keyframes n-minus-2{0%,to{transform:rotate(0deg);transform-origin:top center}10%,90%{transform:rotate(2deg)}20%,40%,60%{transform:rotate(-4deg)}30%,50%,70%{transform:rotate(4deg)}80%{transform:rotate(-2deg)}}</style><g style="animation:n-minus-2 5s cubic-bezier(.455,.03,.515,.955) both infinite" stroke="#0A0A30" stroke-width="1.5"><path d="M12 3.398a5 5 0 00-5 5v2c0 .758-.442 1.505-1.005 2.012A3 3 0 008 17.642h8a3 3 0 002.005-5.232C17.442 11.903 17 11.156 17 10.398v-2a5 5 0 00-5-5z"/><path stroke-linecap="round" d="M14.39 20.312l-.043.01a9.715 9.715 0 01-4.67-.01"/></g><path fill="#265BFF" fill-rule="evenodd" d="M9.1 11.641a.75.75 0 01.75-.75h4.3a.75.75 0 010 1.5h-4.3a.75.75 0 01-.75-.75z" clip-rule="evenodd" style="animation:remove-notify 1s 1s infinite both;transform-origin:center center"/></svg>

Notification Off

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes n-off{to{stroke-dashoffset:0}}</style><path stroke="#0A0A30" stroke-width="1.5" d="M12 3.398a5 5 0 00-5 5v2c0 .758-.442 1.505-1.005 2.012A3 3 0 008 17.642h8a3 3 0 002.005-5.232C17.442 11.903 17 11.156 17 10.398v-2a5 5 0 00-5-5z"/><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M14.39 20.312l-.043.01a9.714 9.714 0 01-4.67-.01"/><path stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M19 5L5 19" style="animation:n-off 2s infinite cubic-bezier(.99,-.1,.01,1.02) alternate" stroke-dashoffset="100" stroke-dasharray="100"/></svg>

Notification Snooze

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes n-snooze{0%{transform:scale(.2);opacity:.8}80%{transform:scale(1.2);opacity:1}to{transform:scale(1.2);opacity:0}}</style><path stroke="#0A0A30" stroke-width="1.5" d="M12 3.398a5 5 0 00-5 5v2c0 .758-.442 1.505-1.005 2.012A3 3 0 008 17.642h8a3 3 0 002.005-5.232C17.442 11.903 17 11.156 17 10.398v-2a5 5 0 00-5-5z"/><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M14.39 20.312l-.043.01a9.714 9.714 0 01-4.67-.01"/><path fill="#265BFF" d="M14.48 13.918H9.676l2.648-3.642H9.677v-.911h4.802l-2.639 3.641h2.64v.912z" style="animation:n-snooze 1.5s cubic-bezier(.165,.84,.44,1) infinite both;transform-origin:center center"/></svg>

Notification

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes notify{0%,to{transform:rotate(0deg);transform-origin:top center}10%,90%{transform:rotate(2deg)}20%,40%,60%{transform:rotate(-6deg)}30%,50%,70%{transform:rotate(6deg)}80%{transform:rotate(-2deg)}}</style><g style="animation:notify 1s cubic-bezier(.455,.03,.515,.955) both infinite" stroke-width="1.5"><path stroke="#0A0A30" d="M12.29 3.398a5 5 0 00-5 5v2c0 .758-.441 1.505-1.005 2.012a3 3 0 002.005 5.232h8a3 3 0 002.006-5.232c-.564-.507-1.005-1.254-1.005-2.012v-2a5 5 0 00-5-5z"/><path stroke="#265BFF" stroke-linecap="round" d="M14.68 20.312l-.042.01a9.713 9.713 0 01-4.67-.01"/></g></svg>

Notification Square

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes n-square{0%,to{transform:scale(1)}50%{transform:scale(.9)}}</style><rect width="14" height="14" x="4.283" y="5.717" stroke="#0A0A30" stroke-width="1.5" rx="2"/><circle cx="17.5" cy="6.5" r="2.217" fill="#265BFF" stroke="#fff" style="animation:n-square 1s ease-in-out infinite both;transform-origin:center center"/></svg>

Balloon

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes balloon-fly{0%{transform:translateY(0);opacity:1}to{transform:translateY(-10px);opacity:0}}.prefix__balloon-fly{animation:balloon-fly 5s linear infinite both}</style><path class="prefix__balloon-fly" style="animation-delay:2s" fill="#0A0A30" fill-rule="evenodd" d="M7.724 9.46a2.317 2.317 0 014.634 0c0 .668-.28 1.501-.757 2.164-.485.675-1.055 1.02-1.56 1.02-.505 0-1.075-.345-1.56-1.02-.477-.663-.757-1.496-.757-2.163zm2.317-3.816A3.817 3.817 0 006.224 9.46c0 1.026.407 2.16 1.04 3.04.538.748 1.329 1.427 2.298 1.6l-.086.23c-.25.667-.07 1.402.474 1.917.33.313.374.785.107 1.141l-.359.479c-.172.23-.1.54.16.693.262.152.614.088.787-.142l.358-.479c.556-.741.464-1.722-.223-2.373a.847.847 0 01-.227-.921l.226-.604c.851-.238 1.55-.86 2.04-1.542.632-.88 1.039-2.013 1.039-3.04a3.817 3.817 0 00-3.817-3.816z" clip-rule="evenodd"/><path class="prefix__balloon-fly" fill="#265BFF" fill-rule="evenodd" d="M15.626 10.167a1.508 1.508 0 113.016 0c0 .435-.183.977-.493 1.409-.316.438-.686.663-1.015.663-.33 0-.7-.225-1.015-.664-.31-.431-.493-.973-.493-1.408zm1.508-2.484a2.484 2.484 0 00-2.484 2.484c0 .668.264 1.406.676 1.979.35.487.865.929 1.496 1.042l-.056.149c-.163.434-.045.913.308 1.248.215.204.244.51.07.742l-.233.312c-.113.15-.066.352.104.45a.4.4 0 00.511-.091l.234-.312c.362-.482.302-1.12-.145-1.544a.551.551 0 01-.148-.6l.147-.393c.554-.155 1.008-.56 1.327-1.003.412-.573.677-1.311.677-1.979a2.484 2.484 0 00-2.484-2.484z" clip-rule="evenodd"/></svg>

Cake

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes cake{10%,30%,50%,70%,90%{transform:translate3d(-.5px,0,0)}20%,40%,60%,80%{transform:translate3d(.5px,0,0)}}</style><path fill="#0A0A30" fill-rule="evenodd" d="M8.926 10.644h7.995a1.5 1.5 0 011.5 1.5v.547l-.99 1.048a.482.482 0 01-.725-.018l-.613-.717a1.446 1.446 0 00-2.216-.01l-.59.68a.482.482 0 01-.745-.01l-.503-.61a1.447 1.447 0 00-2.248-.014l-.584.69a.481.481 0 01-.72.028l-1.061-1.08v-.534a1.5 1.5 0 011.5-1.5zm-3 1.974v3.526a3 3 0 003 3h7.995a3 3 0 003-3v-4a3 3 0 00-3-3H8.926a3 3 0 00-3 3v.465l-.005.004.005.005zm1.5 1.526l.369.376a1.444 1.444 0 002.158-.086l.583-.69a.482.482 0 01.75.004l.503.61a1.446 1.446 0 002.234.03l.59-.678a.482.482 0 01.739.003l.612.716a1.445 1.445 0 002.174.057l.283-.3v1.958a1.5 1.5 0 01-1.5 1.5H8.926a1.5 1.5 0 01-1.5-1.5v-2z" clip-rule="evenodd"/><path fill="#265BFF" d="M12.488 3.853a.5.5 0 01.866 0l.878 1.52a1.513 1.513 0 11-2.622 0l.878-1.52z" style="animation:cake 2s ease infinite"/></svg>

Candle

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes candle{10%,30%,50%,70%,90%{transform:translate3d(-.5px,0,0)}20%,40%,60%,80%{transform:translate3d(.5px,0,0)}}</style><path fill="#0A0A30" d="M11.5 10.326a.5.5 0 00-.5.5v7.012h-1a.59.59 0 000 1.18h6a.59.59 0 100-1.18h-1v-7.012a.5.5 0 00-.5-.5h-3z"/><path fill="#265BFF" d="M12.567 5.272a.5.5 0 01.866 0l.878 1.52a1.513 1.513 0 11-2.622 0l.878-1.52z" style="animation:candle 2s ease infinite"/></svg>

Champagne

 <svg viewBox="0 0 24 24" width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><style>@keyframes glass-1{0%{transform:rotate(0)}to{transform:rotate(-20deg)}}@keyframes glass-2{0%{transform:rotate(0)}to{transform:rotate(20deg)}}</style><path fill-rule="evenodd" clip-rule="evenodd" d="M6.081 6.54h-.75v4.627a3.251 3.251 0 002.562 3.177l.005 2.76h-.256a.75.75 0 100 1.5H9.642a.75.75 0 000-1.5h-.244l-.005-2.79a3.251 3.251 0 002.438-3.147V6.54h-5.75zm.75 4.627V8.04h3.5v3.127a1.75 1.75 0 11-3.5 0z" fill="#0A0A30" style="animation:glass-2 1s cubic-bezier(1,-.28,.01,1.13) infinite alternate-reverse both;transform-origin:center center"/><path fill-rule="evenodd" clip-rule="evenodd" d="M14.934 6.54h-.75v4.627a3.251 3.251 0 002.561 3.177l.005 2.76h-.255a.75.75 0 100 1.5h2a.75.75 0 000-1.5h-.245l-.005-2.79a3.251 3.251 0 002.438-3.147V6.54h-5.75zm.75 4.627V8.04h3.5v3.127a1.75 1.75 0 11-3.5 0z" fill="#0A0A30" style="animation:glass-1 1s cubic-bezier(1,-.28,.01,1.13) infinite alternate-reverse both;transform-origin:center center"/></svg>

Champagne 2

 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><style>@keyframes champagne-confetti{0%,50%,60%{opacity:0}to{opacity:1}}@keyframes champagne-bottle{0%{transform:translateY(0) translateX(0)}to{transform:translateY(-.3px) translateX(.3px)}}</style><path fill="#0A0A30" fill-rule="evenodd" d="M13.236 10.104a.5.5 0 00-.691.149l-1.312 2.03c-.89-.218-1.779.016-2.257.66l-.004-.002-1.034 1.601L5.2 18.78a1.27 1.27 0 00.378 1.758l2.135 1.379a1.27 1.27 0 001.757-.378l2.738-4.238 1.035-1.601-.004-.002c.39-.701.24-1.607-.326-2.33l1.312-2.03a.5.5 0 00-.149-.691l-.84-.543zm-1.705 4.647a.32.32 0 01.016.06l-3.333 5.16-1.068-.69 3.334-5.16a.414.414 0 01.06-.01c.13-.01.35.023.588.177s.359.34.403.463z" clip-rule="evenodd" style="animation:champagne-bottle 1.5s cubic-bezier(1,-.49,.02,1.07) infinite both"/><g style="animation:champagne-confetti 1.5s cubic-bezier(.85,.11,.01,.88) infinite both" fill="#265BFF"><circle cx="12.897" cy="7.048" r=".666"/><circle cx="17.528" cy="5.056" r=".333"/><rect width=".552" height=".552" x="16.47" y="6.597" rx=".276" transform="rotate(-35.202 16.47 6.597)"/><rect width=".552" height=".552" x="16.993" y="9.622" rx=".276" transform="rotate(-35.202 16.993 9.622)"/><path fill-rule="evenodd" d="M15.11 3.665a.333.333 0 01.413.227l.153.523c.16.547.189 1.124.087 1.684a2.44 2.44 0 01-.743 1.353l-.227.21a1.1 1.1 0 00-.335.61l-.182.997a.333.333 0 11-.655-.12l.181-.996c.069-.376.258-.72.538-.98l.227-.21a1.77 1.77 0 00.54-.983c.084-.46.06-.931-.071-1.379l-.152-.523a.333.333 0 01.226-.413zm-.077 6.79a.333.333 0 01-.142-.45l.25-.483a3.67 3.67 0 011.101-1.278 2.44 2.44 0 011.472-.465l.31.005a1.1 1.1 0 00.663-.21l.82-.595a.333.333 0 11.391.54l-.819.594c-.31.225-.683.343-1.066.337l-.31-.005a1.774 1.774 0 00-1.07.339 3.004 3.004 0 00-.9 1.045l-.251.484a.333.333 0 01-.45.142z" clip-rule="evenodd"/></g></svg>

Confetti

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes confetti{0%,50%,60%{opacity:0}to{opacity:1}}@keyframes confetti-prop{0%{transform:translateY(0) translateX(0)}to{transform:translateY(-.5px) translateX(.5px)}}</style><path fill="#0A0A30" d="M15.459 14.163l-.471.471.47-.471zm-.38 1.972l-.263-.613.263.613zm-5.918-5.919l-.613-.262.613.262zm1.971-.38l.472-.47-.472.47zm-5.216 7.951l.612.263-.612-.263zm1.592 1.592l.262.613-.262-.613zm-.98-1.33l3.245-7.57-1.225-.525-3.245 7.57 1.225.526zm4.133-7.741l4.327 4.326.942-.943-4.326-4.326-.943.943zm4.155 5.214l-7.57 3.245.524 1.225 7.572-3.245-.526-1.225zm.171-.888a.546.546 0 01-.17.888l.524 1.225a1.879 1.879 0 00.589-3.056l-.942.943zm-5.214-4.155a.546.546 0 01.888-.171l.943-.943a1.879 1.879 0 00-3.056.589l1.225.525zm-4.47 7.046c-.668 1.559.909 3.135 2.467 2.467l-.525-1.225a.546.546 0 01-.717-.717l-1.225-.525z" style="animation:confetti-prop 1.5s cubic-bezier(1,-.49,.02,1.07) infinite both"/><g style="animation:confetti 1.5s cubic-bezier(.85,.11,.01,.88) infinite both" fill="#265BFF"><circle cx="13.505" cy="7.146" r=".666"/><circle cx="18.17" cy="7.298" r=".333"/><path d="M18.17 11.277l1.09-.768.768 1.089-1.09.768zM15.52 9.83l.45-.317.32.45-.452.319zm-.399-3.894l.544-.384.384.544-.544.384z"/><path fill-rule="evenodd" d="M17.17 4.814c.185 0 .334.15.334.333v.545c0 .57-.133 1.132-.387 1.642-.237.472-.62.855-1.092 1.091l-.277.139a1.1 1.1 0 00-.492.492l-.453.905a.333.333 0 11-.596-.298l.453-.905c.17-.342.448-.62.79-.79l.277-.139c.343-.172.622-.45.793-.793.209-.417.318-.877.318-1.344v-.545c0-.184.149-.333.333-.333zm-.332 7.816a.333.333 0 01-.334-.334v-.545c0-.57.133-1.131.388-1.64a2.44 2.44 0 011.091-1.092l.277-.139a1.1 1.1 0 00.492-.492l.453-.905a.333.333 0 11.596.298l-.452.905c-.171.342-.449.62-.79.79l-.278.139c-.343.171-.621.45-.793.793a3.003 3.003 0 00-.317 1.343v.546c0 .183-.15.333-.333.333z" clip-rule="evenodd"/></g></svg>

Firework

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes slide-out-tr{0%{transform:translateY(0) translateX(0);opacity:1}to{transform:translateY(-10px) translateX(10px);opacity:0}}</style><g style="animation:slide-out-tr 1s cubic-bezier(.47,0,.745,.715) infinite both"><path fill="#265BFF" d="M7.824 16.622l.287-.32-.642-.574-.287.321.642.573zM4.66 18.875a.43.43 0 10.642.573l-.642-.573zm2.523-2.826L4.66 18.875l.642.573 2.523-2.826-.642-.573z"/><path fill="#0A0A30" fill-rule="evenodd" d="M11.586 15.532l.692-3.729-3.574 1.265.557.476-1.922 2.249-.324.379.38.323 1.01.864.378.324.324-.38 1.922-2.248.557.477zm-3.165.53l1.51-1.769.254.216-1.512 1.768-.252-.216z" clip-rule="evenodd"/></g></svg>

Gift Box

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes gift-open{0%{transform:translateY(0)}to{transform:translateY(-3px)}}</style><path stroke="#0A0A30" stroke-width="1.5" d="M6.921 12.535h12v4a2 2 0 01-2 2h-8a2 2 0 01-2-2v-4z"/><path fill="#265BFF" fill-rule="evenodd" d="M10.963 6.487a.717.717 0 011.009.102c.147.18.337.578.428.984.044.2.058.373.044.502-.014.133-.05.165-.051.165 0 0-.038.03-.172.017a1.618 1.618 0 01-.483-.144c-.38-.17-.73-.436-.878-.617a.717.717 0 01.103-1.009zm1.676-.442a1.578 1.578 0 00-2.445 1.996c.211.26.576.538.962.744H8.921a2.75 2.75 0 00-2.75 2.75v1.75h13.5v-1.75a2.75 2.75 0 00-2.75-2.75h-2.235c.386-.206.75-.485.963-.744a1.578 1.578 0 00-2.446-1.996 2.492 2.492 0 00-.282.45 2.497 2.497 0 00-.282-.45zm1.231.544a.717.717 0 011.112.907c-.147.18-.498.446-.878.617a1.619 1.619 0 01-.483.144c-.134.013-.172-.017-.172-.017s-.037-.032-.051-.165c-.014-.13 0-.302.044-.502.091-.406.281-.803.428-.984zm4.301 4.946v.25h-10.5v-.25c0-.69.56-1.25 1.25-1.25h8c.69 0 1.25.56 1.25 1.25z" clip-rule="evenodd" style="animation:gift-open 1s cubic-bezier(0,.32,.45,1.24) infinite alternate both"/></svg>

Chrome

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes chrome{0%{transform:rotate(0)}to{transform:rotate(360deg)}}</style><g style="animation:chrome 1s cubic-bezier(.215,.61,.355,1) infinite both;transform-origin:54% center"><path stroke="#0A0A30" stroke-width="1.5" d="M14.524 14.15l-4.047 4.736m.107-5.828l-2.94-6.03m5.096 2.355h6.962"/><path fill="#0A0A30" d="M7.588 15.124a6.249 6.249 0 012.288-8.536l-.75-1.299a7.749 7.749 0 00-2.837 10.585l1.3-.75zm2.288-8.536a6.249 6.249 0 018.536 2.288l1.299-.75A7.749 7.749 0 009.126 5.289l.75 1.3zm8.536 2.288a6.249 6.249 0 01-2.288 8.536l.75 1.299a7.749 7.749 0 002.837-10.585l-1.3.75zm-2.288 8.536a6.249 6.249 0 01-8.536-2.288l-1.299.75a7.749 7.749 0 0010.585 2.837l-.75-1.3z"/><circle cx="13" cy="12" r="2.625" stroke="#265BFF" stroke-width="1.5" transform="rotate(150 13 12)"/></g></svg>

Discord

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes discord{0%{transform:rotate(0)}to{transform:rotate(360deg)}}</style><path stroke="#0A0A30" stroke-width="1.5" d="M17.545 6.995c-1.02-.46-2.114-.8-3.257-.994a.05.05 0 00-.052.024 8.786 8.786 0 00-.406.82 12.376 12.376 0 00-3.658 0 8.241 8.241 0 00-.412-.82.052.052 0 00-.052-.024 13.314 13.314 0 00-3.257.994.046.046 0 00-.021.018c-2.074 3.05-2.643 6.023-2.364 8.96a.06.06 0 00.02.038 13.353 13.353 0 003.996 1.987.052.052 0 00.056-.018 9.31 9.31 0 00.818-1.308.05.05 0 00-.028-.07 8.785 8.785 0 01-1.248-.585.05.05 0 01-.005-.084 6.78 6.78 0 00.248-.191.05.05 0 01.051-.007c2.619 1.176 5.454 1.176 8.041 0a.05.05 0 01.053.006c.08.065.164.13.248.192a.05.05 0 01-.004.084 8.22 8.22 0 01-1.249.585.05.05 0 00-.027.07c.24.457.514.893.817 1.307a.051.051 0 00.056.019 13.308 13.308 0 004.001-1.987.05.05 0 00.021-.037c.334-3.396-.559-6.345-2.366-8.96a.04.04 0 00-.02-.02zm-8.198 5.783c-.789 0-.962-.243-.962-1.118 0-.874.16-1.117.962-1.117.807 0 .973.249.96 1.117 0 .875-.16 1.118-.96 1.118zm5.316 0c-.788 0-.961-.243-.961-1.118 0-.874.16-1.117.961-1.117.807 0 .974.249.961 1.117 0 .875-.154 1.118-.96 1.118z" style="transform-origin:center;animation:discord 1.5s cubic-bezier(.64,.03,.24,.93) infinite both"/></svg>

Nintendo Switch

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes ns-1{0%{transform:translateY(0)}to{transform:translateY(7px)}}@keyframes ns-2{0%{transform:translateY(0)}to{transform:translateY(-7px)}}</style><path stroke="#0A0A30" stroke-width="1.5" d="M6.447 8.148A2.568 2.568 0 019.015 5.58h2.568v12.84H9.015a2.568 2.568 0 01-2.568-2.568V8.148zm12.737 7.704a2.568 2.568 0 01-2.568 2.568h-2.568V5.58h2.568a2.568 2.568 0 012.568 2.568v7.704z"/><circle cx="9.015" cy="8.74" r=".963" fill="#265BFF" style="animation:ns-1 1s linear infinite alternate both"/><circle cx="16.616" cy="15.26" r=".963" fill="#265BFF" transform="rotate(-180 16.616 15.26)" style="animation:ns-2 1s linear infinite alternate both"/></svg>

PayPal

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes paypal{0%{transform:translateY(-2.4px) translateX(-2.4px)}to{transform:translateY(1px) translateX(1px)}}</style><path stroke="#265BFF" stroke-width="1.5" d="M11.618 8.094h4.163c2.236 0 3.077 1.132 2.947 2.794-.215 2.745-1.874 4.264-4.075 4.264H13.54c-.302 0-.505.2-.586.741l-.472 3.149c-.031.204-.139.322-.3.338H9.567c-.246 0-.333-.188-.268-.595L10.893 8.69c.063-.404.284-.596.725-.596z" clip-rule="evenodd" style="animation:paypal 1s cubic-bezier(.25,.46,.45,.94) both infinite alternate"/><path fill="#fff" fill-rule="evenodd" stroke="#0A0A30" stroke-width="1.5" d="M9.603 4.62h4.167c1.174 0 2.567.037 3.497.86.623.548.95 1.422.874 2.364-.256 3.182-2.159 4.965-4.712 4.965h-2.055c-.35 0-.582.232-.68.86l-.574 3.654c-.038.236-.14.376-.323.393H7.225c-.284 0-.385-.215-.311-.69L8.762 5.314c.074-.471.333-.694.84-.694z" clip-rule="evenodd"/></svg>

Pinterest

 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><style>@keyframes pinterest{0%{transform:translateY(-10px) translateX(2px);opacity:0}to{transform:translateZ(0) translateX(0);opacity:1}}</style><path fill="#265BFF" d="M7.828 11.63c0-.549.113-1.093.341-1.632.229-.54.555-1.04.98-1.502.425-.46.983-.835 1.675-1.122.693-.287 1.46-.431 2.3-.431 1.367 0 2.488.427 3.365 1.28.876.852 1.314 1.857 1.314 3.015 0 1.488-.37 2.718-1.114 3.688-.744.97-1.704 1.455-2.881 1.455a2.26 2.26 0 01-1.089-.274c-.339-.183-.577-.405-.715-.666l-.516 2.063a4.1 4.1 0 01-.167.502c-.069.17-.145.333-.226.49a10.32 10.32 0 01-.245.444 8.62 8.62 0 01-.458.698c-.06.082-.115.154-.167.216l-.077.104a.094.094 0 01-.103.04.094.094 0 01-.078-.08 31.2 31.2 0 01-.058-.542 13.918 13.918 0 01-.038-.488 6.84 6.84 0 01.025-1.201 5.24 5.24 0 01.097-.627c.094-.409.412-1.771.954-4.086a2.215 2.215 0 01-.168-.503 2.368 2.368 0 01-.064-.476l-.013-.196c0-.557.14-1.02.419-1.39.28-.37.616-.555 1.011-.555.319 0 .565.107.742.32.176.213.264.48.264.803 0 .2-.036.446-.11.737-.073.291-.17.627-.29 1.005-.12.379-.206.686-.258.92-.086.392-.01.732.226 1.019.236.287.552.43.947.43.68 0 1.24-.388 1.682-1.168.442-.779.664-1.72.664-2.826 0-.844-.27-1.534-.812-2.069-.541-.535-1.298-.803-2.268-.803-1.083 0-1.962.353-2.636 1.058a3.537 3.537 0 00-1.012 2.532c0 .584.164 1.075.49 1.475.112.13.146.27.103.418a2.728 2.728 0 00-.077.3 2.73 2.73 0 01-.077.3c-.017.096-.061.16-.13.19a.289.289 0 01-.231-.007 2.167 2.167 0 01-1.14-1.077c-.255-.509-.381-1.103-.381-1.782z" style="animation:pinterest 1.5s cubic-bezier(.85,.57,.12,.85) both infinite"/><circle cx="12.816" cy="12" r="8" stroke="#0A0A30" stroke-width="1.5"/></svg>

TikTok

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes tiktok{0%,to{transform:translate(0)}20%{transform:translate(-.3px,.3px)}40%{transform:translate(-.3px,-.3px)}60%{transform:translate(.3px,.3px)}80%{transform:translate(.3px,-.5px)}}</style><rect width="14" height="14" x="5.194" y="5" stroke="#0A0A30" stroke-width="1.5" rx="2"/><path fill="#265BFF" d="M15.523 10.047a2.242 2.242 0 01-1.182-.66 2.06 2.06 0 01-.549-1.195V8H12.21v5.967c0 .265-.087.523-.25.738a1.324 1.324 0 01-.655.46 1.392 1.392 0 01-.815.008 1.328 1.328 0 01-.667-.447A1.208 1.208 0 019.69 13.4c.111-.21.281-.388.492-.511a1.416 1.416 0 011.105-.131V11.23a3.007 3.007 0 00-2.036.47 2.793 2.793 0 00-1.038 1.232 2.638 2.638 0 00-.158 1.571c.109.527.377 1.013.772 1.397.404.392.922.66 1.487.77A3.05 3.05 0 0012 16.522c.534-.207.992-.56 1.314-1.016.322-.455.495-.99.497-1.54v-3.055a3.88 3.88 0 002.189.664V10.09c-.154 0-.308-.014-.459-.044h-.018z" style="animation:tiktok .5s cubic-bezier(.6,.04,.98,.335) infinite both"/></svg>

YouTube

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes youtube{0%{transform:translateZ(-10px) translateX(-10px);opacity:0}30%,50%,80%{transform:translateZ(0) translateX(0);opacity:1}to{transform:translateZ(10px) translateX(10px);opacity:0}}</style><path fill="#265BFF" fill-rule="evenodd" d="M13.246 11.693a.645.645 0 010 1.054l-2.23 1.574A.645.645 0 0110 13.794v-3.148c0-.523.59-.828 1.017-.527l2.229 1.574z" clip-rule="evenodd" style="animation:youtube 2s cubic-bezier(.25,.46,.45,.94) infinite both"/><path fill="#0A0A30" fill-rule="evenodd" d="M16.613 6.666a41.132 41.132 0 00-9.226 0l-1.155.13c-1.052.119-1.847 1.022-1.847 2.096v6.216c0 1.074.795 1.977 1.847 2.096l1.155.13c3.066.346 6.16.346 9.226 0l1.155-.13c1.052-.119 1.847-1.022 1.847-2.096V8.892c0-1.074-.795-1.977-1.847-2.096l-1.155-.13zM7.234 5.268a42.495 42.495 0 019.531 0l1.156.13C19.674 5.596 21 7.101 21 8.892v6.216c0 1.79-1.326 3.296-3.08 3.494l-1.155.13a42.484 42.484 0 01-9.53 0l-1.156-.13C4.326 18.404 3 16.899 3 15.108V8.892c0-1.79 1.326-3.296 3.08-3.494l1.154-.13z" clip-rule="evenodd"/></svg>

Instagram

 <svg viewBox="0 0 24 24"  xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes instagram{0%,40%{transform:scale(.4)}20%{transform:scale(.6)}60%{transform:scale(.8)}to{transform:scale(1)}}</style><rect width="14.5" height="14.5" x="4.75" y="4.75" stroke="#0A0A30" stroke-width="1.5" rx="4.25"/><rect width="6" height="6" x="9" y="9" stroke="#265BFF" stroke-width="1.5" rx="3" style="animation:instagram 2s linear infinite both;transform-origin:center center"/><circle cx="16" cy="8" r="1" fill="#0A0A30"/></svg>

Chat

 <svg  viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes chatMotion{0%,to{transform:translateY(0)}50%{transform:translateY(-1px)}}</style><path stroke="#0A0A30" stroke-width="1.5" d="M18.25 12v5c0 .69-.56 1.25-1.25 1.25h-5A6.25 6.25 0 1118.25 12z"/><circle cx="9" cy="12" r="1" fill="#265BFF" style="animation:chatMotion .8s ease-in-out infinite"/><circle cx="12" cy="12" r="1" fill="#265BFF" style="animation:chatMotion .8s ease-in-out infinite;animation-delay:.3s"/><circle cx="15" cy="12" r="1" fill="#265BFF" style="animation:chatMotion .8s ease-in-out infinite;animation-delay:.5s"/></svg>

Chat 2

 <svg  viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes chatMotion2{0%,to{transform:translateY(0)}50%{transform:translateY(-1px)}}</style><path stroke="#0A0A30" stroke-width="1.5" d="M10 6.75h4A4.25 4.25 0 0118.25 11v6.25H10A4.25 4.25 0 015.75 13v-2A4.25 4.25 0 0110 6.75z"/><circle cx="9" cy="12" r="1" fill="#265BFF" style="animation:chatMotion2 .8s ease-in-out infinite"/><circle cx="12" cy="12" r="1" fill="#265BFF" style="animation:chatMotion2 .8s ease-in-out infinite;animation-delay:.3s"/><circle cx="15" cy="12" r="1" fill="#265BFF" style="animation:chatMotion2 .8s ease-in-out infinite;animation-delay:.5s"/></svg>

Chat 3

 <svg  viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes chatMotion3{0%,to{transform:translateY(0)}50%{transform:translateY(-1px)}}</style><path fill="#0A0A30" fill-rule="evenodd" d="M12.121 6.74a5.25 5.25 0 00-4.414 8.093l.177.274-1.057 1.986 2.244-.82.256.162A5.25 5.25 0 1012.12 6.74zm-6.75 5.25a6.75 6.75 0 113.422 5.874l-2.52.876a.95.95 0 01-1.115-1.162l1.115-2.216a6.722 6.722 0 01-.902-3.372z" clip-rule="evenodd"/><circle cx="9" cy="12" r="1" fill="#265BFF" style="animation:chatMotion3 .8s ease-in-out infinite"/><circle cx="12" cy="12" r="1" fill="#265BFF" style="animation:chatMotion3 .8s ease-in-out infinite;animation-delay:.3s"/><circle cx="15" cy="12" r="1" fill="#265BFF" style="animation:chatMotion3 .8s ease-in-out infinite;animation-delay:.5s"/></svg>

Phone

                                          <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes phone{0%,to{transform:rotate(0deg);transform-origin:0 100%}10%,90%{transform:rotate(2deg)}20%,40%,60%{transform:rotate(-4deg)}30%,50%,70%{transform:rotate(4deg)}80%{transform:rotate(-2deg)}}</style><path fill="#0A0A30" d="M15.758 19a10.761 10.761 0 01-7.603-3.162A10.805 10.805 0 015 8.22c0-.854.339-1.673.941-2.277A3.21 3.21 0 018.214 5c.18-.001.36.015.537.05.172.024.34.067.503.125a.699.699 0 01.455.525l.957 4.2a.7.7 0 01-.182.644c-.09.098-.098.105-.957.553a6.93 6.93 0 003.402 3.423c.454-.868.461-.875.559-.966a.699.699 0 01.643-.182l4.191.959a.699.699 0 01.503.455A3.046 3.046 0 0119 15.829a3.223 3.223 0 01-.968 2.255 3.21 3.21 0 01-2.274.916zM8.215 6.4a1.822 1.822 0 00-1.817 1.82 9.396 9.396 0 002.744 6.63 9.36 9.36 0 006.617 2.75 1.821 1.821 0 001.817-1.82v-.231l-3.242-.75-.202.386c-.315.609-.545 1.05-1.132.812a8.276 8.276 0 01-5.016-5.047c-.251-.546.224-.798.824-1.113l.385-.189L8.444 6.4h-.23z" style="animation:phone 1.5s cubic-bezier(1,.01,.75,2.17) both infinite"/></svg>

Airplay

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes airplay{0%{transform:translateY(1px)}to{transform:translateY(-1px)}}</style><path fill="#0A0A30" d="M8.165 16.75a.75.75 0 000-1.5v1.5zm7.603-1.5a.75.75 0 000 1.5v-1.5zM8 6.75h8v-1.5H8v1.5zM18.25 9v4h1.5V9h-1.5zm-12.5 4V9h-1.5v4h1.5zm2.415 2.25H8v1.5h.165v-1.5zm7.835 0h-.232v1.5H16v-1.5zM4.25 13A3.75 3.75 0 008 16.75v-1.5A2.25 2.25 0 015.75 13h-1.5zm14 0A2.25 2.25 0 0116 15.25v1.5A3.75 3.75 0 0019.75 13h-1.5zM16 6.75A2.25 2.25 0 0118.25 9h1.5A3.75 3.75 0 0016 5.25v1.5zm-8-1.5A3.75 3.75 0 004.25 9h1.5A2.25 2.25 0 018 6.75v-1.5z"/><path fill="#265BFF" fill-rule="evenodd" d="M10.412 14.86c.706-1.112 2.47-1.112 3.176 0l1.058 1.666c.706 1.111-.176 2.5-1.588 2.5h-2.117c-1.41 0-2.293-1.389-1.587-2.5l1.058-1.667zm2.117.555c-.235-.37-.823-.37-1.058 0l-1.059 1.667c-.235.37.06.833.53.833h2.117c.47 0 .764-.463.529-.833l-1.059-1.667z" clip-rule="evenodd" style="animation:airplay .8s ease-in infinite alternate both"/></svg>

Airpod Case

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes airpod-case{0%,50%,to{opacity:1}25%,75%{opacity:0}}</style><path fill="#0A0A30" fill-rule="evenodd" d="M8.748 4.024a5.75 5.75 0 00-5.75 5.75v4.452a5.75 5.75 0 005.75 5.75h6.482a5.75 5.75 0 005.75-5.75v-4.111a.752.752 0 000-.358 5.75 5.75 0 00-5.75-5.733H8.748zM19.44 9.186a4.251 4.251 0 00-4.21-3.662H8.748a4.25 4.25 0 00-4.21 3.662H19.44zm-14.942 1.5v3.54a4.25 4.25 0 004.25 4.25h6.482a4.25 4.25 0 004.25-4.25v-3.54H4.498z" clip-rule="evenodd"/><path fill="#265BFF" fill-rule="evenodd" d="M10.455 12.803c0-.428.313-.774.7-.774h1.69c.387 0 .7.346.7.774 0 .427-.313.774-.7.774h-1.69c-.387 0-.7-.347-.7-.774z" clip-rule="evenodd" style="animation:airpod-case 2s infinite both"/></svg>

Airpod

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes airpod{0%{transform:scale(.2);opacity:.8}80%{transform:scale(1.2);opacity:0}to{transform:scale(2.2);opacity:0}}</style><rect width="14" height="14" x="5" y="5" fill="#265BFF" rx="7" style="animation:airpod 1.5s cubic-bezier(.165,.84,.44,1) infinite both;transform-origin:center center"/><path fill="#0A0A30" d="M9.392 7.004a2.104 2.104 0 00-1.52.58l-.544.543a.677.677 0 00-.181.507v.869a.797.797 0 00.036.29c.034.103.082.2.145.29a.65.65 0 00.181.253 2.507 2.507 0 001.883.87 2.212 2.212 0 002.282-2.102 2.213 2.213 0 00-2.282-2.1zM8.125 9.72a.17.17 0 01-.181.181H7.87a.17.17 0 01-.18-.18V8.488a.17.17 0 01.18-.181h.073a.17.17 0 01.18.18V9.72zm2.064-.29h-.616a.333.333 0 01-.326-.362.326.326 0 01.326-.326h.652a.333.333 0 01.326.362.362.362 0 01-.362.326zm-.724 6.994a.525.525 0 00.507.54h.616a.53.53 0 00.507-.544v-5.25a3.238 3.238 0 01-1.63.543v4.712zm7.207-8.297l-.543-.544a1.967 1.967 0 00-1.521-.58 2.213 2.213 0 00-2.282 2.101 2.213 2.213 0 002.282 2.101 2.388 2.388 0 001.883-.87c.072-.072.109-.18.181-.253a.724.724 0 00.145-.29.797.797 0 00.036-.29v-.868a.676.676 0 00-.181-.507zM14.427 9.43h-.652a.362.362 0 010-.724h.652a.333.333 0 01.325.362.3.3 0 01-.325.362zm1.883.29a.17.17 0 01-.11.17.17.17 0 01-.071.011h-.073a.17.17 0 01-.18-.18V8.488a.17.17 0 01.11-.17.17.17 0 01.07-.011h.073a.17.17 0 01.18.18V9.72zm-3.405 6.737a.532.532 0 00.544.543h.543a.532.532 0 00.543-.543v-4.745a2.673 2.673 0 01-1.63-.543v5.288z"/></svg>

Bluetooth

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes bluetooth{to{stroke-dashoffset:0}}</style><path stroke="#0A0A30" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M7.441 15.954l8.653-7.55a.5.5 0 00-.03-.777l-3.678-2.76a.5.5 0 00-.8.4v13.458a.5.5 0 00.802.398l3.666-2.785a.5.5 0 00.014-.785L7.441 8.494" style="animation:bluetooth 2s infinite ease-in" stroke-dashoffset="100" stroke-dasharray="100"/></svg>

Bluetooth off

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes bluetooth-off{to{stroke-dashoffset:0}}</style><path stroke="#0A0A30" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M7.441 15.954l8.653-7.55a.5.5 0 00-.03-.777l-3.678-2.76a.5.5 0 00-.8.4v13.458a.5.5 0 00.802.398l3.666-2.785a.5.5 0 00.014-.785L7.441 8.494"/><path stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M19.274 6.117L5.098 17.883" style="animation:bluetooth-off 2s infinite cubic-bezier(.99,-.1,.01,1.02) alternate" stroke-dashoffset="100" stroke-dasharray="100"/></svg>

Homepod

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes homepad{0%{transform:scale(.2);opacity:.8}80%{transform:scale(1.2);opacity:0}to{transform:scale(2.2);opacity:0}}</style><rect width="14" height="14" x="5" y="5" fill="#265BFF" rx="7" style="animation:homepad 1.5s cubic-bezier(.165,.84,.44,1) infinite both;transform-origin:center center"/><ellipse cx="12" cy="7.389" fill="#265BFF" rx="1.719" ry=".73"/><path fill="#0A0A30" d="M12 8.665c1.375 0 2.49-.473 2.49-1.057a.49.49 0 00-.055-.22A2 2 0 0116 9.342v6a2 2 0 01-2 2h-4a2 2 0 01-2-2v-6A2 2 0 019.565 7.39a.49.49 0 00-.054.22c0 .583 1.114 1.056 2.489 1.056z"/></svg>

Mic off

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes mic-off{to{stroke-dashoffset:0}}</style><rect width="5.122" height="9.388" x="9.439" y="5.164" fill="#0A0A30" stroke="#0A0A30" stroke-width="1.278" rx="2.561"/><path fill="#0A0A30" d="M16.794 12.02c.311 0 .566.252.537.561a5.944 5.944 0 01-.382 1.609 5.706 5.706 0 01-1.161 1.84 5.347 5.347 0 01-1.738 1.23 5.12 5.12 0 01-1.386.387.671.671 0 01.006.084v1.339a.67.67 0 01-1.34 0v-1.34c0-.028.002-.056.005-.083a5.12 5.12 0 01-1.385-.388 5.347 5.347 0 01-1.738-1.23 5.706 5.706 0 01-1.161-1.84 5.945 5.945 0 01-.382-1.608c-.029-.31.226-.562.537-.562.31 0 .56.253.596.562.047.395.144.783.289 1.153.212.543.524 1.037.917 1.453.393.416.86.746 1.373.971a4.028 4.028 0 003.238 0c.514-.225.98-.555 1.373-.97.393-.417.705-.91.917-1.454.145-.37.242-.758.29-1.153.036-.31.284-.562.595-.562z"/><path stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M18.514 5.486L5.487 18.513" style="animation:mic-off 2s infinite cubic-bezier(.99,-.1,.01,1.02) alternate" stroke-dashoffset="100" stroke-dasharray="100"/></svg>

Vibration

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="25" fill="none"><style>@keyframes mobile-vibration{0%,to{transform:translateX(0)}10%,30%,50%,70%{transform:translateX(-1px)}20%,40%,60%,80%{transform:translateX(2px)}90%{transform:translateX(-2px)}}</style><g style="animation:mobile-vibration 1.5s linear infinite both"><path fill="#0A0A30" fill-rule="evenodd" d="M11.55 4.097c-1.275-.341-2.6.469-2.96 1.81L5.75 16.505c-.359 1.341.384 2.705 1.66 3.047l5.04 1.35c1.275.342 2.6-.468 2.96-1.81l2.84-10.597c.359-1.341-.384-2.705-1.66-3.047l-5.04-1.35zm-1.7 2.148c.164-.61.766-.978 1.346-.823l.31.083c-.03.07-.055.142-.075.217-.216.804.23 1.623.995 1.828l1.68.45c.765.205 1.56-.28 1.776-1.086.02-.075.035-.15.044-.225l.31.083c.58.156.917.776.753 1.386l-2.84 10.597c-.162.61-.765.978-1.345.823l-5.04-1.35c-.58-.156-.917-.776-.754-1.386L9.85 6.245zm2.82-.428l2.091.56c.04.071.053.158.03.245a.313.313 0 01-.377.23l-1.68-.45a.312.312 0 01-.211-.388.328.328 0 01.147-.197z" clip-rule="evenodd"/><path stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M6.312 8.905L5.277 12.77m13.446-.539l-1.035 3.864"/></g></svg>

Mouse

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes mouse{0%{transform:translateY(-1px)}to{transform:translateY(1px)}}</style><rect width="8" height="14" x="8" y="5" stroke="#0A0A30" rx="4"/><rect width="1.5" height="3" x="11.25" y="8.703" fill="#265BFF" rx=".75" style="animation:mouse 1s linear infinite alternate both"/></svg>

Smartwatch

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes smartwatch-heart{10%,33%{transform:scale(.85);animation-timing-function:ease-in}17%{transform:scale(1);animation-timing-function:ease-out}45%{transform:scale(1.2);animation-timing-function:ease-out}}</style><path fill="#0A0A30" fill-rule="evenodd" d="M8.867 5.86a3.04 3.04 0 00-3.04 3.04v6.084a3.04 3.04 0 003.04 3.04h6.084a3.04 3.04 0 003.04-3.04v-2.76a.438.438 0 00.688-.36v-2.12a.438.438 0 00-.688-.36V8.9a3.04 3.04 0 00-3.04-3.04H8.867zM7.327 8.9c0-.85.69-1.54 1.54-1.54h6.084c.85 0 1.54.69 1.54 1.54v6.084c0 .85-.69 1.54-1.54 1.54H8.867c-.85 0-1.54-.69-1.54-1.54V8.9z" clip-rule="evenodd"/><path fill="#265BFF" d="M11.879 10.514a.173.173 0 00.242 0 1.11 1.11 0 011.795.35 1.068 1.068 0 01-.238 1.181l-1.327 1.306a.5.5 0 01-.702 0l-1.327-1.306a1.074 1.074 0 010-1.531 1.11 1.11 0 011.557 0z" style="animation:smartwatch-heart 1.5s linear infinite both;transform-origin:center"/><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M10.253 4.202h4m-4 15.479h4"/></svg>

Smartwatch 2

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes smartwatch{to{stroke-dashoffset:0}}</style><path fill="#0A0A30" fill-rule="evenodd" d="M8.867 5.86a3.04 3.04 0 00-3.04 3.04v6.084a3.04 3.04 0 003.04 3.04h6.084a3.04 3.04 0 003.04-3.04v-2.76a.438.438 0 00.688-.36v-2.12a.438.438 0 00-.688-.36V8.9a3.04 3.04 0 00-3.04-3.04H8.867zM7.327 8.9c0-.85.69-1.54 1.54-1.54h6.084c.85 0 1.54.69 1.54 1.54v6.084c0 .85-.69 1.54-1.54 1.54H8.867c-.85 0-1.54-.69-1.54-1.54V8.9z" clip-rule="evenodd"/><path stroke="#265BFF" stroke-linecap="round" stroke-linejoin="round" stroke-width=".8" d="M9 11.768h1.654l.654-1.322 1.23 3 .423-1.678H15" style="animation:smartwatch 2s infinite cubic-bezier(.99,-.1,.01,1.02)" stroke-dashoffset="100" stroke-dasharray="100"/><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M10 4.202h4m-3.747 15.479h4"/></svg>

Speaker

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes speaker-beat{10%{transform:scale(.91);animation-timing-function:ease-in}17%{transform:scale(.98);animation-timing-function:ease-out}33%{transform:scale(.87);animation-timing-function:ease-in}45%{transform:scale(1);animation-timing-function:ease-out}}</style><rect width="12" height="16" x="6" y="4" stroke="#0A0A30" stroke-width="1.5" rx="4"/><circle cx="12" cy="8" r="1" fill="#0A0A30"/><circle cx="12" cy="14" r="2.192" stroke="#265BFF" stroke-width="1.5" style="animation:speaker-beat .5s linear infinite both;transform-origin:center center"/></svg>

Candle 2

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes candle-2{10%,30%,50%,70%,90%{transform:translate3d(-.2px,0,0)}20%,40%,60%,80%{transform:translate3d(.2px,0,0)}}</style><path fill="#0A0A30" fill-rule="evenodd" d="M9.592 10.192l2-1.363c1.66-1.132 3.908.057 3.908 2.065v7.108a2.5 2.5 0 01-2.5 2.5h-2a2.5 2.5 0 01-2.5-2.5v-5.744a2.5 2.5 0 011.092-2.066zm.845 1.24a1 1 0 00-.437.826v1.085l4-2.398v-.05a1 1 0 00-1.563-.827l-2 1.364zM10 16.778v-1.686l4-2.398v1.686l-4 2.398zm.111 1.683a1 1 0 00.889.541h2a1 1 0 001-1V16.13l-3.889 2.331z" clip-rule="evenodd"/><path fill="#265BFF" d="M11.567 3.21a.5.5 0 01.866 0l.878 1.52a1.513 1.513 0 11-2.622 0l.878-1.52z" style="animation:candle-2 2s ease infinite"/></svg>

Christmas Snow

 <svg viewBox="0 0 24 24" width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><style>@keyframes snows-ch{0%{opacity:0;transform:translateY(-10%)}50%{opacity:1}80%{opacity:.8}to{transform:translateY(10%);opacity:0}}.prefix__c-snow1{animation:snows-ch 3s infinite both}</style><path fill-rule="evenodd" clip-rule="evenodd" d="M7.691 8.811a.51.51 0 01.421-.198.51.51 0 01.44.222l1.507 2.2a.734.734 0 01-.18 1.012l1.053 1.763a.868.868 0 01-.47 1.268l.876 1.157a1.19 1.19 0 01-.949 1.908H8.51v1.366a.51.51 0 11-1.019 0v-1.366H5.61a1.19 1.19 0 01-.948-1.908l.876-1.157a.868.868 0 01-.47-1.268l1.057-1.771a.725.725 0 01-.138-1.025L7.69 8.81zm-.662 2.522l1.06-1.37.923 1.347a.738.738 0 00-.275.737l-.676.205-1.068.322.189-.316a.724.724 0 00-.153-.925zm-.812 2.541l-.157.263c.431.126.688.57.605.998l2.897-.767a.847.847 0 01.378-.231l-.702-1.176-1.19.36-1.831.553zm-.742 2.977l.34-.449a.505.505 0 00.11-.017l3.54-.937c.01.015.02.03.032.044l1.028 1.359a.17.17 0 01-.136.272H5.611a.17.17 0 01-.136-.272zM16.193 5.133a.322.322 0 01.266-.125.322.322 0 01.278.14l.953 1.39a.464.464 0 01-.114.641l.666 1.114a.549.549 0 01-.297.802l.553.732a.752.752 0 01-.6 1.206H16.71v.863a.322.322 0 11-.644 0v-.863h-1.188a.752.752 0 01-.6-1.206l.553-.732a.549.549 0 01-.297-.802l.669-1.12a.459.459 0 01-.088-.647l1.078-1.393zm-.419 1.595l.67-.866.584.851a.466.466 0 00-.174.466l-.427.13-.675.203.119-.2a.458.458 0 00-.097-.584zm-.513 1.606l-.1.166c.273.08.436.36.383.631l1.831-.485a.536.536 0 01.24-.146l-.444-.743-.752.227-1.158.35zm-.47 1.882l.216-.284a.323.323 0 00.07-.01l2.238-.593c.006.01.012.019.02.028l.65.859a.107.107 0 01-.086.172h-3.021a.107.107 0 01-.086-.172z" fill="#0A0A30"/><circle class="prefix__c-snow1" cx="10.831" cy="3.5" r=".75" fill="#265BFF"/><circle cx="14.874" cy="12.968" r=".75" fill="#265BFF" style="animation:snows-ch 3s infinite both"/><circle class="prefix__c-snow1" cx="18" cy="16.75" r=".75" fill="#265BFF"/><circle cx="19.5" cy="5" r=".75" fill="#265BFF" style="animation:snows-ch 3s infinite both"/><circle class="prefix__c-snow1" cx="3.75" cy="11.468" r=".75" fill="#265BFF"/></svg>

Gift 2

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes c-gift-slide{0%{transform:translateX(30px);opacity:0}50%{transform:translateX(0);opacity:1}to{transform:translateX(-30px);opacity:1}}</style><g style="animation:c-gift-slide 3s cubic-bezier(.51,-.16,.3,1.27) both infinite"><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M4.114 12.649v1a2 2 0 002 2h13.528"/><path fill="#265BFF" fill-rule="evenodd" d="M9.51 7.644a.465.465 0 00-.721.589c.095.117.323.289.57.4.12.054.229.086.313.094.086.008.111-.012.111-.012s.024-.02.034-.107a1.05 1.05 0 00-.03-.325c-.058-.264-.182-.522-.277-.639zm-1.008-.499a1.024 1.024 0 011.44.146c.065.079.127.18.184.292.056-.113.119-.213.183-.292a1.024 1.024 0 111.586 1.295c-.164.202-.471.42-.773.556a1.595 1.595 0 01-.49.14.704.704 0 01-.506-.126.704.704 0 01-.507.126 1.595 1.595 0 01-.49-.14c-.301-.136-.608-.354-.773-.556a1.024 1.024 0 01.146-1.44zm2.894.433a.465.465 0 00-.655.066c-.095.117-.218.375-.277.639a1.05 1.05 0 00-.03.325c.01.087.034.107.034.107s.025.02.112.012a1.05 1.05 0 00.313-.094c.247-.111.474-.283.57-.4a.465.465 0 00-.067-.655zm4.214-2.022a.465.465 0 10-.721.589c.095.117.323.289.57.4.12.054.229.085.313.093.086.009.11-.01.111-.01 0-.001.024-.021.034-.108a1.05 1.05 0 00-.03-.325c-.059-.264-.182-.522-.277-.639zm-1.008-.499a1.024 1.024 0 011.44.146c.065.079.127.18.184.291a1.62 1.62 0 01.183-.29 1.024 1.024 0 111.586 1.294c-.165.201-.471.42-.774.556a1.595 1.595 0 01-.488.14.704.704 0 01-.507-.126.704.704 0 01-.507.126 1.595 1.595 0 01-.49-.14c-.301-.136-.608-.355-.773-.556a1.024 1.024 0 01.146-1.44zm2.894.433a.465.465 0 00-.655.066c-.095.117-.218.375-.277.639a1.05 1.05 0 00-.03.325c.01.087.034.107.034.107s.025.02.112.011a1.05 1.05 0 00.313-.093c.246-.111.474-.283.57-.4a.465.465 0 00-.067-.655z" clip-rule="evenodd"/><mask id="prefix__a" fill="#fff"><rect width="7.1" height="7.051" x="6.576" y="9.068" rx="1"/></mask><rect width="7.1" height="7.051" x="6.576" y="9.068" stroke="#0A0A30" stroke-width="3" mask="url(#prefix__a)" rx="1"/><mask id="prefix__b" fill="#fff"><rect width="8" height="9.205" x="12.226" y="6.915" rx="1"/></mask><rect width="8" height="9.205" x="12.226" y="6.915" stroke="#0A0A30" stroke-width="3" mask="url(#prefix__b)" rx="1"/><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M9.022 16l-2.446 2.446M17.022 16l-2.38 2.38m-10.528.123h16.111"/></g></svg>

Snow Globe

 <svg viewBox="0 0 24 24" width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><style>@keyframes g-snows{0%{opacity:0;transform:translateY(-2%)}50%{opacity:1}80%{opacity:.8}to{transform:translateY(2%);opacity:0}}.prefix__g-snow1{animation:g-snows 2s infinite both}</style><path fill-rule="evenodd" clip-rule="evenodd" d="M12 5.206a6.25 6.25 0 00-4.693 10.378c.075-.01.15-.014.228-.014H9.1v-2.115c0-.464.184-.91.513-1.237l1.15-1.15a1.75 1.75 0 012.474 0l1.15 1.15c.329.328.513.773.513 1.237v2.114h1.16c.196 0 .385.033.563.093A6.25 6.25 0 0012 5.206zm1.955 11.864a.749.749 0 00.39 0h1.716a.25.25 0 01.239.175l.38 1.225a.25.25 0 01-.24.324H7.156a.25.25 0 01-.239-.324l.38-1.224a.25.25 0 01.239-.176h2.12a.75.75 0 00.39 0h3.91zm-.555-1.5v-2.115a.25.25 0 00-.073-.177l-1.15-1.15a.25.25 0 00-.354 0l-1.15 1.15a.25.25 0 00-.073.177v2.114h2.8zm-9.15-4.114c0 1.883.673 3.61 1.79 4.954-.074.12-.134.252-.177.391l-.38 1.225a1.75 1.75 0 001.672 2.268h9.286a1.75 1.75 0 001.671-2.268l-.38-1.225a1.72 1.72 0 00-.032-.094 7.75 7.75 0 10-13.45-5.25z" fill="#0A0A30"/><circle class="prefix__g-snow1" cx="8.543" cy="8.75" r=".75" fill="#265BFF"/><circle cx="12" cy="7.25" r=".75" fill="#265BFF" style="animation:g-snows 3s infinite both"/><circle class="prefix__g-snow1" cx="15.25" cy="8.751" r=".75" fill="#265BFF"/><circle cx="16.75" cy="12" r=".75" fill="#265BFF" style="animation:g-snows 1.5s infinite both"/><circle class="prefix__g-snow1" cx="7.793" cy="12" r=".75" fill="#265BFF"/></svg>

Snowman

 <svg viewBox="0 0 24 24" width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><style>@keyframes snowman-right{0%{transform:rotate(0)}to{transform:rotate(9deg)}}@keyframes snowman-left{0%{transform:rotate(0)}to{transform:rotate(8deg)}}</style><path fill-rule="evenodd" clip-rule="evenodd" d="M19.651 9.797a.5.5 0 10-.935-.354l-.72 1.905-2.768 1.756a.5.5 0 00.536.845l2.658-1.687h2.046a.5.5 0 100-1h-1.37l.553-1.465z" fill="#265BFF" style="animation:snowman-right .5s ease-in-out both alternate-reverse infinite;transform-origin:center"/><path fill-rule="evenodd" clip-rule="evenodd" d="M4.349 9.797a.5.5 0 01.935-.354l.72 1.905 2.768 1.756a.5.5 0 01-.536.845l-2.658-1.687H3.532a.5.5 0 010-1h1.37L4.35 9.797z" fill="#265BFF" style="animation:snowman-left .5s ease-in-out both alternate-reverse infinite;transform-origin:56% 57%"/><circle cx="12" cy="15.762" r="4" stroke="#0A0A30" stroke-width="1.5"/><circle cx="12" cy="8.762" r="2.45" stroke="#0A0A30" stroke-width=".9"/><rect x="10.75" y="7.909" width="1" height="1" rx=".5" fill="#0A0A30"/><rect x="12.25" y="7.909" width="1" height="1" rx=".5" fill="#0A0A30"/><path fill-rule="evenodd" clip-rule="evenodd" d="M10.5 4.5A.5.5 0 0111 4h2a.5.5 0 01.5.5v1c0 .037.004.074.012.109h-3.024A.504.504 0 0010.5 5.5v-1zm-.988 1.109A.502.502 0 019.5 5.5v-1A1.5 1.5 0 0111 3h2a1.5 1.5 0 011.5 1.5v1a.504.504 0 01-.012.109H16a.5.5 0 010 1H8a.5.5 0 010-1h1.512z" fill="#0A0A30"/></svg>

Snowman 2

 <svg viewBox="0 0 24 24" width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><style>@keyframes snowman2-right{0%{transform:rotate(0)}to{transform:rotate(9deg)}}@keyframes snowman2-left{0%{transform:rotate(0)}to{transform:rotate(8deg)}}</style><path fill-rule="evenodd" clip-rule="evenodd" d="M20.183 8.534a.5.5 0 00-.935-.353l-.72 1.905-2.768 1.756a.5.5 0 00.536.845L18.954 11H21a.5.5 0 100-1h-1.37l.553-1.466z" fill="#265BFF" style="animation:snowman2-right .5s ease-in-out both alternate-reverse infinite;transform-origin:center"/><path fill-rule="evenodd" clip-rule="evenodd" d="M4.881 8.534a.5.5 0 11.935-.353l.72 1.905 2.768 1.756a.5.5 0 11-.536.845L6.11 11H4.064a.5.5 0 010-1h1.37l-.553-1.466z" fill="#265BFF" style="animation:snowman2-left .5s ease-in-out both alternate-reverse infinite;transform-origin:56% 57%"/><circle cx="12.532" cy="14.5" r="4" stroke="#0A0A30" stroke-width="1.5"/><circle cx="12.532" cy="7.5" r="2.45" stroke="#0A0A30" stroke-width=".9"/><rect x="11.282" y="6.647" width="1" height="1" rx=".5" fill="#0A0A30"/><rect x="12.782" y="6.647" width="1" height="1" rx=".5" fill="#0A0A30"/></svg>

Tree Ornament

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes ornament{to{stroke-dashoffset:10}}</style><path stroke="#265BFF" stroke-linecap="round" stroke-width="1.5" d="M6.5 9.637l1.67 1.486a2 2 0 002.66 0l.34-.303a2 2 0 012.66 0l.34.303a2 2 0 002.66 0l1.67-1.486m-12 6.735l1.67-1.487a2 2 0 012.66 0l.34.304a2 2 0 002.66 0l.34-.304a2 2 0 012.66 0l1.67 1.487" style="animation:ornament 1s linear infinite" stroke-dasharray="1" stroke-dashoffset="1"/><circle cx="12.5" cy="13" r="7" stroke="#0A0A30" stroke-width="1.5"/><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M10.5 6V4.588a1 1 0 011-1h2a1 1 0 011 1V6"/></svg>

Tree Ornament 2

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes tree-orn-2{0%,to{opacity:1}50%{opacity:.2}}.prefix__tree-o2{animation:tree-orn-2 2s infinite both}.prefix__tree-o3{animation:tree-orn-2 1.5s infinite both}</style><rect width="1.062" height="1.062" x="11.469" y="6.794" fill="#265BFF" rx=".531" style="animation:tree-orn-2 1s infinite both"/><rect class="prefix__tree-o2" width="1.062" height="1.062" x="10.406" y="11.369" fill="#265BFF" rx=".531"/><rect class="prefix__tree-o2" width="1.062" height="1.062" x="9.572" y="15.156" fill="#265BFF" rx=".531"/><rect class="prefix__tree-o3" width="1.062" height="1.062" x="11.549" y="14.612" fill="#265BFF" rx=".531"/><rect class="prefix__tree-o2" width="1.062" height="1.062" x="13.526" y="15.156" fill="#265BFF" rx=".531"/><rect class="prefix__tree-o3" width="1.062" height="1.062" x="12.531" y="10.838" fill="#265BFF" rx=".531"/><path fill="#0A0A30" fill-rule="evenodd" d="M11.517 3.397a.796.796 0 01.658-.31.796.796 0 01.686.347l2.357 3.438c.377.55.197 1.242-.28 1.583l1.645 2.755a1.357 1.357 0 01-.735 1.982L17.218 15c.926 1.224.052 2.98-1.483 2.98h-2.938v2.135a.797.797 0 11-1.594 0v-2.134H8.265c-1.535 0-2.409-1.757-1.482-2.981l1.368-1.81a1.357 1.357 0 01-.734-1.981L9.07 8.442a1.134 1.134 0 01-.217-1.603l2.664-3.442zm-1.035 3.942l1.657-2.141 1.442 2.104a1.154 1.154 0 00-.43 1.153l-1.056.32-1.668.503.295-.493a1.132 1.132 0 00-.24-1.446zM9.213 11.31l-.245.41c.674.197 1.076.893.945 1.56l4.528-1.198c.157-.166.358-.294.59-.362l-1.097-1.837-1.859.562-2.862.865zm-1.16 4.652l.531-.701a.803.803 0 00.173-.026l5.534-1.465.048.069 1.607 2.123a.266.266 0 01-.211.426H8.264a.266.266 0 01-.211-.426z" clip-rule="evenodd"/></svg>

Tree

 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes c-tree{0%{transform:rotate(0)}to{transform:rotate(360deg)}}</style><path fill="#0A0A30" fill-rule="evenodd" d="M10.35 9.032a.75.75 0 01.502.934l-.671 2.234 3.215-1.409-.248-.825a.75.75 0 111.436-.432l2.613 8.697a1.75 1.75 0 01-1.676 2.254H8.48a1.75 1.75 0 01-1.676-2.254l2.613-8.697a.75.75 0 01.934-.502zm3.48 3.206l-4.216 1.849-.827 2.754 5.758-2.224-.715-2.379zm-5.59 6.425v-.003l6.738-2.602.783 2.605a.25.25 0 01-.24.322H8.48a.25.25 0 01-.24-.322z" clip-rule="evenodd"/><path fill="#265BFF" fill-rule="evenodd" d="M13.149 4.636l.18-.3-.3.18a2 2 0 01-2.058 0l-.3-.18.18.3a2 2 0 010 2.057l-.18.3.3-.18a2 2 0 012.058 0l.3.18-.18-.3a2 2 0 010-2.057zm1.038.214c.535-.893-.48-1.907-1.372-1.372l-.3.18a1 1 0 01-1.03 0l-.3-.18c-.892-.535-1.907.48-1.372 1.372l.18.3a1 1 0 010 1.029l-.18.3c-.535.893.48 1.908 1.372 1.372l.3-.18a1 1 0 011.03 0l.3.18c.892.536 1.907-.48 1.372-1.372l-.18-.3a1 1 0 010-1.029l.18-.3z" clip-rule="evenodd" style="animation:c-tree 2s linear infinite both;transform-origin:51% 24%"/></svg>

Share

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes slide-right{0%{transform:translateY(0)}to{transform:translateY(-2px)}}</style><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M14.508 9.5H17a2.5 2.5 0 012.5 2.5v5a2.5 2.5 0 01-2.5 2.5H7A2.5 2.5 0 014.5 17v-5A2.5 2.5 0 017 9.5h2.563"/><path fill="#265BFF" d="M12.75 13.667a.75.75 0 01-1.5 0h1.5zm-1.5-8.66a.75.75 0 011.5 0h-1.5zm-1.216 2.551a.75.75 0 11-1.068-1.054l1.068 1.054zM12 4.5l-.534-.527a.75.75 0 011.068 0L12 4.5zm3.034 2.004a.75.75 0 11-1.068 1.054l1.068-1.054zm-3.784 7.163v-8.66h1.5v8.66h-1.5zM8.966 6.504l2.5-2.531 1.068 1.054-2.5 2.531-1.068-1.054zm3.568-2.531l2.5 2.531-1.068 1.054-2.5-2.531 1.068-1.054z" style="animation:slide-right 1s cubic-bezier(1,-.17,.29,.99) infinite alternate both"/></svg>

Share

<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><style>@keyframes slide-right{0%{transform:translateY(0)}to{transform:translateY(-2px)}}</style><path stroke="#0A0A30" stroke-linecap="round" stroke-width="1.5" d="M14.508 9.5H17a2.5 2.5 0 012.5 2.5v5a2.5 2.5 0 01-2.5 2.5H7A2.5 2.5 0 014.5 17v-5A2.5 2.5 0 017 9.5h2.563"/><path fill="#265BFF" d="M12.75 13.667a.75.75 0 01-1.5 0h1.5zm-1.5-8.66a.75.75 0 011.5 0h-1.5zm-1.216 2.551a.75.75 0 11-1.068-1.054l1.068 1.054zM12 4.5l-.534-.527a.75.75 0 011.068 0L12 4.5zm3.034 2.004a.75.75 0 11-1.068 1.054l1.068-1.054zm-3.784 7.163v-8.66h1.5v8.66h-1.5zM8.966 6.504l2.5-2.531 1.068 1.054-2.5 2.531-1.068-1.054zm3.568-2.531l2.5 2.531-1.068 1.054-2.5-2.531 1.068-1.054z" style="animation:slide-right 1s cubic-bezier(1,-.17,.29,.99) infinite alternate both"/></svg>

※当ページで紹介しているアイコンは全て「Potlab Icons」のものを掲載しています。

  • URLをコピーしました!
  • URLをコピーしました!

Comment

コメントする

※コメントは承認制です。管理人が承認次第、表示されます
Thanks for your comment!

Contents