Perspective Book

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

Your complete platform for the Design.

Installation

pnpm dlx shadcn@latest add @spell/perspective-book

Usage

import { PerspectiveBook } from "@/components/perspective-book";

<PerspectiveBook>
  <div className="flex flex-col gap-4">
    <h1 className="font-semibold leading-5">
      Your complete platform for the Design.
    </h1>
    <BookOpen className="size-5" />
  </div>
</PerspectiveBook>

Examples

Textured

Open in

The Art of Doing Science and Engineering

Richard
W. Hamming

Props

Prop	Type	Default
`children`	`React.ReactNode`	-
`size`	`string`	`default`
`className`	`string`	-
`textured`	`boolean`	`false`