Maison Vell

44:I[660678,["/_next/static/chunks/24kk6esyebw07.js","/_next/static/chunks/03_awmr5smk-z.js","/_next/static/chunks/1r3u-7sm5uwg3.js","/_next/static/chunks/2e_ylfdi0w0oj.js","/_next/static/chunks/2c4sp5a_o4cah.js","/_next/static/chunks/3x7zul2v99gd0.js","/_next/static/chunks/08igtfm2uceb6.js","/_next/static/chunks/1fb6a9ist7m0e.js","/_next/static/chunks/3an1652333x2o.js","/_next/static/chunks/21cd59kybaxc_.js","/_next/static/chunks/13o79cwftz4qv.js","/_next/static/chunks/0g7z5fjyx8tks.js","/_next/static/chunks/3_tgw75qxwbed.js","/_next/static/chunks/2mu2xdha71gdz.js","/_next/static/chunks/2jxufef9b8omu.js","/_next/static/chunks/3p4ubm828a7_b.js","/_next/static/chunks/2z6eq5sq15b68.js","/_next/static/chunks/2pxnuzg5p-xef.js","/_next/static/chunks/2cyrg3st31vqp.js","/_next/static/chunks/0zmlqr1w9m2bi.js","/_next/static/chunks/2qv3xovtmw662.js","/_next/static/chunks/0q0hvy6252me0.js","/_next/static/chunks/36-0kygq3w4ek.js","/_next/static/chunks/0s_9ctgqfj5xz.js","/_next/static/chunks/0b3ymqq70keww.js","/_next/static/chunks/31b10kx0iczkf.js","/_next/static/chunks/01qmyfuvh9fwa.js","/_next/static/chunks/1m__ci5g6og45.js","/_next/static/chunks/26zz3qqypndkz.js","/_next/static/chunks/227jpadmfdzy_.js","/_next/static/chunks/3-8lw9_k_cgg-.js","/_next/static/chunks/1mxf-cu8bu_z7.js","/_next/static/chunks/2tu24uvqapqrd.js","/_next/static/chunks/00hd6f1tbyqmd.js","/_next/static/chunks/2138j8d_jg_ya.js","/_next/static/chunks/18d3743hj6f0e.js","/_next/static/chunks/0t9o5utvse2_d.js","/_next/static/chunks/0hiqoi89lnw_c.js","/_next/static/chunks/27nadn2r5h6y9.js","/_next/static/chunks/298ac6x5i09zp.js","/_next/static/chunks/0fgc5yw14g1-f.js","/_next/static/chunks/2gojbuaovj01h.js","/_next/static/chunks/256kb7a1ddc5g.js","/_next/static/chunks/3l6bwn061vy22.js","/_next/static/chunks/08wshkz-r0cpz.js","/_next/static/chunks/3h8au5d272gpy.js","/_next/static/chunks/2rjoocbkybey6.js","/_next/static/chunks/0oex1drdsu_61.js","/_next/static/chunks/1hng8s32ricnx.js","/_next/static/chunks/23ebvmypm8qpn.js","/_next/static/chunks/31nllbh70u74d.js","/_next/static/chunks/1u7fprw6mnsf5.js","/_next/static/chunks/1-gbm0tcsnk1h.js","/_next/static/chunks/2sxke47ls2oor.js","/_next/static/chunks/0ux6v5s4-3rc7.js","/_next/static/chunks/0l_rnv-u7tos0.js","/_next/static/chunks/2nom5c3fzbb7c.js","/_next/static/chunks/2m90qfmh5ks_x.js","/_next/static/chunks/15i92d_7uxq-a.js","/_next/static/chunks/1aplz2xrpn8qc.js","/_next/static/chunks/07at-6mobqok3.js","/_next/static/chunks/2grgtszwmx1_m.js","/_next/static/chunks/0tvei3zc78nsi.js","/_next/static/chunks/2hxf_ep1x9flp.js","/_next/static/chunks/0hmhofktb_poj.js","/_next/static/chunks/2uslvkf5xmzk0.js","/_next/static/chunks/3jzjwe-lzyytm.js","/_next/static/chunks/1brgtil20zs_u.js","/_next/static/chunks/16c7i_6xdswzi.js","/_next/static/chunks/146r-k671wus-.js","/_next/static/chunks/1_nijgem_ezvx.js","/_next/static/chunks/2igzn82ezosbt.js"],"HydrationBoundary"] 45:T5f00,# Maison Vell — Runway Depth Lookbook (exact recreation prompt) Give me a single-file, full-viewport fashion page called **Maison Vell**. Six models stand in one line that recedes from the right of the screen into a blurred distance on the left. Dragging, scrolling or pressing the arrow keys walks the whole line forward: the front model grows and slides out behind the product column, everyone else takes the next place, and a new model arrives out of the haze at the back. The product column on the right scrolls in sync, and a big look number rolls over at bottom left. It loops forever. Plain HTML, CSS and one vanilla script in one file, with no libraries. The only external resources are the Google Fonts and the two image sheets below. Reproduce every value, string and timing exactly, and use the complete code at the end as the source of truth. Six rules define it: 1. **One number drives everything.** `p` is the current look position as a float. Each model's depth is `d = wrap(i - p, 6)`, moved into the range -1 to 5. Model, product column and look number are all computed from `p` alone. 2. **Depth is a table, not a formula.** Each model's position, size, blur and opacity are read from seven stops, one per depth from -1 to 5, and interpolated linearly. 3. **Two sprite sheets, cropped with SVG.** All six models come from one transparent image and all twelve products from another. Each is shown through an inline ` Maison Vell

