LibraryCSSÜcretsiz Saf CSS Efekt Kütüphanesi

Öne çıkanlar

En popüler CSS efektleri

Kütüphanedeki 9.078 efekt, en çok incelenenden başlayarak sıralandı. Hepsi saf CSS — kopyala, yapıştır, çalışır; kütüphane veya derleme adımı gerekmez.

Canlı incele Navigation

Arrow Triple Stack Navbar

Nav with triple-stacked arrow indicators on the active item.

#hover #transform

Canlı incele Navigation

Arrow Wave Flow Navbar

Nav with wavy arrow flow separators between items.

#hover #animation #transform

Canlı incele Navigation

Arrow Zigzag Flow Navbar

Nav with zigzag-shaped arrow flow separators.

#hover #animation #transform

Canlı incele Navigation

Aurora Background Navbar

Navbar with aurora-like animated gradient blobs.

#hover #animation #gradient

Canlı incele Navigation

Blurred Glass Navbar

Navbar with heavy backdrop blur and gradient border.

#hover #gradient #shadow

Canlı incele Navigation

Bob Buoyant Navbar

Links bob up and down buoyantly on hover.

#hover #animation #gradient

Canlı incele Navigation

Bordered Bottom Navbar

Navbar with thick gradient bottom border.

#hover #gradient #shadow

Canlı incele Navigation

Bordered Top Navbar

Navbar with thick gradient top border.

#hover #gradient #shadow

Canlı incele Navigation

Fixed Bottom Nav

Fixed bottom navigation bar with icons.

#hover #transform

Canlı incele Navigation

Glass Bottom Nav

Glassmorphism bottom navigation.

#hover #shadow #border

Canlı incele Navigation

Glow Bottom Nav

Bottom nav with glowing active item.

#hover #shadow #border

Canlı incele Navigation

Gradient Bottom Nav

Bottom nav with gradient active icon.

#hover #gradient #transform

Canlı incele Navigation

Bounce Drop Navbar

Hovered links drop and bounce in from above with an overshoot.

#hover #transform

Canlı incele Navigation

Breathe Glow Navbar

Active link breathes with a soft expanding glow halo.

#hover #animation #shadow

Canlı incele Navigation

Brutalist Navbar

Raw brutalist navbar with thick borders and offset shadow.

#hover #transform #shadow

Canlı incele Navigation

3D Rotate Hamburger

Hamburger with full 3D rotation on hover.

#hover #transform #border

Canlı incele Navigation

Bounce Hamburger

Hamburger that bounces on hover.

#hover #animation #transform

Canlı incele Navigation

Circle Hamburger

Hamburger inside a circle that morphs on hover.

#hover #transform #border

Canlı incele Navigation

Flip Hamburger

Hamburger that flips on Y axis.

#hover #transform #border

Canlı incele Navigation

Morph to Arrow Hamburger

Hamburger that morphs into a left arrow.

#hover #transform #border

Canlı incele Navigation

Morph to X Hamburger

Hamburger menu icon that morphs to X on hover.

#hover #transform #border

Canlı incele Navigation

Rotate Hamburger

Hamburger with rotating lines on hover.

#hover #transform #border

Canlı incele Navigation

Spin Hamburger

Hamburger that spins 180 degrees on hover.

#hover #transform #border

Canlı incele Navigation

Square Hamburger

Hamburger inside a square that morphs on hover.

#hover #transform #border

Canlı incele Navigation

To Arrow Hamburger

Hamburger that becomes an arrow on hover.

#hover #transform #border

Canlı incele Navigation

To Close Hamburger

Hamburger that becomes an X close icon on hover.

#hover #transform #border

Canlı incele Navigation

To Dots Hamburger

Hamburger that becomes 3 vertical dots on hover.

#hover #transform #border

Canlı incele Navigation

To Grid Hamburger

Hamburger that becomes a 3x3 grid of dots on hover.

Canlı incele Navigation

To Minus Hamburger

Hamburger that becomes a minus line on hover.

#hover #transform #border

Canlı incele Navigation

To Plus Hamburger

Hamburger that becomes a plus sign on hover.

#hover #transform #border

Canlı incele Navigation

Center Logo Navbar

