Astro Website for Online Course Platform - Halftone

Halftone is a concept site I designed and built in Astro for an online school with short courses in code, Figma, data and AI tools.

Show 8 courses, 4 subjects, 5 teachers and learning paths without a heavy app, while keeping the brand idea (a picture that loads from rough to sharp) visible.

Halftone visual system that runs through the hero, course cards and section dividers.

Course catalogue, subjects, teachers and paths driven by Astro content collections, so new courses are added as content, not code.

Pricing for single courses and bundles, reviews, FAQ and a clear free-lessons entry point.

Static build on Cloudflare Pages with fast load and full SEO markup.

Four subjects as colour cards; the open card lists its courses and lessons.

The catalogue lists every course with its level, number of lessons, length and price, filtered by subject.

Learning paths put two or three courses in the right order for less than buying them one by one.

Teacher portraits use the same dithered style as the hero.

Pay for one course or once for all of them, with no subscription.

The page was designed in Figma first, desktop and mobile with 25 components, then built in Astro on the Lumos framework. Content can also be edited in Sanity: the Studio runs at /admin and reads the same content model.

An editorial course site that is easy to extend and quick on any device.

Live demo: https://halftone-astro.pages.dev/