{
 "slug": "outre",
 "name": "OUTRE",
 "title": "Free fashion brand website template",
 "description": "Free HTML fashion brand website template for clothing labels with a seasonal edit and a few stores. AGENTS.md for Claude Code, or no code with 8B.",
 "kind": "One-page website for a fashion label or clothing brand that sells a seasonal collection and runs a few stores",
 "summary": "A one-page site for an outerwear label: a giant two-line title with a portrait panel, the brand statement, four collection looks with prices, a category index with a photo preview, a customer quote, new arrivals, five season colours, the studio story, a street photo notebook, a FAQ, three stores with a contact form and a newsletter. White and ink with red, yellow, blue, pink and pale blue.",
 "fits": [
  "fashion label, clothing brand or outerwear maker",
  "boutique or concept store with a seasonal edit and a few shops",
  "accessories, footwear or sportswear brand",
  "any product brand with a collection, a lookbook and store locations"
 ],
 "categories": [
  "Shop"
 ],
 "tags": [
  "fashion brand",
  "clothing label",
  "outerwear",
  "boutique",
  "lookbook",
  "seasonal collection",
  "editorial",
  "colour blocking",
  "store locator",
  "newsletter",
  "gsap",
  "scrolltrigger",
  "splittext",
  "lenis",
  "single-file"
 ],
 "language": "en",
 "size_kb": 86,
 "photos": 21,
 "fonts": [
  "Host Grotesk",
  "Schibsted Grotesk"
 ],
 "libraries": [
  "https://cdn.jsdelivr.net/npm/gsap@3.13.0/dist/gsap.min.js",
  "https://cdn.jsdelivr.net/npm/gsap@3.13.0/dist/ScrollTrigger.min.js",
  "https://cdn.jsdelivr.net/npm/gsap@3.13.0/dist/SplitText.min.js",
  "https://cdn.jsdelivr.net/npm/lenis@1.3.27/dist/lenis.min.js"
 ],
 "browsers": "Chrome and Edge 111+, Safari 16.2+, Firefox 113+ (it uses color-mix(), container query units, cascade layers, small/dynamic viewport units).",
 "sections": [
  {
   "key": "navigation",
   "id": "nav",
   "heading": "",
   "about": "fixed bar: logo mark and wordmark, three links, search, bag with a counter and a menu button; full-screen sheet with four links; hides on scroll down"
  },
  {
   "key": "opening",
   "id": "opening",
   "heading": "Fearless Layers",
   "about": "two screens: a giant two-line title with a portrait panel and corner captions, then a brand statement over a brand row and two stacked photo cards"
  },
  {
   "key": "collections",
   "id": "collections",
   "heading": "Four looks built from one season of colour, made to swap, stack and wear every single day.",
   "about": "a statement and four looks with name, price and Add to bag, dealt from a pile behind a giant word"
  },
  {
   "key": "index",
   "id": "index",
   "heading": "",
   "about": "a category list of four rows with a tilted photo preview that follows the active row"
  },
  {
   "key": "voice",
   "id": "voice",
   "heading": "",
   "about": "a customer quote beside a photo and a rotating burst"
  },
  {
   "key": "arrivals",
   "id": "arrivals",
   "heading": "Just landed",
   "about": "a wide cobalt photo with a giant title and a shop arrow, with a short offer line below"
  },
  {
   "key": "palette",
   "id": "palette",
   "heading": "The season in five colours",
   "about": "five full-width colour bands that stack like layers, each naming a colour, a garment type and what it is used for"
  },
  {
   "key": "studio",
   "id": "studio",
   "heading": "One cutting room in Antwerp, where surplus rolls become panels and panels become coats.",
   "about": "a photo of the cutting room beside a statement and three facts on hairlines"
  },
  {
   "key": "notebook",
   "id": "notebook",
   "heading": "Street Notebook",
   "about": "a heading and six street photos that float up from different depths around it"
  },
  {
   "key": "faq",
   "id": "faq",
   "heading": "Before you order",
   "about": "five questions as native details beside a heading and a contact link"
  },
  {
   "key": "contact",
   "id": "contact",
   "heading": "Come and try a stack on, or write to the cutting room",
   "about": "three store cards (Antwerp, Lisbon, Seoul) and a message form"
  },
  {
   "key": "footer",
   "id": "footer",
   "heading": "First look at every drop",
   "about": "newsletter sign-up, three link columns, a hairline, a large wordmark, copyright with the Design: 8B credit"
  }
 ],
 "placeholders": [
  "og-image",
  "favicon",
  "phone",
  "form",
  "email",
  "social"
 ],
 "lighthouse": null,
 "license": {
  "code": "MIT",
  "photos": "Unsplash License",
  "fonts": "SIL Open Font License 1.1"
 },
 "get": {
  "degit": "npx degit 8bsite/fashion-brand-website-template my-site",
  "curl": [
   "curl -LO https://raw.githubusercontent.com/8bsite/fashion-brand-website-template/main/index.html",
   "curl -LO https://raw.githubusercontent.com/8bsite/fashion-brand-website-template/main/AGENTS.md",
   "curl -LO https://raw.githubusercontent.com/8bsite/fashion-brand-website-template/main/LICENSE",
   "curl -LO https://raw.githubusercontent.com/8bsite/fashion-brand-website-template/main/CREDITS.md"
  ],
  "agent_prompt": "Read AGENTS.md, then edit index.html. Make this the site for <my label: name, city, season, products with prices and fabrics, sizing, delivery and returns terms, store addresses and hours, social profiles>. Replace first the label name, the four looks and prices, the colour descriptions, the stores and the FAQ. Update every --len to the new word's character count and edit outline copies with the visible ones. Keep the section ids and the classes AGENTS.md lists. Ask me for missing facts and never invent prices, policies, reviews, addresses or contacts."
 },
 "links": {
  "page": "https://8b.com/templates/outre/",
  "md": "https://8b.com/templates/outre.md",
  "json": "https://8b.com/templates/outre.json",
  "demo": "https://8b.com/templates/outre/demo.html",
  "ghDemo": "https://8bsite.github.io/fashion-brand-website-template/",
  "repo": "https://github.com/8bsite/fashion-brand-website-template",
  "zip": "https://8b.com/templates/outre/fashion-brand-website-template.zip",
  "use": "https://github.com/new?template_name=fashion-brand-website-template&template_owner=8bsite",
  "agents": "https://github.com/8bsite/fashion-brand-website-template/blob/main/AGENTS.md",
  "credits": "https://github.com/8bsite/fashion-brand-website-template/blob/main/CREDITS.md",
  "raw": {
   "index": "https://raw.githubusercontent.com/8bsite/fashion-brand-website-template/main/index.html",
   "agents": "https://raw.githubusercontent.com/8bsite/fashion-brand-website-template/main/AGENTS.md",
   "license": "https://raw.githubusercontent.com/8bsite/fashion-brand-website-template/main/LICENSE",
   "credits": "https://raw.githubusercontent.com/8bsite/fashion-brand-website-template/main/CREDITS.md"
  },
  "preview": "https://8b.com/templates/outre/desktop.webp",
  "phone": "https://8b.com/templates/outre/phone.webp",
  "clip": "https://8b.com/templates/outre/scroll.mp4",
  "og": "https://8b.com/templates/outre/og.jpg",
  "design_md": "https://8b.com/templates/outre/DESIGN.md"
 },
 "github": {
  "repo": "8bsite/fashion-brand-website-template",
  "template_repository": true,
  "topics": [
   "html-template",
   "landing-page",
   "website-template",
   "website-templates",
   "fashion-website",
   "clothing-brand",
   "outerwear",
   "ecommerce-landing-page",
   "lookbook",
   "html5",
   "agents-md",
   "gsap",
   "scrolltrigger",
   "scroll-animation",
   "lenis",
   "single-file",
   "cursor-ai",
   "static-site",
   "mit-license",
   "vibe-coding"
  ]
 },
 "made_by": {
  "name": "8B",
  "url": "https://8b.com/"
 }
}