Skip to content

Repository files navigation

Halcyon

Reference-grade headphones, obsessively made. A design-forward, multi-page luxury product site, warm, quiet, and editorial, statically rendered with Astro.

ci License: MIT Astro Tailwind

Live demo → halcyon.signalizeai.org

Halcyon home

About

A concept site for a fictional luxury headphone. Pages: home, product, technology, craft, buy (with finishes), and a 404. The signature interaction is a sticky-scroll product story, a pinned product visual while the feature copy scrolls alongside, in pure CSS.

Craft

  • Warm-luxury identity — ivory ground, espresso ink, a single copper accent, refined Fraunces serif display paired with Manrope (both self-hosted)
  • A CSS-crafted product — the headphone ear-cup is built from gradients and rings, no image
  • Static-first — every page ships real HTML; only the nav hydrates. All content is visible without JavaScript (reveals are progressive enhancement)
  • Responsive, accessible, SEO meta + social preview

Tech

Astro 7 · React 19 (island) · TypeScript · Tailwind CSS v4 · Lenis · Vitest · Cloudflare Pages.

Run it

npm install
npm run dev
npm run test
npm run build

License

MIT © Royal Simpson Pinto · A concept design, not a real product.

About

Halcyon — reference-grade headphones. A warm, editorial, multi-page Astro concept product site.

Topics

Resources

Code of conduct

Contributing

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages