LibraryCSSÜcretsiz Saf CSS Efekt Kütüphanesi

#border CSS efektleri

"border" etiketiyle eşleşen 3.995 ücretsiz saf CSS efekti. Hepsi kopyala-yapıştır hazır; kullanmak için kütüphane veya derleme adımı gerekmez.

Canlı incele Navigasyon

Split Thirds Grid Navbar

Nav split into three equal columns separated by dividers.

Canlı incele Navigasyon

Split Vertical Divider Navbar

Nav with prominent vertical divider bars between links.

Canlı incele Navigasyon

Square Sharp Navbar

Sharp-edged navbar with no rounding.

#hover #transform #border

Canlı incele Navigasyon

Stamp Ink Rotate Nav

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

#hover #gradient #transform

Canlı incele Navigasyon

Stamp Paper Fold Nav

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

#hover #gradient #transform

Canlı incele Navigasyon

3D Step Indicator

3D extruded step indicator.

#hover #transform #shadow

Canlı incele Navigasyon

Circular Step Indicator

Step indicator with circular progress ring.

#hover #transform #shadow

Canlı incele Navigasyon

Neon Step Indicator

Neon themed step indicator.

#hover #transform #shadow

Canlı incele Navigasyon

Sticky Shrink Navbar

Navbar that shrinks padding on hover simulating sticky state.

#hover #shadow #border

Canlı incele Navigasyon

3D Shadow Tabs

Tabs with deep 3D shadow on active.

#hover #gradient #transform

Canlı incele Navigasyon

Animated Underline Tabs

Tabs with continuously animated underline.

#hover #animation #gradient

Canlı incele Navigasyon

Arrow Indicator Tabs

Tabs with an arrow indicator under active tab.

#hover #transform #border

Canlı incele Navigasyon

Icon Tab Bar

A mobile style tab bar where the selected item lifts and reveals its caption.

#hover #transform #shadow

Canlı incele Navigasyon

Border Bottom Tabs

Classic tabs with active border bottom.

Canlı incele Navigasyon

Border Box Tabs

Tabs with animated border box on active.

#hover #transform #border

Canlı incele Navigasyon

Dashed Underline Tabs

Tabs with dashed underline indicator.

#hover #transform #border

Canlı incele Navigasyon

Dotted Underline Tabs

Tabs with dotted underline indicator.

#hover #transform #border

Canlı incele Navigasyon

Double Underline Tabs

Tabs with double underline indicator.

#hover #transform #border

Canlı incele Navigasyon

Gradient Underline Tabs

Tabs with animated gradient underline.

#hover #gradient #transform

Canlı incele Navigasyon

Bottom Line Tabs

Tabs with thin bottom line indicator.

#hover #transform #border

Canlı incele Navigasyon

Raised Active Tabs

Active tab appears raised above others.

#hover #gradient #transform

Canlı incele Navigasyon

Underline Slide Tabs

Tabs with sliding underline indicator on active state.

#hover #transform #border

Canlı incele Navigasyon

Letter Spacing Grow Navbar

Hovered link expands its letter spacing for a refined editorial feel.

#hover #transform #border

Canlı incele Navigasyon

Ticket Stub Perforate Nav

Nav styled as ticket stubs with perforated edges between items.

#hover #transform #shadow

Canlı incele Navigasyon

Ticket Stub Tear Nav

Active ticket stub torn along its perforation edge on hover.

#hover #transform #shadow

Canlı incele Navigasyon

Vibrant Pop Navbar

Vibrant colorful navbar with bold contrast.

#hover #transform #shadow

Canlı incele Navigasyon

Vertical Tab Left Arrow Pointer

Vertical tabs with a left-pointing arrow on the active item.

#hover #transform #border

Canlı incele Navigasyon

Vertical Tab Right Border Active

Vertical tabs with a right accent border on the active item.

#hover #shadow #border

Canlı incele İlerleme

Conduit Sync Progress

Two chasing arrow arcs turn forever beside a device count and the current sync share.

#sync #animation #rotate

Canlı incele İlerleme

Pearl Cell Progress

A battery shaped indicator with a moulded cap and a pearl fill sitting at seventy eight percent.

#flexbox #gradient #border

Canlı incele İlerleme

Stark Dash Progress

A brutalist meter with a hard offset shadow, three pixel outlines and a dashed leading edge.

