astro-swiperzoseiv0.16.0

Tailwind v4 • Astro 7.3.2+ • Swiper v14.2.0

Astro 5+ & 7+ • Swiper v14+ • Tailwind v4

Carruseles Modernos para Astro
Cero JS manual. Puro Tailwind v4.

El componente Swiper definitivo para Astro. Pasa todas las configuraciones directamente como props tipadas, con Intersection Observer inteligente, sincronización de miniaturas y diseño moderno con Tailwind v4.

$pnpm add astro-swiper-zosei swiper

Guía de Props →Explorar 50+ Demos →

Demo Destacada: 3D Cards Effect

100% Declarativo

Tarjeta #1

Aurora Cosmos

Gradiente Dinámico Espacial

Tarjeta #2

Ocean Wave

Olas Geométricas Cían

Tarjeta #3

Sunset Peaks

Atardecer Cálido en Montañas

Tarjeta #4

Emerald Forest

Naturaleza y Vegetación

Tarjeta #5

Cyber Neon

Tailwind CSS v4 & Swiper v14

Catálogo Completo de Demos

Explora más de 50 demostraciones interactivas funcionando con Tailwind CSS v4.

Ver Páginas Dedicadas (/demos) →

CoverFlow Effect

3D Effect

Cube Effect

3D Effect

Creative Transitions

Creative

Fade Transition

Fade

3D Flip Effect

Flip

Cards Stack Effect

Cards

Tarjeta #1

Aurora Cosmos

Gradiente Dinámico Espacial

Tarjeta #2

Ocean Wave

Olas Geométricas Cían

Tarjeta #3

Sunset Peaks

Atardecer Cálido en Montañas

Tarjeta #4

Emerald Forest

Naturaleza y Vegetación

Tarjeta #5

Cyber Neon

Tailwind CSS v4 & Swiper v14

Autoplay Slider

Autoplay

Autoplay with Config

Autoplay

Autoplay Progress Ring

Progress

Arrow Navigation

Navigation

Bullet Pagination

Pagination

Custom Pagination

Custom

Dynamic Pagination Bullets

Dynamic

Fraction Pagination

Fraction

Progressbar Pagination

Progressbar

Custom Scrollbar

Scrollbar

Basic Thumbnail Gallery

Thumbnails

Thumbs Gallery Advanced

Gallery

Thumbs Gallery with Infinite Loop

Loop

Responsive Breakpoints

Responsive

Ratio Breakpoints

Ratio

Multiple Slides Per View

Multi-View

Auto Slides Per View

Auto-View

Centered Slides

Centered

Centered Auto Width

Centered

Multi-row 2D Grid

Grid

Vertical Swiper

Vertical

Auto Height Slides

AutoHeight

Slide #1 (Altura: 192px)

Slide #2 (Altura: 256px)

Slide #3 (Altura: 320px)

Slide #4 (Altura: 192px)

Slide #5 (Altura: 192px)

Dynamic Change Direction

Interactive

Lazy Load Images

Lazy

Mousewheel Control

Wheel

Keyboard Navigation

Keyboard

Infinite Loop Mode

Loop

Rewind Mode

Rewind

Free Mode Dragging

FreeMode

Pinch to Zoom

Zoom

Multi-layer Parallax

Parallax

Aurora Cosmos #1

Gradiente Dinámico Espacial

Transición con efecto Parallax multi-capa acelerado por GPU y estilizado en Tailwind CSS v4.

Ocean Wave #2

Olas Geométricas Cían

Transición con efecto Parallax multi-capa acelerado por GPU y estilizado en Tailwind CSS v4.

Sunset Peaks #3

Atardecer Cálido en Montañas

Transición con efecto Parallax multi-capa acelerado por GPU y estilizado en Tailwind CSS v4.

Emerald Forest #4

Naturaleza y Vegetación

Transición con efecto Parallax multi-capa acelerado por GPU y estilizado en Tailwind CSS v4.

CSS Scroll Snap Mode

CSS Mode

Grab Cursor Indicator

Cursor

Default Base Swiper

Default

Index Quick Example

Example

Custom Pagination Bullets

Custom

Dynamic Manipulation

API

Virtual Slides Engine

Virtual

Nested Carousel

Nested

Multiple Coordinated Swipers

Multi

Custom Navigation Plugin

Plugin

Custom Space Between

Spacing

Slides Per Group Skip

Group

Navigation Controls

Navigation

URL Hash Navigation

Hash

Browser History Support

History

RTL Right-to-Left Mode

RTL

Scroll Container

Scroll

Contenido Extenso Scrolleable

Este contenedor vertical permite scroll continuo con inercia y control por ratón/touchpad.

Construido 100% con clases nativas de Tailwind CSS v4.

Slideable Menu Drawer

Menu

Menú Lateral

Panel Deslizable

Navegación gestual suave tipo drawer.

Desliza →

Watch Slides Visibility

Visibility