Fashion / Elegant

Aurel.

Explore Aurel, a fashion website hero with an interactive 3D wardrobe, garment colour choices and editable source files. An independent studio concept.

An independent studio concept.

01 / THE DESIGN BRIEF

A wardrobe worth exploring.

Five silhouettes, a quiet limestone gallery and garments you can turn and inspect. This visual brief describes the composition, materials and interactions behind Aurel.

Build a fullscreen interactive hero for Aurel, a fictional clothing label presenting five considered silhouettes in a sculptural wardrobe. Use warm ivory #f1e7db, limestone #cbc3b6, deep brown #2d1e10 and restrained bronze #936c3d. Pair Bodoni Moda roman and italic for editorial headings with Public Sans for navigation, product details and controls. Keep the atmosphere quiet, warmly lit and tactile. Place the Aurel wordmark at the upper left, collection links across the desktop header and a compact menu at the right. Centre the headline A study in silhouette. above a gallery of five arched limestone alcoves. Set silhouette in italic. Hang a tailored coat, ribbed knit, wide leg trousers, pleated skirt and slip dress in the bays. Add fine rules, a short collection note, numbered garment selectors and the primary action Explore the collection. Build convincing rounded garments with sleeves, collars, pockets, pleats, straps and wooden hangers. Give each fabric a distinct surface and retain soft warm lighting. Let the selected garment lift from its own bay into a larger inspection view beside the product information. Returning carries it back to the correct bay and blends into the collection artwork. Keep the scene fully lit throughout, without flashes or dimming. Next and previous pieces use short opposing exit and entry paths. In inspection, offer drag rotation, front and back views, closer tailoring and texture views, zoom and reset controls. Colour choices update the fabric. Sizes update the selected label and an illustrative measurement guide. Show product details and quiet save and bag feedback as demonstrations rather than a checkout. Use an understated menu with collection and editorial links. Below 600px show one centred bay, previous and next controls and a compact collection selector. Stack inspection details beneath the garment. Keep keyboard focus visible, support arrow keys and zoom keys, and provide still product views for reduced motion, data saving and unavailable graphics. Preserve a useful static collection without scripting.

AI results vary by tool and model. This prompt may not produce an exact match to the preview.

02 / MAKE IT YOURS

Make the collection your own.

Includes index.html, style.css, app.js, scene.js, garments.js, products.js and viewer-lighting.js; local images and product posters; bundled Three.js with its MIT notice; Bodoni Moda and Public Sans fonts with their licences; an editable content generator in tools/build.cjs; package configuration, README.md, CREDITS.txt and USAGE.txt. Product prices, sizes and bag feedback are illustrative. No checkout or inventory service is included.

Downloads are free. Your Google account lets you download designs; browsing and copying prompts do not require an account.

Continue with Google, then return here to choose your download.

Personal and client use

You may use and modify this design for personal websites and commercial client websites. You may not resell, sublicense or redistribute the template, its source files or a collection containing it. Keep the included font licence notices. The design is supplied as a starting point without warranty.

Aurel is an independent studio concept, not a client commission. Bundled font and Three.js notices apply. See CREDITS.txt for artwork provenance and demo limitations.

Explore hero designs