AstroCorporate Website

astro-theme-northlight — Astro Business Template

By Sv3nskie

A one-page Astro theme for agencies, consultancies and studios, built around scroll-driven cinematic storytelling with pure CSS and a single vanilla JS file.

Open Source Site Download Source ZIP

Explore the design

Compare the page layouts and mobile experience. Open any screenshot for a closer look.

2 previews

Desktop homepage1 / 2

astro-theme-northlight · Desktop homepage

Visit websiteOpens in a new tab

Desktop captureTop of page

Actual screenshot captured by the server browser.

All pages & views 2

Screenshots show visual appearance; interactive behavior may differ.

Recorded 2026-09-30View source

What stands out

A quick read of the recorded project description.

Scroll-driven section choreography: pinned service card stacks, horizontal statements, client stories, word-by-word highlighting, parallax and 3D plate stacks that replay in reverse when scrolling up

A first-visit opening curtain shown once per session, replayable with the ?intro parameter

Custom cursor, magnetic buttons, logo marquee and number count-up animations

Responsive layout with a full-screen mobile menu, and fixed positioning using svh units to avoid the browser toolbar covering content

Respects prefers-reduced-motion, with skip links and semantic landmarks

No dependencies other than Astro, using pure CSS and a single vanilla JS file

Template Details

Northlight is a one-page corporate website theme aimed at agencies, consultancies and studios. Page content is organized into sections, each corresponding to an .astro file under src/components. Brand name, contact details, SEO title and description, and share image are configured centrally in src/config.ts. Color, font and spacing tokens live in src/styles/nocturne.css, layout and animation states in src/styles/main.css, and scroll and pointer behavior in src/scripts/main.js.

Interaction is driven by scroll position: pinned service card stacks, horizontal statement sections, client stories, word-by-word highlighting, parallax and 3D plate stacks replay upward as you scroll. A first-visit opening curtain appears once per session and can be replayed with the ?intro parameter. Custom cursor, magnetic buttons, a logo marquee and number count-up animations are also included. On mobile, a full-screen menu is provided, and fixed positioning uses svh units to avoid the browser toolbar covering content.

For accessibility, prefers-reduced-motion is respected (when enabled, all content is presented directly in its final state), and skip links and semantic landmarks are provided. There are no dependencies other than Astro. The theme uses Unsplash placeholder images, which must be replaced before launch. The build outputs static files that can be deployed to any static host, and the repository includes a GitHub Actions workflow for publishing the demo to GitHub Pages. The code is MIT licensed, and keeping the "Theme by Sv3n" footer credit is optional.

AstroCorporate Website

Is it right for your project?

Use Cases

Agencies, consultancies or studios building a one-page brand website
Showcase sites that need to present services, client stories and brand messaging through scroll-based narrative
Static sites where brand name, contact details and SEO information are managed centrally in a small number of config files
Projects that need to deploy to GitHub Pages or another static host and include a build workflow

Suitable For

Agencies, consultancies and design studios
Brand sites that prefer one-page scroll narrative over a multi-page structure
Developers using Astro who want to avoid introducing UI frameworks or animation libraries
Projects that need static output deployable to any static host

Getting started & customization

Use these recorded setup notes alongside the repository instructions for your chosen version.

