electrik / slate-illustrations

0.1.0 2026-10-22 07:26 UTC

Requires

• php: ^8.3
• electrik/slate: ^3.0
• illuminate/support: ^12.0|^13.0

MIT

• neerajsohal

• ui
• laravel
• blade
• slate
• tailwind
• Electrik
• illustrations

Published on Packagist.org on 2026-10-22 07:39 UTC

README

A collection of animated UI scenes for Electrik Slate landing pages. Drop them into heroes and feature grids. Looks like the product. Not a live screen.

Need a real login, settings, or pricing page? That’s electrik/slate-blocks.

Six scenes: deploy, billing, invites, kanban, activity, chat.

Requirements

• PHP 8.3+
• Laravel 12+
• electrik/slate ^3.0

Install

composer require electrik/slate-illustrations

Path-link (monorepo / local):

{
  "repositories": [
    { "type": "path", "url": "../slate-illustrations", "options": { "symlink": true } }
  ],
  "require": {
    "electrik/slate-illustrations": "@dev"
  }
}

Tailwind

Scan the views so classes are generated:

@source '../../vendor/electrik/slate-illustrations/resources/views/**/*.blade.php';
@import '../../vendor/electrik/slate-illustrations/resources/css/illustrations.css';

The @import is only required for the activity marquee and billing sparkline. The others still animate without it.

Usage

<x-slate-illustration::deploy
    headline="main · ship-42"
    :jobs="[
        ['title' => 'Install dependencies', 'hint' => 'composer + npm'],
        ['title' => 'Deploy to production', 'hint' => 'Forge · acme.com'],
    ]"
/>

Empty tags keep the sample copy. Pass your own to make the scene about your product. Clicks are off. prefers-reduced-motion freezes the last frame.

Docs: slate.electrik.dev/docs/illustrations. Gallery: slate.electrik.dev/illustrations.

use Electrik\SlateIllustrations\Illustrations;

Illustrations::all();
Illustrations::find('deploy');

License

MIT