Spelte

Command Palette
Search for a command to run...

Perspective Book

A 3D book component with hover animation and customizable appearance.

Your complete platform for the Design.

Installation

pnpm dlx shadcn-svelte@latest add https://spelte.dev/r/perspective-book.json

Usage

<script>
  import PerspectiveBook from '$registry/spelte/perspective-book.svelte';
</script>
 
<PerspectiveBook>
  <div class="flex flex-col gap-4">
    <h1 class="font-semibold leading-5">Your complete platform for Design.</h1>
  </div>
</PerspectiveBook>

Examples

Textured

<PerspectiveBook class="bg-amber-500" textured>
  <span>Book Title</span>
</PerspectiveBook>

Props

| Prop | Type | Default | Description | |------|------|---------|-------------| | size | "sm" | "default" | "lg" | "default" | Size of the book | | textured | boolean | false | Adds a realistic texture overlay | | class | string | — | CSS classes for styling the cover (use bg-* for color) |