LibraryCSSÜcretsiz Saf CSS Efekt Kütüphanesi

Navigasyon — 552 Ücretsiz CSS Efekti (Sayfa 5)

Menü çubukları, sekmeler ve gezinme bileşenleri.

Tümü saf CSS — kütüphane, derleme adımı veya JavaScript gerekmez. Kodu kopyalamak ve tarayıcı içi editörde denemek için ücretsiz üyelik yeterli.

Canlı incele Navigation

Slant Left Cut Navbar

Nav bar with a slanted diagonal cut on the left edge.

Canlı incele Navigation

Slant Neon Edge Navbar

Slanted nav with pulsing neon pink edge accents.

#hover #animation #shadow

Canlı incele Navigation

Slant Perspective 3D Navbar

Nav with a perspective tilt creating a 3D slanted look.

#hover #transform #shadow

Canlı incele Navigation

Slant Right Cut Navbar

Nav bar with a slanted diagonal cut on the right edge.

Canlı incele Navigation

Slant Rotate Tilt Navbar

Nav with the entire bar slightly rotated for a tilted slant.

#hover #gradient #transform

Canlı incele Navigation

Slant Skew Tilt Navbar

Nav with skew-tilted active item creating a slanted look.

#hover #transform

Canlı incele Navigation

Slant Top Cut Navbar

Nav bar with a slanted diagonal cut at the top edge.

Canlı incele Navigation

Soft Pink Navbar

Soft pink themed navbar with rose accents.

#hover #gradient #shadow

Canlı incele Navigation

Split Arrow Flow Navbar

Nav links separated by arrow flow indicators pointing right.

#hover #animation #transform

Canlı incele Navigation

Split Chevron Flow Navbar

Nav links separated by double-chevron flow indicators.

Canlı incele Navigation

Split Curve Wave Navbar

Nav links with a wavy curve separator between them.

#hover #transform

Canlı incele Navigation

Split Diagonal Cut Navbar

Nav links with diagonal cut separators between them.

Canlı incele Navigation

Split Divider Line Navbar

Nav links separated by thin vertical divider lines.

Canlı incele Navigation

Split Dot Flow Navbar

Nav links separated by pulsing dot flow indicators.

#hover #animation #transform

Canlı incele Navigation

Split Greater Flow Navbar

Nav links separated by greater-than flow indicators.

Canlı incele Navigation

Split Half Divider Navbar

Nav split into two halves with a central vertical divider.

#hover #gradient #shadow

Canlı incele Navigation

Split Horizontal Divider Navbar

Nav links separated by horizontal lines stacked vertically.

#hover #shadow #border

Canlı incele Navigation

Split Layout Navbar

Navbar with brand on left, links center, actions on right.

Canlı incele Navigation

Split Line Dashed Navbar

Nav links separated by dashed line dividers.

#hover #gradient #shadow

Canlı incele Navigation

Split Line Dotted Navbar

Nav links separated by dotted line dividers.

#hover #gradient

Canlı incele Navigation

Split Line Glow Navbar

Nav links separated by glowing line separators.

Canlı incele Navigation

Split Line Gradient Flow Navbar

Nav links separated by animated gradient line dividers.

#hover #animation #gradient

Canlı incele Navigation

Split Pipe Flow Navbar

Nav links separated by vertical pipe flow indicators.

Canlı incele Navigation

Split Quad Grid Navbar

Nav split into four equal quadrants with cross divider.

Canlı incele Navigation

Split Slash Flow Navbar

Nav links separated by slash flow indicators.

Canlı incele Navigation

Split Thirds Grid Navbar

Nav split into three equal columns separated by dividers.

Canlı incele Navigation

Split Vertical Divider Navbar

Nav with prominent vertical divider bars between links.

Canlı incele Navigation

Split Wave Edge Navbar

Nav with a wave-edge border between active and inactive items.

#hover #gradient

