SlideWire

Livewire-powered presentations

SlideWire

Create beautiful presentations powered by Livewire, with polished navigation, expressive motion, and a Blade-first workflow.

Explore the docs Open the showcase View on GitHub

Tip: click anywhere or press Space to continue.

Launch-ready workflow

Why to pick SlideWire

Blade-first decks

Build presentations in Laravel with slides, markdown, code, diagrams, and Tailwind layouts.

Livewire runtime

Keep state on the server while still getting polished controls, fragments, and reactive flows.

Themes, Google Fonts, image and video backgrounds, and motion primitives make it easy to turn a plain route into a launch-ready deck.

Why SlideWire

A presentation workflow that still feels like Laravel.

SlideWire keeps deck state on the server with Livewire, so you can build interactive presentations without leaving the Laravel toolset they already use every day.

Why teams adopt it

The deck ships with strong defaults, but stays composable

1

Full-page decks

Render polished presentations as real application routes.

2

Reactive runtime

Use Livewire-driven state while keeping the workflow straightforward.

3

Beautiful defaults

Themes, typography, and controls make decks feel launch-ready fast.

Navigation

Move through decks in two dimensions.

SlideWire supports keyboard, click, swipe, and hash-based navigation, plus vertical stacks for deeper drill-downs inside a single topic.

Horizontal

Overview to outcome

Left and right navigation lands on the top of each column.

Arrow keys Touch gestures Hash deep links

Top

Detail

Drill-down

Motion

Transitions and reveals stay focused on the story.

Fade, slide, zoom, fragments, auto-animate, and auto-slide let each deck control pacing without needing a separate front-end framework.

Transitions

Fade, slide, zoom

Keep deck-wide motion consistent, then override only when a slide needs emphasis.

Fragments

Progressive reveals

Fragments stage talking points.

Auto-animate connects matching elements.

Auto-slide works for demos and kiosk loops.

Workflow

Build decks with Blade, markdown, code, and diagrams.

Build decks in a single Blade file, mix in Tailwind composition, and reach for purpose-built SlideWire components when content needs code samples or visual structure.

<x-slidewire::deck theme="neon">
    <x-slidewire::slide>
        <x-slidewire::markdown>
## Blade-first workflow
        </x-slidewire::markdown>
    </x-slidewire::slide>
</x-slidewire::deck>

Markdown

Code blocks

Mermaid diagrams

Customization

Brand decks with fonts, backgrounds, and richer visuals out of the box.

SlideWire automatically loads configured Google Fonts and gives each deck room for gradients, overlays, theme-driven styling, and media-backed slides when you want extra visual storytelling.

Google Fonts

Inter + JetBrains Mono

Configured fonts are injected automatically, so display and code typography feel polished with zero extra wiring.

Visual depth

Media + overlays

Use image or video backgrounds when needed, then layer neon gradients and translucent panels on top.

Google Fonts Theme presets Highlight themes Image/Video backgrounds

Google Fonts config

<x-slidewire::deck theme="neon">
    <x-slidewire::slide>
        <h2>Styled with loaded fonts</h2>
    </x-slidewire::slide>
</x-slidewire::deck>

Media-ready slides

<x-slidewire::slide
    background-image="/img/hero.jpg"
    background-size="cover"
    background-position="center"
>
</x-slidewire::slide>

<x-slidewire::slide
    background-video="/video/demo.mp4"
    background-opacity="0.4"
>
</x-slidewire::slide>

Theme presets Highlight themes Image/Video backgrounds

AI ready

SlideWire ships with a Boost AI skill for beautiful deck creation.

AI agents can use the bundled SlideWire Boost skill to scaffold decks, choose the right components, structure horizontal and vertical flow, and refine visuals without guessing at package conventions.

Workflow aware

Steers agents toward `make:slidewire`, single-file decks, and route macro registration.

Component smart

Helps agents reach for slides, fragments, markdown, code, and diagrams at the right time.

Design guided

Encourages strong themes, deliberate motion, readable spacing, and presenter-friendly pacing.

Get started

Explore the package, then build your own deck.

Explore the docs Open the showcase Visit GitHub