Maison Vell

Spring Summer 2027

A study in softness and strength. The new season collection from Maison Vell blends delicate textures and modern silhouettes, crafted for a more beautiful tomorrow.

Look

Shop the look

```3c:["$","$L44",null,{"state":{"mutations":[],"queries":[{"dehydratedAt":1793717586554,"state":{"data":{"pages":[{"results":[{"estimatedCredit":39,"id":"6ae8f505-fcfe-416b-bc89-783f3c9fd63e","publicId":"xus5pkzrt7al","title":"Runway Depth Lookbook","canonicalSlug":"runway-depth-lookbook","metaTitle":"Runway Depth Lookbook — Interactive Fashion Showcase Template","contentType":"landing_page","description":"A luxury fashion lookbook featuring a 3D runway depth experience. Seamless drag-to-scroll navigation brings models forward from the haze while syncing with an infinite looping product rail.","creator":{"username":"diaflowteam","displayName":"Diaflow Team","avatarUrl":"public/production/workspace_37/users/diaflow-logo.jpg","isVerifyProfile":false},"status":"publish","categories":[{"id":71,"name":"Featured","parentId":null},{"id":189,"name":"E-commerce","parentId":null}],"likeCount":3401,"downloadCount":693,"commentCount":0,"shareCount":583,"viewCount":12617,"cloneCount":0,"isLikedByMe":false,"isPinned":false,"teammate":null,"componentsInUse":[],"createdAt":"2026-11-03T09:49:00.631911Z","updatedAt":"2026-11-03T14:17:59.716285Z","data":null,"resultConfiguration":{"downloadFiles":[],"preview":null,"suggestedThumbnails":[{"url":null,"key":"public/production/admin/marketplace-templates/landing_pages/thumbnails/1793699336793-3c1e8bc2-9721-4995-83aa-ae3c697afe9d-preview.webp","name":"3c1e8bc2-9721-4995-83aa-ae3c697afe9d-preview.webp","type":"image/webp","size":152740}],"prompt":"$45","model":"saigon","modelName":"Saigon 1.1","thumbnail":{"url":null,"key":"public/production/admin/marketplace-templates/landing_pages/thumbnails/1793699470821-3c1e8bc2-9721-4995-83aa-ae3c697afe9d-preview-thumbnail.webp","name":"3c1e8bc2-9721-4995-83aa-ae3c697afe9d-preview-thumbnail.webp","type":"image/webp","size":138732},"attachments":[],"previewFile":{"url":null,"key":"public/production/admin/marketplace-templates/landing_pages/previews/1793699339445-maison-vell.html","name":"maison-vell.html","type":"text/html","size":15387}}}],"total":1}],"pageParams":[1]},"dataUpdateCount":1,"dataUpdatedAt":1793717586523,"error":null,"errorUpdateCount":0,"errorUpdatedAt":0,"fetchFailureCount":0,"fetchFailureReason":null,"fetchMeta":null,"isInvalidated":false,"status":"success","fetchStatus":"idle"},"queryKey":["community","marketplaceTemplates","list","landing_page","{\"categoryId\":189,\"orderBy\":\"priority\",\"pageSize\":24,\"search\":\"\",\"status\":\"publish\"}"],"queryHash":"[\"community\",\"marketplaceTemplates\",\"list\",\"landing_page\",\"{\\\"categoryId\\\":189,\\\"orderBy\\\":\\\"priority\\\",\\\"pageSize\\\":24,\\\"search\\\":\\\"\\\",\\\"status\\\":\\\"publish\\\"}\"]"},{"dehydratedAt":1793717586554,"state":{"data":[{"id":71,"name":"Featured","icon":null,"description":"Build high-converting landing pages faster with ready-made templates for campaigns, products, launches, and branded web experiences.","background":null,"image":"public/production/admin/marketplace-og/categories/type-landingpage-1789717414309.jpg","isActive":true,"slug":"featured","priority":0,"templateType":"landing_page","parentId":null,"isFeatured":true,"metaTitle":null,"templateCount":24,"hasChildren":false,"createdAt":"2026-08-24T11:03:11.467768Z","updatedAt":"2026-09-18T07:43:37.650978Z","children":[],"coverTemplate":null},{"id":189,"name":"E-commerce","icon":null,"description":null,"background":null,"image":null,"isActive":true,"slug":"e-commerce","priority":1,"templateType":"landing_page","parentId":null,"isFeatured":false,"metaTitle":null,"templateCount":1,"hasChildren":false,"createdAt":"2026-11-03T09:49:21.052900Z","updatedAt":"2026-11-03T09:49:21.052905Z","children":[],"coverTemplate":null},{"id":190,"name":"Portfolio","icon":null,"description":null,"background":null,"image":null,"isActive":true,"slug":"portfolio-personal","priority":2,"templateType":"landing_page","parentId":null,"isFeatured":false,"metaTitle":null,"templateCount":1,"hasChildren":false,"createdAt":"2026-11-03T10:33:03.119456Z","updatedAt":"2026-11-03T10:54:41.208176Z","children":[],"coverTemplate":null}],"dataUpdateCount":1,"dataUpdatedAt":1793717586554,"error":null,"errorUpdateCount":0,"errorUpdatedAt":0,"fetchFailureCount":0,"fetchFailureReason":null,"fetchMeta":null,"isInvalidated":false,"status":"success","fetchStatus":"idle"},"queryKey":["community","templates","visibleCategories","landing_page"],"queryHash":"[\"community\",\"templates\",\"visibleCategories\",\"landing_page\"]"}]},"children":["$L46","$L47"]}]

Landing Pages

Landing Pages