#brutalism #monospace #border

Canlı incele Kaydırıcılar

Marble Ring Slider

A hollow marble ring floats over a shallow channel and shows the rail through it.

#slider #ring #border

Canlı incele Sekmeler

Anvil Status Filter Tabs

Status filters with a heavy two pixel frame and no shadow, struck flat.

#border #animation #layout

Canlı incele Sekmeler

Coil Carton Tabs

Corrugated cardboard tabs whose panel unrolls out of its own top left corner.

#pattern #transform #border

Canlı incele Sekmeler

Copper Badge Tabs

Each tab carries a count badge and the active one pulses in warm copper.

#animation #badge #border

Canlı incele Sekmeler

Coral Icon Text Tabs

Icon and label together; the icon tilts and grows while an underline opens outward.

#icon #transform #border

Canlı incele Sekmeler

Cusp Cartoon Tabs

Thick outlined comic tabs that squash and spring back the moment they are picked.

#animation #border #shadow

Canlı incele Sekmeler

Dash Sketch Tabs

Hand drawn boxes on a notebook where a pencil dash is redrawn under the active tab.

#border #transition #pattern

Canlı incele Sekmeler

Ember Subtitle Tabs

Every tab carries a small caption line that catches fire when the tab is chosen.

#typography #animation #border

Canlı incele Sekmeler

Flange Tier Tabs

Tier tabs where a bolted flange ring fills solid on the plan you open.

#border #gradient #transform

Canlı incele Sekmeler

Gasket Turning Panel Tabs

Panels seat themselves with a combined scale and rotation, like a gasket ring.

#transform #animation #border

Canlı incele Sekmeler

Glacier Package Manager Tabs

Install command tabs for three package managers with a cold monospace command line.

#code #animation #border

Canlı incele Sekmeler

Jade Outline Tabs

Selecting a tab fires a jade ring that expands out of its rounded outline.

#animation #border #shadow

Canlı incele Sekmeler

Onyx Folder Tabs

Browser style folder tabs whose active sheet merges into the panel below.

#border #shadow #transition

Canlı incele Sekmeler

Pulse Brutalist Tabs

Heavy unrounded blocks with a hard offset shadow that springs into place on click.

#border #shadow #transform

Canlı incele Sekmeler

Slate Boxed Tabs

Separate slate boxes lift on selection and the panel rises into place.

#transform #shadow #border

Canlı incele Sekmeler

Socket Privacy Tabs

Privacy levels shaped as sockets; the pin drops into the one you pick.

#animation #shadow #border

Canlı incele Sekmeler

Tether Divider Tabs

Hairline dividers split the tabs and a tether drops from the active one to the panel.

#border #transform #gradient

Canlı incele Sekmeler

Turbine File Format Tabs

Export format tabs with a blade that spins up on the format you select.

#animation #icon #border

Canlı incele Sekmeler

Valve Delivery Tabs

Delivery options whose valve handle turns a quarter and opens the green line.

#transform #border #transition

Canlı incele Sekmeler

Vault Deco Tabs

Gilded art deco plates tilted back in perspective; the chosen one stands upright.

#perspective #transform #border

Canlı incele Sekmeler

Zenith Memphis Tabs

Confetti patterned tabs whose panel deals itself out as three staggered chips.

#animation #pattern #border

Canlı incele Tablolar

Onyx Grid Frame

A fully ruled grid where the hovered cell brightens its own square only.

#table #grid #border

Canlı incele Tablolar

Quartz Hairline Rules

No frame and no vertical lines — only hairline rules separate the data rows.

#table #minimal #border

Canlı incele Metin

Asteroid Belt

Orbiting specks circling around text.

#animation #transform #shadow

Canlı incele Metin

Balanced Pull Quote

text-wrap balance evens out the heading lines and pretty removes orphan words below.

#border #text-wrap #typography

Canlı incele Metin

Brutalist Contrast Stark

Brutalist stark black and white.

Canlı incele Metin

Glass Frost

Frosted glass text with a translucent icy blur.

#shadow #border #filter

Canlı incele Metin

Loading Bar

LOADING text with an underline progress bar that fills and resets.

#gradient #animation #border

Canlı incele Metin

Marquee Scroll

Classic horizontal marquee scrolling text across a dark bar.

#animation #border #transform

Canlı incele Metin

