aadilghani1

Parcel Locker

Component

About

An interactive isometric illustration of a bank of parcel lockers where pressing a code key opens one locker's door on its lit parcel while the previous one swings shut and latches.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Parcel Locker to your project and fits it to your theme.

Code

How Parcel Locker is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

"use client";

import ParcelLocker from "@/components/ui/parcel-locker";
import "react-isokit/styles.css";

export default function ParcelLockerDemo() {
  return (
    <div className="w-full h-screen flex items-center justify-center p-8 bg-background">
      <div className="w-full max-w-xl">
        <ParcelLocker />
      </div>
    </div>
  );
}

Dependencies

More by aadilghani1

View all
  • Deploy Pipeline

    Deploy Pipeline

    81
  • Security Key

    Security Key

    80
  • Webhook Relay

    Webhook Relay

    44
  • Checkout Till

    Checkout Till

    43
  • Usage Meter

    Usage Meter

    39
  • Vault Door

    Vault Door

    26
  • Desk Globe

    Desk Globe

    26
  • Firewall Rack

    Firewall Rack

    22