Canlı incele Navigation

Split Zigzag Edge Navbar

Nav links with zigzag-edged separators between items.

#hover #transform

Canlı incele Navigation

Spring Pop Navbar

Active link springs outward with a playful pop animation.

#hover #gradient #transform

Canlı incele Navigation

Square Sharp Navbar

Sharp-edged navbar with no rounding.

#hover #transform #border

Canlı incele Navigation

Stamp Ink Rotate Nav

Active link shows a rotated ink stamp badge with skewed impression.

#hover #gradient #transform

Canlı incele Navigation

Stamp Paper Fold Nav

Paper sheet nav with folded corner revealing the active item underneath.

#hover #gradient #transform

Canlı incele Navigation

3D Step Indicator

3D extruded step indicator.

#hover #transform #shadow

Canlı incele Navigation

Checkmarks Step Indicator

Step indicator with checkmarks for done steps.

Canlı incele Navigation

Circular Step Indicator

Step indicator with circular progress ring.

#hover #transform #shadow

Canlı incele Navigation

Dots Step Indicator

Step indicator with dots between numbers.

#hover #transform #shadow

Canlı incele Navigation

Floating Step Indicator

Floating step indicator with hover lift.

#hover #transform #shadow

Canlı incele Navigation

Glow Step Indicator

Dark step indicator with glowing active step.

Canlı incele Navigation

Gradient Step Indicator

Step indicator with animated gradient on active.

#hover #animation #gradient

Canlı incele Navigation

Horizontal Step Indicator

Horizontal step indicator with connecting lines.

Canlı incele Navigation

Neon Step Indicator

Neon themed step indicator.

#hover #transform #shadow

Canlı incele Navigation

Numbered Step Indicator

Horizontal numbered step indicator.

Canlı incele Navigation

Pill Step Indicator

Step indicator with pill-shaped markers.

Canlı incele Navigation

Progress Bar Step Indicator

Step indicator with connecting progress bar.

#hover #gradient #transform

Canlı incele Navigation

Rounded Step Indicator

Step indicator with rounded square markers.

#hover #gradient #transform

Canlı incele Navigation

Square Step Indicator

Step indicator with square markers.

#hover #transform

Canlı incele Navigation

Vertical Step Indicator

Vertical step indicator with connecting line.

Canlı incele Navigation

Sticky Note Curl Nav

Nav items styled as sticky notes with curling corners on hover.

#hover #gradient #transform

Canlı incele Navigation

Sticky Shadow Navbar

Navbar that grows a deep shadow when stuck to top.

Canlı incele Navigation

Sticky Shrink Navbar

Navbar that shrinks padding on hover simulating sticky state.

#hover #shadow #border

Canlı incele Navigation

Sunset Orange Navbar

Sunset orange navbar with warm gradient.

#hover #gradient #shadow

Canlı incele Navigation

Swing Pendulum Navbar

Links swing like a pendulum anchored at the top on hover.

#hover #animation #transform

Canlı incele Navigation

3D Flip Tabs

Tabs with 3D flip animation on active state.

#hover #transform #shadow

Canlı incele Navigation

3D Shadow Tabs

Tabs with deep 3D shadow on active.

#hover #gradient #transform

Canlı incele Navigation

Animated Underline Tabs

Tabs with continuously animated underline.

#hover #animation #gradient

Canlı incele Navigation

Arrow Indicator Tabs

Tabs with an arrow indicator under active tab.

#hover #transform #border

Canlı incele Navigation

Bar Grow Tabs

Tabs with a top bar that grows from center on active.

#hover #transform

Canlı incele Navigation

Circle Background Tabs

Tabs with circle background morph on hover.

#hover #transform

Canlı incele Navigation

Pentagon Background Tabs

Tabs with polygon clip-path background morph.

#hover #gradient

Canlı incele Navigation

Square Background Tabs

Tabs with square background morph on hover.

#hover #gradient #transform