Navbar with the logo centered and split links.

#hover #transform #border

Canlı incele Navigation

Claymorphism Navbar

Soft clay-style navbar with rounded pill links.

#hover #transform #shadow

Canlı incele Navigation

Color Ripple Hover Navbar

Color ripples outward from each link on hover with a radial gradient.

#hover #gradient #transform

Canlı incele Navigation

Color Shift Navbar

Navbar with hue-shifting links on hover.

#hover #animation #gradient

Canlı incele Navigation

Fuzzy Match Palette

Command palette that highlights matched letters in the query string.

Canlı incele Navigation

Keyboard Command Palette

Command palette where each item shows its keyboard shortcut hint.

#hover #shadow #border

Canlı incele Navigation

Recent Commands Palette

Palette grouping commands into Recent and All sections.

#hover #transform #shadow

Canlı incele Navigation

Search Command Palette

Command palette with a search input and filtered command rows.

#hover #shadow #border

Canlı incele Navigation

Coupon Clip Corner Nav

Nav items styled as coupons with clipped circular corners.

#hover #gradient #transform

Canlı incele Navigation

3D Arrow Breadcrumbs

Breadcrumbs with 3D arrow separators.

#hover #gradient #transform

Canlı incele Navigation

3D Chevron Breadcrumbs

Breadcrumbs with 3D chevron separators.

#hover #gradient #transform

Canlı incele Navigation

Animated Arrow Breadcrumbs

Breadcrumbs with animated moving arrows.

#hover #animation #transform

Canlı incele Navigation

Filled Arrow Breadcrumbs

Breadcrumbs styled as filled arrow shapes.

#hover #gradient

Canlı incele Navigation

Arrow Flow Breadcrumbs

Breadcrumbs with arrow-shaped separators.

#hover #gradient

Canlı incele Navigation

Outline Arrow Breadcrumbs

Breadcrumbs with outlined arrow shapes.

Canlı incele Navigation

Background Highlight Breadcrumbs

Breadcrumbs with hover background highlight.

Canlı incele Navigation

Chevron Breadcrumbs

Breadcrumbs with chevron separators.

Canlı incele Navigation

Chevron Fill Breadcrumbs

Breadcrumbs with filled chevron-shaped items.

#hover #gradient

Canlı incele Navigation

Chevron Outline Breadcrumbs

Breadcrumbs with outlined chevron shapes.

Canlı incele Navigation

Circle Background Breadcrumbs

Breadcrumbs with circular item backgrounds.

#hover #gradient #transform

Canlı incele Navigation

Color Active Breadcrumbs

Breadcrumbs with color change on active item.

Canlı incele Navigation

Curve Arrow Breadcrumbs

Breadcrumbs with curved arrow separators.

#hover #transform

Canlı incele Navigation

Curve Line Breadcrumbs

Breadcrumbs with curved SVG-like line separators.

#hover #transform

Canlı incele Navigation

Dashed Trail Breadcrumbs

Breadcrumbs with dashed connecting lines.

#hover #transform #border

Canlı incele Navigation

Diagonal Arrow Breadcrumbs

Breadcrumbs with diagonal arrow separators.

#hover #transform

Canlı incele Navigation

Dot Separator Breadcrumbs

Breadcrumbs with dot separators.

#hover #transform

Canlı incele Navigation

Dot Trail Breadcrumbs

Breadcrumbs with a trail of dots leading to active.

#hover #gradient

Canlı incele Navigation

Dotted Trail Breadcrumbs

Breadcrumbs with dotted connecting lines.

#hover #transform #border

Canlı incele Navigation

Floating Arrow Breadcrumbs

Breadcrumbs with floating arrow separators on hover.

#hover #transform

Canlı incele Navigation

Glow Active Breadcrumbs

Breadcrumbs with glow on active item.

Canlı incele Navigation

Glow Trail Breadcrumbs

Breadcrumbs with a glowing connecting trail.

#hover #transform #shadow

Canlı incele Navigation

Gradient Arrow Breadcrumbs

Breadcrumbs with gradient arrow separators.

#hover #animation #gradient

Canlı incele Navigation

Greater Than Breadcrumbs

Breadcrumbs with > separators.

Canlı incele Navigation

