ENCORE: Template | HorizonX

Design Systems

ENCORE

Design system for premium earbud and headphone launch pages: white editorial space, saturated performance films, blue purchase pills.

ENCORE, image 3
ENCORE, image 1
ENCORE, image 2
ENCORE, image 3
ENCORE, image 1
  • Instant access Included with every membership
  • Tokens & components HTML, CSS & design tokens
  • Commercial license With a membership, for client work

Overview

ENCORE is an industry design system for premium wireless earbud and headphone brands: launch films, product highlights, sound-feature chapters, spec cards, model comparisons, buy flows and keynote-style decks. It sets Wix Madefor Display headlines at weight 600 with tightening tracking and Wix Madefor Text body copy on long Stage White pages with Hush Gray cards, interrupted by full-bleed film panels where dancers and runners move through Amber Spot and Strobe Blue light and the earbud is the brightest point. Cue Blue fills only the purchase pills, Link Blue marks text links, a Night Set navy chapter carries the sound story, and translucent playback controls sit over the films. Surfaces stay near-shadowless with 20px media corners, 28px cards and pill controls. The imagery language has Space, Material and Object roles built around a fictional pebble earbud. Included: foundations (color, type, spacing, imagery, patterns), components (buttons & tags, cards & film panels, dialog, forms, navigation, feedback, table), theme sheet, Ovra Flow launch landing starter, 16:9 keynote deck, sample web photography in assets/imagery/, and README, AGENTS.md and CLAUDE.md guides.

Highlights

  • Premium earbud and headphone launch industry system
  • Stage White / Hush Gray / Backstage Ink + Cue Blue + Wix Madefor 600
  • White editorial pages interrupted by amber and electric-blue performance films
  • 20px media panels, 28px cards, pill controls, near-shadowless surfaces
  • Web imagery roles: Space · Material · Object (fictional pebble earbud)
  • Translucent playback controls, price capsule, finish selector, compare table and buy flow
  • Ovra Flow launch landing + 16:9 keynote deck

What's included

  • theme.json + styles.css tokens
  • Foundations docs (color, type, spacing, imagery, patterns)
  • Component specimens with states (HTML)
  • Ovra Flow launch landing + keynote deck
  • Sample web photography in assets/imagery/
  • README, AGENTS.md and CLAUDE.md guides
  • Commercial license with a membership

Frequently asked questions

  • A complete design system kit: foundations, tokens, HTML/CSS components and written guidelines, ready to adopt in your product.

  • It's included with a HorizonX membership. Download the kit and drop the tokens and components into your project.

  • Yes, with a HorizonX membership. Members get a commercial license: use and adapt these files in personal, client and commercial projects. If your plan ends, projects you already built keep their license, but the files can't be used to start new ones.