A modern, responsive personal portfolio template built with Astro 7.



What's included · Prerequisites · Getting Started · How to use · Customization

Everything you need to build a stunning personal portfolio website. Polaris is an opinionated Astro template designed for designers and developers who want to showcase their work with a clean, modern aesthetic. Built with performance and user experience in mind, it provides a solid foundation that grows with your career.

Astro 7 - Static site generator (Vite 8 / Rolldown, Rust compiler, Sätteri markdown)
React - Interactive components
Tailwind CSS - Utility-first styling
Lucide - Beautiful icon library
TypeScript - Type safety
MDX - Enhanced markdown for content
Sharp - Image optimization
Class Variance Authority - Component variant management
Radix UI - Accessible component primitives
Biome - Fast linter & formatter

.
├── public/                    # Static assets
│   ├── favicon.svg           # Site favicon
│   └── image.png             # Hero image
├── src/
│   ├── components/           # Reusable components
│   │   ├── ui/              # UI components (buttons, dropdowns, etc.)
│   │   ├── fade.astro       # Fade animation component
│   │   └── listProjects.astro # Project listing component
│   ├── config/
│   │   └── site.json        # Site configuration and content
│   ├── content/
│   │   └── projects/        # Project markdown files and images
│   ├── layouts/
│   │   └── Layout.astro     # Main layout component
│   ├── lib/
│   │   └── utils.ts         # Utility functions
│   ├── pages/
│   │   ├── index.astro      # Homepage
│   │   └── projects/        # Dynamic project pages
│   └── styles/
│       └── global.css       # Global styles
├── astro.config.mjs         # Astro configuration
├── components.json          # UI components configuration
├── package.json             # Dependencies and scripts
├── tsconfig.json            # TypeScript configuration
└── vercel.json              # Vercel deployment configuration

Node.js (version 22.12 or higher — required by Astro 7)
pnpm (recommended)
Git

Clone this repo locally with the following command:

git clone <repository-url>
cd polaris

1. Install dependencies using pnpm:

pnpm install

2. Start the development server:

pnpm dev

3. Open your browser and navigate to http://localhost:4321

This template is designed to be a starting point for your personal portfolio. It includes everything you need to showcase your work professionally while maintaining excellent performance and user experience.

• Modern Tech Stack: Built with Astro for optimal performance and React for interactive components
• Responsive Design: Fully responsive layout that looks great on all devices
• Project Showcase: Dynamic project pages with detailed case studies using MDX
• Clean Design: Minimalist aesthetic with smooth transitions and interactions
• Content Management: Markdown-based content for easy updates and maintenance
• Performance Optimized: Static site generation with optimized images and assets
• Accessible: Built with accessibility in mind using Radix UI primitives

Update src/config/site.json to modify:

• Personal information and bio
• Contact details and social links
• Professional experience timeline
• Project grid layout preferences
• Company information and specialties

1. Create a new markdown file in src/content/projects/
2. Add project images to src/content/projects/images/
3. Use the existing project structure as a template with frontmatter for metadata

• Global styles are in src/styles/global.css
• Component-specific styles use Tailwind CSS classes
• Smooth transitions and interactions built with CSS
• UI components follow a consistent design system

This project can be deployed to any static hosting service:

• Vercel: Connect your repository for automatic deployments
• Netlify: Drag and drop the dist folder or connect your repository
• GitHub Pages: Use GitHub Actions for automated deployment
• Any static hosting: Upload the contents of the dist folder

Built with ❤️ by Eduardo Calvo - UI Designer & Frontend Developer based in Madrid, Spain.