Skip to content
noel.marketing
Astro ThemeAvailable now

Solara

Solara Astro Theme for Cinematic Creative Portfolios

A cinematic Astro portfolio with WebGL hero, scroll-linked case studies, journal, and resume page.

€119.99

Solara preview
View live demoScroll to preview ->
View demo

Secure checkout via Lemon Squeezy

VisaMastercardPayPalApple PayGoogle Pay

Available payment methods may vary by device and region.

Solara

€119.99

Demo

Live preview

Preview the theme in-browser

Explore the real hosted demo directly on the product page, or open it in a dedicated tab.

Open full preview
https://solara-f5o.pages.dev/Demo

Why it fits

Why this Astro theme

  • Launch one of the most motion-rich portfolio themes in the collection without a React app shell.

  • Use scroll-linked zoom heroes, horizontal project rails, and image handoff transitions for cinematic case-study presentation.

  • Add atmospheric depth with an optional Three.js WebGL hero.

  • Ship a full page set including resume, process, services, and journal for thought leadership.

  • Filter projects on the work index with a built-in project filter bar.

  • Keep content in local MDX and TypeScript files instead of a CMS or database.

Built for

Perfect for

Typical scenarios this product is designed to support.

  • Creative director portfolio
  • UI/UX designer showcase
  • Independent design studio
  • Brand designer case studies
  • Portfolio with resume page
  • Thought leadership journal
  • Photography portfolio with case studies
  • Cinematic personal brand

In the box

Features

Concrete pages, modules, and capabilities included in the download.

  • Scroll-linked zoom hero, horizontal project rail, and image handoff transitions
  • Optional WebGL hero powered by Three.js
  • Projects, journal posts, and testimonials from local content and data files
  • Resume page with structured data from src/data/resume.ts
  • Custom cursor, ambient orbs, and floating particles
  • Project filter bar on work index
  • Lenis smooth scroll and generate:images asset script
  • Static deployment with no required CMS or backend

A cinematic portfolio built for case-study storytelling

Solara is a premium Astro theme for designers and creative directors who want scroll-linked motion, atmospheric depth, and structured case-study pages — not a flat project grid. Clay and ink scroll section dividers, ambient orbs, floating particles, and a custom cursor create a premium dark-leaning aesthetic.

Solara is one of the most motion-forward portfolio themes in the collection, while the underlying output remains static and deployable anywhere.

What is included

Solara includes home, work index and detail, journal index and detail, about, services, process, resume, contact, styleguide, RSS, and a custom 404 page.

Projects are MDX files in src/content/projects/. Journal posts live in src/content/posts/. Testimonials are JSON data. Resume content is structured in src/data/resume.ts and experience.ts.

Scroll-linked motion and WebGL atmosphere

The homepage uses ScrollZoomHero, PinnedHorizontalProjectRail, StickyProjectShowcase, ImageHandoffTransition, and CaseStudyZoomPreview components. Lenis handles smooth scroll. An optional WebGLHero powered by Three.js adds atmospheric depth to the hero.

Magnetic buttons, ambient orbs, and floating particles reinforce the cinematic feel. A project filter bar on the work index helps visitors browse by category.

Built on a static-first Astro stack

Solara is built with Astro 6.4, TypeScript, Tailwind CSS v3, MDX, Motion, Lenis, Three.js, Sharp, @tailwindcss/typography, sitemap, and RSS. A generate:images script supports the asset pipeline.

There is no required CMS, database, or backend. Node >= 22.12.0 is recommended.

Customization workflow

Replace demo projects, journal posts, testimonials, resume entries, and process copy with real buyer content. Swap or remove the WebGL hero if your brand prefers a lighter first paint. Run the image generation script when adding new portfolio assets.

Next step

Pairs well with this

Related products that fit the same product line, stack, or launch workflow.

Arrowline preview

Arrowline

€49.99

A conversion-focused Astro agency theme with case studies, pricing, journal, and directional motion.

astro theme
Astrofitness preview

Astrofitness

€39.99

A premium Astro 7 fitness theme with programs, booking, results, pricing, and cyber-athletic design.

astro theme
Atelier Motion preview

A cinematic one-page Astro portfolio with refined motion, FAQ, testimonials, and atmospheric imagery.

astro theme

Ready to launch

Start building today

Get instant access after checkout. Download the full source, customize locally, and deploy to your host.

View demo

Secure checkout via Lemon Squeezy

VisaMastercardPayPalApple PayGoogle Pay

Available payment methods may vary by device and region.

Frequently asked questions

Who is Solara built for?

Solara is designed for creative directors, UI/UX designers, portfolio-led developers, independent studios, and brand designers who need case-study storytelling with cinematic motion.

Does Solara require WebGL?

The theme includes a WebGLHero powered by Three.js for atmospheric depth. You can swap or remove the component if you prefer a fully static hero.

What pages are included?

The theme includes home, work index and detail, journal index and detail, about, services, process, resume, contact, styleguide, RSS, and a custom 404 page.

Does Solara need a CMS?

No. Projects are MDX in src/content/projects/. Journal posts are in src/content/posts/. Testimonials, metrics, and resume data live in src/data/.

How does smooth scroll work?

Lenis powers smooth scroll via a dedicated SmoothScroll component. Motion handles scroll-linked zoom heroes, horizontal project rails, and image handoff transitions.

Where can Solara be hosted?

Solara builds to static output and deploys on Vercel, Netlify, Cloudflare Pages, or any modern static host that supports Astro.