1
Create the project with npm create astro@latest -- --template Sv3nskie/astro-theme-northlight, then run npm run dev
2
Edit the brand name, contact details, SEO title and description, and share image in src/config.ts; the brand name is automatically used for the logo, opening curtain and large footer text
3
Edit section copy and images file by file in src/components/*.astro; color, font and spacing tokens are in src/styles/nocturne.css, layout and animation states in src/styles/main.css, and scroll and pointer behavior in src/scripts/main.js
4
The theme uses Unsplash placeholder images; replace them with your own assets before launch and verify the licensing of third-party assets
5
Run npm run build to generate the dist/ directory, which can be deployed to any static host; the repository includes a GitHub Actions workflow for publishing the demo to GitHub Pages

Read repository instructions

License & source material

Usage conditions & limitations

Free to use · keep license notice

This entry covers the free version in the public repository under the MIT license; the free scope is the code of that version and does not mean external services or third-party assets are free.

Must comply with when using

You may use, modify, commercialize and distribute the code of this version for free.
When distributing copies or substantial portions of the code, retain the original author's copyright notice and the full MIT license notice.
The code is provided as is; warranties and limitations of liability are governed by the original license and applicable law.

Additional costs & items to verify

The placeholder images bundled with the theme come from Unsplash and are not provided under the MIT license with the code; replace them with your own assets before launch and verify the licensing and usage conditions of third-party images yourself.
Keeping the "Theme by Sv3n" footer credit is only the author's request, not a mandatory condition of the MIT license, and it may be removed.
Demo images, fonts, icons and other third-party assets must be checked against their respective licenses and cannot be judged solely by the code's MIT license.
External services such as domains, hosting, databases, payments or AI may incur separate charges.

View Original Text Basis

Permission is hereby granted, free of charge
Original License Text

Placeholder photography is from [Unsplash](https://unsplash.com) — replace it with your own before launch.
Original README

Keeping the small "Theme by Sv3n" credit in the footer is appreciated but not required.
Original README

https://github.com/Sv3nskie/astro-theme-northlight/blob/main/LICENSE https://github.com/Sv3nskie/astro-theme-northlight/blob/main/README.md

Compiled by DeepSeek based on repository license and README ·2026-10-01. Results only cover the materials read; dependencies, images, fonts, and subsequent term changes are subject to their respective original texts.

Project checks & description sources

Template Information

Source platforms: GitHub
Documentation and maintenance reference score: More documented · 80 / 100
Technologies: Astro
Website type: Corporate Website

How this score is calculated

Our heuristic uses license records (up to 30), a demo link (12), a preview (10), stars (15), recorded maintenance (15), description completeness (8), feature records (5) and classification data (5). It is not a code, security or performance test, or a Google score. A link does not establish tested functionality.

What to verify for this project

Repository update recorded: 2026-09-28
Screenshot last checked: 2026-10-01

A demo link is listed. Check it with your own content and viewport sizes; its presence does not confirm that forms, authentication or payments work.

The catalog identifies Astro as the primary stack. Check the actual dependency manifest and lockfile for versions and hosting requirements. These notes use recorded metadata, not a code audit or a deployment test.

Use a selection guide →

How this description was prepared

AI-assisted description based on catalog records and repository material. Repository authors are not automatically the reviewers of this description.

Automatically checked against source and license rules; no manual editorial review.

Inspect the recorded source material

SHA-256: fb364164d026194d0821c5b3fc0a59a2f6070c6528bd46e8acc9ef0465e55eb4

2026-10-01T14:19:22.579Z

Source file / repository

# Northlight — Astro theme

A cinematic, scroll-driven one-page theme for **agencies, consultancies and studios**. Dark, fast, and built with plain CSS and a single vanilla JS file — no UI framework, no animation library.

**[Live demo →](https://sv3nskie.github.io/astro-theme-northlight/)**

## Features

- **Scroll choreography that rewinds.** Pinned chapters (a stacked services deck, a horizontal statement, client stories), word-by-word lighting, parallax and a 3D plate stack — all driven by scroll position, so everything plays backwards on scroll-up.
- **Intro curtain** on first visit (once per session; add `?intro` to replay).
- **Custom cursor, magnetic buttons, logo marquee, animated counters.**
- **Fully responsive** with a full-screen mobile menu and `svh`-based pinning so mobile browser bars never hide content.
- **Accessible:** respects `prefers-reduced-motion` (everything renders in its final state), skip link, semantic landmarks.
- **Zero dependencies** beyond Astro.

## Getting started

```bash
npm create astro@latest -- --template Sv3nskie/astro-theme-northlight
cd <your-project>
npm run dev
```

## Make it yours

| What | Where |
| --- | --- |
| Brand name, contact details, SEO title/description, share image | `src/config.ts` |
| Section copy and images | `src/components/*.astro` (one file per section) |
| Colors, type and spacing tokens | `src/styles/nocturne.css` |
| Layout and animation states | `src/styles/main.css` |
| Scroll/pointer behaviour | `src/scripts/main.js` |

The brand name drives the logo, the intro curtain and the big footer wordmark automatically.

Placeholder photography is from [Unsplash](https://unsplash.com) — replace it with your own before launch.

## Deploying

Any static host works (`npm run build` → `dist/`). The included GitHub Actions workflow publishes the demo to GitHub Pages.

## Credits

Designed and built by **[Sven Esser](https://sv3n.dev?utm_source=github&utm_medium=theme-readme&utm_campaign=northlight)** — full-stack & Web3 developer. Need a custom site? [Get in touch](https://sv3n.dev/contact?utm_source=github&utm_medium=theme-readme&utm_campaign=northlight).

MIT licensed. Keeping the small "Theme by Sv3n" credit in the footer is appreciated but not required.

Report a correction

Explore similar templates

Compare previews and descriptions within the same stack and category.

astrowind

AstroWind is a free, open-source Astro starter theme using Astro and Tailwind CSS, released under the MIT license.

Astro · Blog

astro-landing-page

An Astro + Tailwind CSS landing page example template with theme variables, dark mode, responsive layout, and Open Graph tags, under the MIT license, suitable as a starting point for single-page product, event, or corporate homepage sites.

Astro · Corporate Website

Tailcast

Tailcast is a dark-themed corporate website template built with Astro and Tailwind CSS for a fictional startup.

Astro · Corporate Website

Positivus

Positivus is an Astro and Tailwind CSS landing page theme for digital marketing agencies, maintained by manulthanura with a demo on Vercel.

Astro · Corporate Website

qwind

Qwind is a free and open-source website template built on Qwik and Tailwind CSS, featuring directory-based routing via QwikCity, a Markdown blog, dark mode, and static deployment configuration.

Astro · Tool Site

agency-landing-page-Astrojs

A single-page digital agency landing page template built with Astro and Tailwind CSS, featuring light and dark themes and a modular component directory. Suitable for static showcase pages, with MIT-licensed code and third-party assets requiring separate license verification.

Astro · Corporate Website