Home Icon Breadcrumbs

Breadcrumbs starting with a home icon.

Canlı incele Navigation

Hover Glow Breadcrumbs

Breadcrumbs with glow on hover.

Canlı incele Navigation

Hover Grow Breadcrumbs

Breadcrumbs that grow on hover.

#hover #gradient #transform

Canlı incele Navigation

Hover Rotate Breadcrumbs

Breadcrumbs that rotate slightly on hover.

#hover #gradient #transform

Canlı incele Navigation

Hover Shift Breadcrumbs

Breadcrumbs that shift right on hover.

#hover #transform

Canlı incele Navigation

Hover Underline Breadcrumbs

Breadcrumbs with animated underline on hover.

Canlı incele Navigation

Icon Text Breadcrumbs

Breadcrumbs with icons and text.

Canlı incele Navigation

Line Separator Breadcrumbs

Breadcrumbs with vertical line separators.

#hover #transform

Canlı incele Navigation

Mini Tab Breadcrumbs

Breadcrumbs styled as mini tabs.

#hover #shadow #border

Canlı incele Navigation

Neon Separator Breadcrumbs

Dark mode breadcrumbs with neon separators.

#hover #transform #shadow

Canlı incele Navigation

Pentagon Shape Breadcrumbs

Breadcrumbs shaped as pentagons with point tips.

#hover #gradient

Canlı incele Navigation

Pill Active Breadcrumbs

Breadcrumbs with pill shape on active item.

#hover #gradient #shadow

Canlı incele Navigation

Pill Background Breadcrumbs

Breadcrumbs with pill-shaped items.

#hover #gradient #shadow

Canlı incele Navigation

Pipe Separator Breadcrumbs

Breadcrumbs with pipe separators.

Canlı incele Navigation

Progress Bar Breadcrumbs

Breadcrumbs with a progress bar underneath.

#hover #gradient

Canlı incele Navigation

Progress Line Breadcrumbs

Breadcrumbs with a connecting progress line.

#hover #gradient

Canlı incele Navigation

Shadow Active Breadcrumbs

Breadcrumbs with shadow on active item.

Canlı incele Navigation

Slash Separator Breadcrumbs

Breadcrumbs with slash separators.

Canlı incele Navigation

Square Background Breadcrumbs

Breadcrumbs with square item backgrounds.

Canlı incele Navigation

Step Counter Breadcrumbs

Breadcrumbs with numbered step counter.

Canlı incele Navigation

Text Only Breadcrumbs

Minimal text-only breadcrumbs.

Canlı incele Navigation

Triangle Tip Breadcrumbs

Breadcrumbs with triangle pointed tips.

#hover #gradient #transform

Canlı incele Navigation

Underline Active Breadcrumbs

Breadcrumbs with underline on active item.

#hover #transform

Canlı incele Navigation

Vertical Line Breadcrumbs

Vertical breadcrumbs with line connectors.

#hover #transform #shadow

Canlı incele Navigation

Wavy Trail Breadcrumbs

Breadcrumbs with wavy connecting separators.

#hover #transform

Canlı incele Navigation

Zigzag Trail Breadcrumbs

Breadcrumbs with zigzag pattern separators.

#hover #transform

Canlı incele Navigation

Curtain Fall Reveal Nav

Nav links revealed as a curtain falls downward on hover.

#hover #gradient #transform

Canlı incele Navigation

Curtain Rise Reveal Nav

Nav links revealed as a curtain rises upward on hover.

#hover #gradient #transform

Canlı incele Navigation

Curtain Split Reveal Nav

Two curtains split apart horizontally to reveal the nav links.

#hover #gradient #transform

Canlı incele Navigation

Curved Bottom Navbar

Navbar with a curved bottom edge using border-radius.

Kategoriye göre gez

Butonlar Kartlar Yükleyiciler Metin Arka Planlar Onay Kutuları Anahtarlar Hover Rozetler Formlar Navigasyon İpuçları

Popüler etiketler

#transform5765 #shadow5548 #gradient4959 #border3831 #animation3495 #hover2879 #filter2139 #3d188 #rotate35 #glow21 #switch19 #clip-path9 #glass7 #wave7 #css6 #dots5 #pulse3