Ransom Note

Ransom note style with mismatched letter sizes.

#transform #border

Canlı incele Metin

Rubber Stamp

Worn rubber stamp text with broken edges.

#transform #border #filter

Canlı incele Metin

Satellite Orbit

Satellite orbiting earth on text.

#animation #transform #shadow

Canlı incele Metin

Saturn Rings

Text with elliptical rings orbiting around it.

#animation #transform #shadow

Canlı incele Metin

Split-Flap Letters

Each letter flips sequentially like a split-flap departure board.

#animation #3d #border

Canlı incele Metin

Ink Stamp

Red ink stamp text with slight imperfections.

#transform #border

Canlı incele Metin

CRT Terminal

Green CRT terminal text in a framed box with a scanning refresh line.

#animation #shadow #border

Canlı incele Metin

Stock Ticker

Green/red stock ticker scrolling prices with up/down arrows.

#animation #border #transform

Canlı incele Metin

Typewriter Cursor

Text appears as if typed character-by-character with a blinking cursor.

#animation #shadow #border

Canlı incele Metin

Multi Typewriter

Typewriter effect revealing text with blinking cursor.

#animation #border

Canlı incele Metin

Vertical News Scroll

Words scroll vertically through a gradient window like a news ticker.

#gradient #animation #border

Canlı incele İpuçları

3D Perspective Zoom

Tooltip that zooms in with a 3D perspective tilt effect.

#hover #transform #border

Canlı incele İpuçları

3D Popout

Tooltip that pops out toward the viewer in 3D perspective.

#hover #transform #border

Canlı incele İpuçları

3D Rotate X

Tooltip that rotates fully on the X axis to appear above the trigger.

#hover #transform #border

Canlı incele İpuçları

3D Tilt X

Tooltip that tilts on the X axis as it appears above the trigger.

#hover #transform #border

Canlı incele İpuçları

3D Tilt Y

Tooltip that tilts on the Y axis as it appears above the trigger.

#hover #transform #border

Canlı incele İpuçları

3D Top

Tooltip with 3D depth shadow above the trigger.

#hover #transform #shadow

Canlı incele İpuçları

Amber Warning

Amber warning tooltip with attention glow above the trigger.

#hover #transform #shadow

Canlı incele İpuçları

Amethyst Purple

Amethyst purple gem tooltip above the trigger.

#hover #gradient #transform

Canlı incele İpuçları

Arrow Clip

Tooltip reveals with an arrow clip-path above the trigger.

#hover #transform #border

Canlı incele İpuçları

Dashed Arrow Bottom

Tooltip below the trigger connected by a dashed line with arrow.

#hover #transform #border

Canlı incele İpuçları

Dashed Arrow Right

Tooltip to the right of the trigger with a dashed connector.

#hover #transform #border

Canlı incele İpuçları

Dashed Arrow Top

Tooltip connected to the trigger by a dashed line with arrow.

#hover #transform #border

Canlı incele İpuçları

Double Arrow Bottom

Tooltip with stacked double-chevron arrow pointing up.

#hover #transform #border

Canlı incele İpuçları

Double Arrow Top

Tooltip with a stacked double-chevron arrow pointing down.

#hover #transform #border

Canlı incele İpuçları

Fading Arrow Tooltip

A classic bubble with a pointed arrow that fades upward into place on hover.

#hover #transform #shadow

Canlı incele İpuçları

Aurora Tip

Aurora borealis gradient tooltip above the trigger.

#hover #animation #gradient

Canlı incele İpuçları

Autumn Leaf

Warm autumn-leaf tooltip in fall colors.

#hover #gradient #transform

Canlı incele İpuçları

Badge Count

Tooltip with notification badge count above the trigger.

#hover #transform #border

Canlı incele İpuçları

Bash Shell

Bash shell style tooltip above the trigger.

#hover #transform #shadow

Canlı incele İpuçları

BG Aurora

Tooltip with aurora gradient background above the trigger.

#hover #animation #gradient

Canlı incele İpuçları

BG Conic

Tooltip with a conic gradient spin above the trigger.

#hover #animation #gradient

Canlı incele İpuçları

BG Dots

Tooltip with dotted pattern background above the trigger.

#hover #gradient #transform

Canlı incele İpuçları

BG Fill

Tooltip background fills up from below above the trigger.

#hover #gradient #transform