Canlı incele Navigation

Border Bottom Tabs

Classic tabs with active border bottom.

Canlı incele Navigation

Border Box Tabs

Tabs with animated border box on active.

#hover #transform #border

Canlı incele Navigation

Color Shift Tabs

Tabs that shift hue on hover.

#hover #gradient #shadow

Canlı incele Navigation

Corner Marker Tabs

Tabs with corner marker indicator.

#hover #transform

Canlı incele Navigation

Cube Rotate Tabs

Tabs that rotate like a 3D cube on hover.

#hover #gradient #transform

Canlı incele Navigation

Dashed Underline Tabs

Tabs with dashed underline indicator.

#hover #transform #border

Canlı incele Navigation

Dot Indicator Tabs

Tabs with a glowing dot above active tab.

#hover #transform #shadow

Canlı incele Navigation

Dotted Underline Tabs

Tabs with dotted underline indicator.

#hover #transform #border

Canlı incele Navigation

Double Line Tabs

Tabs with double line top and bottom indicator.

#hover #transform

Canlı incele Navigation

Double Underline Tabs

Tabs with double underline indicator.

#hover #transform #border

Canlı incele Navigation

Fill Background Tabs

Tabs with a filling background animation on hover.

#hover #transform

Canlı incele Navigation

Flip 3D Tabs

Tabs with full 3D flip transform on hover.

#hover #gradient #transform

Canlı incele Navigation

Flip Card Tabs

Tabs that flip like cards revealing back face.

#hover #gradient #transform

Canlı incele Navigation

Flip X Tabs

Tabs that flip on X axis on hover.

#hover #transform #shadow

Canlı incele Navigation

Flip Y Tabs

Tabs that flip on Y axis on hover.

#hover #transform #shadow

Canlı incele Navigation

Fold Corner Tabs

Tabs with folded corner effect on active.

#hover #gradient

Canlı incele Navigation

Glow Active Tabs

Active tab with a soft glowing aura.

Canlı incele Navigation

Gradient Background Tabs

Tabs with animated gradient background on active.

#hover #animation #gradient

Canlı incele Navigation

Gradient Underline Tabs

Tabs with animated gradient underline.

#hover #gradient #transform

Canlı incele Navigation

Icon Shift Tabs

Tabs with icon and label that shift on hover.

#hover #transform

Canlı incele Navigation

Bottom Line Tabs

Tabs with thin bottom line indicator.

#hover #transform #border

Canlı incele Navigation

Left Line Tabs

Vertical tabs with left line indicator.

#hover #transform

Canlı incele Navigation

Right Line Tabs

Vertical tabs with right line indicator.

#hover #transform

Canlı incele Navigation

Top Line Tabs

Tabs with thin top line indicator.

#hover #transform

Canlı incele Navigation

Morph Circle Tabs

Active tab morphs into a circle shape.

Canlı incele Navigation

Morph Pill Tabs

Active tab morphs into a pill shape.

Canlı incele Navigation

Morph Square Tabs

Active tab morphs into a square shape.

Canlı incele Navigation

Morph Triangle Tabs

Active tab morphs with triangle clip-path.

#hover #gradient

Canlı incele Navigation

Neon Active Tabs

Neon glowing active tab indicator.

#hover #transform #shadow

Canlı incele Navigation

Pill Morph Tabs

Tabs that morph into pill shape on active.

Canlı incele Navigation

Pressed In Tabs

Tabs that press inward when active.

Canlı incele Navigation

Raised Active Tabs

Active tab appears raised above others.

#hover #gradient #transform

Canlı incele Navigation

Rounded Active Tabs

Fully rounded active tab indicator.

#hover #gradient #shadow

Canlı incele Navigation

Segmented Control Tabs

iOS-style segmented control tabs.

Canlı incele Navigation

Slide Content Tabs

Tabs with sliding content background indicator.

#hover #gradient #transform