back to lab

3D Photo Carousel

May 2024

A 3D cylindrical photo carousel component that rotates on the Y-axis. The photos are from Unsplash. This component is inspired by a prototype created and shared by @jmtrivedi on X.

img
img
img
img
img
img
img
img
img
img
img
img
img
img

Unlock code snippet

Enter your email to get instant access to all code snippets and stay updated with my latest content!

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:

3D Photo Carousel n°2
Web Exploding Menu