- Scroll animation
- 3D scenes
What makes it special
- Video hero
- Scroll animation
- 3D scenes
- Interactive audio
- Carousel
- FAQ
- Demo form
What's included
- Prompt to recreate and customize the design with AI.
- Site code and files: images, fonts and licences.
- Interactive demo and instructions.
- Use on your own sites and final client projects.
Demo sections and screens (13)
- Loading screen with real percentage
- Full-screen cinematic video hero
- Two-column label introduction
- 3D collection of artists, songs and vinyl
- Newsletter as a poster with a ticket (demo mode)
- 3D ring of thumbnails
- Back-cover-style footer
- Artist directory
- Artist profile
- About the label, with FAQ
- Video piece
- Tour concept with 3D intro
- Privacy and 404
What you can customize
- Name, tagline and SVG wordmark
- Colors (hex tokens)
- Seven typographic roles
- Artists, songs and cover art
- Hero clip and poster
- 3D figure (your own GLB)
- Newsletter and label copy
How to start
- Copy the prompt and download the files.
- Take them to your AI tool and ask for the changes: brand, copy and images.
- Review the result and publish it on your domain.
Download the package and copy the prompt: your AI tool works on the Next.js project in the package (README with installation and where to customize). Change the name, artists, songs, logo, video and colors. Music is not included; the newsletter is in demo mode.
The result depends on your AI tool and the changes you make. The demo shows the visual direction.
Technical details & requirements
Requirements
- Node.js 20.9 or later to run the project (Next.js).
- A browser with WebGL 2 for the liquid metal and 3D (there is a non-WebGL fallback).
- Bring your brand and copy and, if you want them, photos, cover art and music you have the rights to.
- The design’s typefaces (nocturne-serif, mandrel, herencia, emily-austin): your own Adobe Fonts kit (Creative Cloud) with your domain authorized; the kit ID is set in NEXT_PUBLIC_ADOBE_FONTS_KIT.
- Not included: AI tool (and its credits), domain and hosting.
Technologies
- React
- Next.js
- TypeScript
- Three.js
- React Three Fiber
- drei
- Paper Shaders
- WebGL
- Web Audio
- 3D
Implemented in the package you download.
Next.js 15 (App Router) · React 19 · TypeScript · three.js · React Three Fiber · drei · Paper Shaders (LiquidMetal) · CSS Modules
Suggested AI tools
ClaudeCodexv0
Compatible with the design instructions; not a recorded test.
Tested compatibility: No recorded test yet.
Palette and typography
- títulos: Cormorant Garamond / Playfair Display
- titulares ligeros: Cormorant Garamond Light
- lectura: Inter
- botones: Archivo Expanded
- navegación: Barlow Condensed
- firma: Pinyon Script
- manuscrita: Allura
Licence & versions
Use it on your own sites and in final client projects, including commercial use. Do not resell or redistribute the prompt, the files or the site as a template. Read the licence
Provenance: Package v1.2.0: code and assets from the approved original site (sello-angel-pilot.vercel.app): a Next.js project with its video, posters and cover art, GLB 3D models and the Adobe Fonts kit typefaces (configurable). Notices in LICENCIAS-Y-AVISOS.md.
- Version
- v1.2.0 · Published Oct 29, 2026
- Versions
- v1.2.0 · 2026-11-03 — Approved original version (the one on Vercel and in the listing’s video): code, video, posters, GLB and fonts from the published site (286/286 files identical to the deployment).
- v1.1.1 · 2026-11-03 — README corrected (instructions and package root); code, assets and prompt same as 1.1.0.
- v1.1.0 · 2026-10-30 — Code and assets package: runnable project, images, typefaces and licenses (250 files). Prompt aligned with the package.
- v1.0.0 · 2026-10-30 — Release: video preview, short prompt and downloadable package.