back to lab

Subtle 3D Carousel

June 2024

A draggable carousel with a rotation effect for navigating between slides. It's made with framer-motion and tailwind css. I was inspired by @nitishkmrk on X.

UI Design

Design intuitive user interfaces and experiences.

Frontend Development

Build interactive, visually compelling web pages.

Motion Design

Create engaging animations and transitions.

Design Engineer

Focusing on details, design systems, and code.

Product Management

Manage product lifecycle, from conception to launch.

Unlock code snippet

Enter your email to access all code snippets and subscribe to my newsletter for updates.

import { useState } from "react";
import Button from "./ui/Button";


// Nice try lol, I promise I will not send you a tons of spam emails
// I just want to build a newsletter list to share my latest content with you 🥹


const INIT = "INIT";
const SUBMITTING = "SUBMITTING";
const ERROR = "ERROR";
const SUCCESS = "SUCCESS";


const formStates = [INIT, SUBMITTING, ERROR, SUCCESS] as const;




function NewsletterForm() {
  return (
    <form>
      <input type="email" placeholder="
        Enter your email" />
        <Button type="submit">Subscribe</Button>
        </form>
        );
    }
}

References:

Swipeable Stack Cards
Gooey Menu