{
 "slug": "hushkey",
 "name": "Hushkey",
 "title": "Hushkey, a free product landing page template",
 "kind": "Product launch and pre-order page for a physical device",
 "summary": "A one-page launch site for a palm-sized smart-home remote with eleven soft keys. Grey, tactile, monochrome; the keys are drawn in HTML and CSS and press, swell and melt into each other as you scroll.",
 "fits": [
  "hardware or gadget launch",
  "pre-order or waitlist page",
  "smart-home or IoT product",
  "any product with a handful of features shown one per section"
 ],
 "categories": [
  "Product and app"
 ],
 "tags": [
  "product",
  "launch",
  "pre-order",
  "hardware",
  "smart home",
  "monochrome",
  "neumorphism",
  "gsap",
  "scrolltrigger",
  "lenis",
  "single-file"
 ],
 "language": "en",
 "size_kb": 115,
 "photos": 8,
 "fonts": [
  "Mozilla Headline",
  "Mozilla Text"
 ],
 "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": "top bar: wordmark, section links, Pre-order button; phone menu overlay"
  },
  {
   "key": "hero",
   "id": "hero",
   "heading": "Eleven keys for the whole house.",
   "about": "first screen: headline, two buttons, the eleven-key product panel drawn in HTML/CSS"
  },
  {
   "key": "states",
   "id": "states",
   "heading": "Up is ready. Down is on.",
   "about": "keyboard of eight toggle keys (Up is ready / Down is on)"
  },
  {
   "key": "modes",
   "id": "modes",
   "heading": "One pad. Four moods of the house.",
   "about": "sticky stage: D-pad drives four room photos (Morning, Desk, Evening, Away)"
  },
  {
   "key": "dimmer",
   "id": "dimmer",
   "heading": "Hold plus. The light arrives slowly.",
   "about": "fader + plus key over one room photo (grey to colour on scroll)"
  },
  {
   "key": "quiet",
   "id": "quiet",
   "heading": "No screen to wake.",
   "about": "short statement: no screen, no app"
  },
  {
   "key": "chords",
   "id": "chords",
   "heading": "Press two at once. Get a third.",
   "about": "two keys meet and their outlines melt into one (chords)"
  },
  {
   "key": "material",
   "id": "material",
   "heading": "Made to be found in the dark.",
   "about": "three material cards with texture photos"
  },
  {
   "key": "editions",
   "id": "editions",
   "heading": "Two finishes. The same eleven keys.",
   "about": "two finishes (Chalk, Graphite) with pre-order buttons and a switch"
  },
  {
   "key": "faq",
   "id": "faq",
   "heading": "Before you press order.",
   "about": "questions and answers (native <details>)"
  },
  {
   "key": "contact",
   "id": "contact",
   "heading": "Ask someone who has pressed every key.",
   "about": "email, phone and a contact form (placeholders)"
  },
  {
   "key": "footer",
   "id": "footer",
   "heading": "",
   "about": "width-filling HUSHKEY wordmark, links, copyright and the Design: 8B credit"
  }
 ],
 "placeholders": [
  "og-image",
  "favicon",
  "email",
  "phone",
  "form"
 ],
 "lighthouse": {
  "score": 93,
  "lcp": "2.7 s",
  "cls": 0,
  "note": "mobile, measured by 8B before release"
 },
 "license": {
  "code": "MIT",
  "photos": "Unsplash License",
  "fonts": "SIL Open Font License 1.1"
 },
 "get": {
  "degit": "npx degit 8bsite/product-landing-page-template my-site",
  "curl": [
   "curl -LO https://raw.githubusercontent.com/8bsite/product-landing-page-template/main/index.html",
   "curl -LO https://raw.githubusercontent.com/8bsite/product-landing-page-template/main/AGENTS.md",
   "curl -LO https://raw.githubusercontent.com/8bsite/product-landing-page-template/main/LICENSE",
   "curl -LO https://raw.githubusercontent.com/8bsite/product-landing-page-template/main/CREDITS.md"
  ],
  "agent_prompt": "Read AGENTS.md, then edit index.html. Use this template as the base for a launch page for <your product: what it is, who it is for, price, how to buy>. Keep the layout, the motion and the single-file format; replace the brand name, copy, photos, prices, links and contacts, and recolour it through the CSS variables if needed."
 },
 "links": {
  "page": "https://8b.com/templates/hushkey/",
  "md": "https://8b.com/templates/hushkey.md",
  "json": "https://8b.com/templates/hushkey.json",
  "demo": "https://8bsite.github.io/product-landing-page-template/",
  "repo": "https://github.com/8bsite/product-landing-page-template",
  "zip": "https://github.com/8bsite/product-landing-page-template/archive/refs/heads/main.zip",
  "use": "https://github.com/new?template_name=product-landing-page-template&template_owner=8bsite",
  "agents": "https://github.com/8bsite/product-landing-page-template/blob/main/AGENTS.md",
  "credits": "https://github.com/8bsite/product-landing-page-template/blob/main/CREDITS.md",
  "raw": {
   "index": "https://raw.githubusercontent.com/8bsite/product-landing-page-template/main/index.html",
   "agents": "https://raw.githubusercontent.com/8bsite/product-landing-page-template/main/AGENTS.md",
   "license": "https://raw.githubusercontent.com/8bsite/product-landing-page-template/main/LICENSE",
   "credits": "https://raw.githubusercontent.com/8bsite/product-landing-page-template/main/CREDITS.md"
  },
  "preview": "https://8b.com/templates/hushkey/desktop.webp",
  "phone": "https://8b.com/templates/hushkey/phone.webp",
  "clip": "https://8b.com/templates/hushkey/scroll.mp4",
  "og": "https://8b.com/templates/hushkey/og.jpg",
  "prompt": "https://8b.com/templates/hushkey/prompt.md"
 },
 "github": {
  "repo": "8bsite/product-landing-page-template",
  "template_repository": true,
  "topics": [
   "html-template",
   "landing-page",
   "landing-page-template",
   "website-template",
   "free-template",
   "product-launch",
   "product-landing-page",
   "html5",
   "css",
   "gsap",
   "scrolltrigger",
   "scroll-animation",
   "lenis",
   "single-file",
   "no-build",
   "static-site",
   "mit-license",
   "vibe-coding",
   "claude-code",
   "ai-agents"
  ]
 },
 "made_by": {
  "name": "8B",
  "url": "https://8b.com/"
 }
}