Spotlite is a beautiful personal website template built with Astro and UnoCSS, inspired by a similar sounding template from the Tailwind CSS team. Best of all, it's open source (MIT licence) so feel free to use and modify it!

It uses the following technologies:

• Astro
• Alpine.js
• Typescript
• Prettier
• ESLint
• UnoCSS
• @astrojs/sitemap and @astrojs/rss preintegrated
• Heroicons and SVG Logos preloaded via Iconify

It features:

• A homepage featuring photos, links to blog articles, and a career history.
• An About page that can be edited in Markdown and featuring a profile photo and social media links.
• An Articles page linking to blog articles.
• A Projects page showcasing a portfolio of items with descriptions, images and links.
• A Creations page showcasing linkable artefacts.
• A Uses page providing a bragging list of products and tools used.

Spotlite uses all the latest and greatest features in Astro (>2.5.0) including:

• optimised assets
• dala and content collections
• endpoints
• sitemap
• RSS

It’s production-ready and easy to customize, making it the perfect starting point for your own personal website.

It's also simple to deploy on Netlify or similar.

Inside of your Astro project, you'll see the following folders and files:

/
├── astro.config.mjs          # Astro configuration file 
├── public/                   # Location of static assets
│   └── favicon.svg
├── src/
│   ├── assets/               # Location of dynamic assets (eg. images)
│   │   └── screenshot.png
│   ├── components/           # Astro components
│   │   └── header.astro
│   ├── content/              # Location of content (markdown, data and images)
│   │   └── config.ts
│   ├── layouts/              # Location of layouts for pages
│   │   └── Layout.astro
│   └── pages/                # Location of pages
│       └── index.astro
├── package.json
└── uno.config.ts             # UnoCSS configuration file

All commands are run from the root of the project, from a terminal: