İçeriğe geç
LibraryCSS
Yükleyiciler

Saw Blade

Circular saw blade spinning with toothed edge.

Görüntülenme
0
Ücretsiz

Önizleme izole bir çerçevede çalışır — efekt sayfanın stillerini etkilemez.

Saw Blade kaynak kodu

Üyelere açık
.fx-loader-saw-blade{width:64px;height:64px;border-radius:50%;background:conic-gradient(from 0deg,#cbd5e1 0 5deg,#94a3b8 5deg 10deg,#cbd5e1 10deg 15deg,#94a3b8 15deg 20deg,#cbd5e1 20deg 25deg,#94a3b8 25deg 30deg,#cbd5e1 30deg 35deg,#94a3b8 35deg 40deg,#cbd5e1 40deg 45deg,#94a3b8 45deg 50deg,#cbd5e1 50deg 55deg,#94a3b8 55deg 60deg,#cbd5e1 60deg 65deg,#94a3b8 65deg 70deg,#cbd5e1 70deg 75deg,#94a3b8 75deg 80deg,#cbd5e1 80deg 85deg,#94a3b8 85deg 90deg,#cbd5e1 90deg 95deg,#94a3b8 95deg 100deg,#cbd5e1 100deg 360deg);position:relative;animation:fx-ldr-saw-blade 0.5s linear infinite;box-shadow:0 0 0 2px #475569}
.fx-loader-saw-blade::after{content:"";position:absolute;inset:35%;border-radius:50%;background:radial-gradient(circle,#475569,#1e293b);box-shadow:inset 0 0 0 2px #94a3b8}
@keyframes fx-ldr-saw-blade{to{transform:rotate(360deg)}}

Kalan 0 satırı görmek için ücretsiz üye ol

Tüm efektler ücretsiz. Üyelik yalnızca tam kaynağı, kopyalamayı ve tarayıcı içi editörü açar.

Ücretsiz üye olGiriş yap

Bu efektte bir sorun mu var, yoksa daha iyisini mi yazdın? Düzeltme gönder — onaylanırsa puan kazanırsın.

Sorun bildir veya düzelt

Katkıda bulunanlar

LibraryCSSEfekti eklediKurucu
#animation#gradient#transform#shadow

Saw Blade nasıl kullanılır?

  1. 1. HTML parçasını sayfanda kullanmak istediğin yere yapıştır.
  2. 2. CSS bloğunu stil dosyana veya bir <style> etiketine ekle.
  3. 3. Renkleri ve süreleri kendi tasarımına göre değiştir — bağımlılık yok, saf CSS.

Yükleyiciler kategorisindeki tüm efektler gibi bu efekt de tamamen ücretsizdir; ticari projelerde de kullanabilirsin. Kütüphanenin tamamı için Yükleyiciler koleksiyonuna göz at.

Benzer Yükleyiciler efektleri

Tümü