3D event badge

Docs

3D event badge

Displays a beautiful 3D event badge with React Three Fiber.

Inspired by Vercel React Three Fiber, this 3D Badge component leverages the power of React Three Fiber to create an interactive and visually stunning badge. Perfect for events, profiles, or any application that can benefit from a unique 3D element.

Installation

Install the following dependencies:

npm install three meshline @react-three/rapier @react-three/drei @react-three/fiber

Copy and paste the Event Calendar code into your project.

Download 3D Card model.

Click here to download the 3D Card model

API Reference

Props

Prop	Type	Description
`maxSpeed`	`number`	`50`
`minSpeed`	`number`	`10`
`className`	`string`	`""`
`width`	`string	number`
`height`	`string	number`

Usage

export default function Demo() {
  return (
    <LanyardCard
      className="rounded-lg shadow-xl"
      height="80vh"
      backgroundColor="bg-gray-900"
    />
  )
}