Live preview: https://astro.nularui.dev/
All nularUI components are free to use. Sidefolio is a paid theme and includes the complete source code.
Sidefolio is a six-page developer portfolio built around a fixed navigation rail. Your identity, navigation and resume link stay accessible from the sidebar, while the main content lives in a raised panel with its own scroll.
It is built with Astro, Tailwind CSS v4 and TypeScript, with no React, Vue or Svelte runtime in the output.
What’s included
The home page includes a short introduction, featured projects and a row of the tools and technologies you work with.
The about page gives you space for a longer bio and a tilted image collage.
The projects page contains the complete project list, with each card linking to a live site, repository or case study.
The blog uses Markdown and ships with four example articles, a reverse-chronological index and individual article pages with cover artwork, publication date and rendered content.
The resume page includes a work-history timeline and is linked directly from the navigation rail.
The contact page includes a form that emits a nular-submit event with the submitted data, making it easy to connect to your own endpoint or form service.
Code blocks that work like an editor
Code highlighting happens at build time, so no syntax-highlighting library is sent to the browser.
Code cards can include a file name and a working copy button. With JavaScript disabled, they still render as clean, readable code blocks.
Accessibility built in
On smaller screens, the fixed navigation rail becomes a drawer controlled by a floating button.
The control uses aria-expanded and aria-controls, Escape closes the drawer and returns focus to the trigger, and the closed panel is marked inert so it stays out of the tab order.
Animations and transitions respect reduced-motion preferences throughout the template.
Easy to restyle
The main palette is driven by semantic colors in the Tailwind v4 theme block, so changing a small set of values updates the look of the site consistently.
The two typefaces are self-hosted and configured in the same place, with no dependency on an external font CDN.
Built to be edited
Projects, tools, resume entries and the about-page collage are stored in typed data files rather than scattered through page markup.
Blog posts are plain Markdown in an Astro content collection, with the file name used as the URL slug.
Placeholder artwork lives as SVG files in the public folder, making it easy to replace with your own assets while keeping the same structure.
Technical details
Astro 7, Tailwind CSS v4 and TypeScript.
Six main pages plus the article route.
Nine reusable components.
Content stored in typed data files and Markdown collections.
Small native custom elements for interactions.
No React, Vue or Svelte runtime.
Single light theme by design.
Works anywhere Astro can be deployed, including deployments under a subpath.
Includes a README covering the main customization points.
About nularUI
Sidefolio is built with nularUI, a collection of Astro-native UI components designed to create polished interfaces without adding a UI-framework runtime.
All 135+ individual nularUI components are free, including their source code, installation instructions and AI prompts for tools such as Claude Code, Codex and Cursor.
Sidefolio is part of nularUI Pro. Purchasing it gives you lifetime access to the complete Pro catalog, including 126 ready-made sections and 16 complete templates for SaaS, marketing, agency and portfolio sites, as well as future Pro additions.
One payment, lifetime access.
Browse all free components and preview the complete nularUI Astro catalog at https://astro.nularui.dev/
