Apple-Style Portfolio

Apple-Style Portfolio is a modern portfolio template that brings Apple's minimalist design language to a personal or client site, built with Astro, Tailwind CSS, GSAP animations, and Three.js for 3D elements.

What is Apple-Style Portfolio?

Apple-Style Portfolio is a free, MIT-licensed portfolio template built on the Astro framework with React components, Tailwind CSS styling, GSAP animations, and Three.js 3D integration. It produces a fully responsive, minimalist portfolio site from your own content and deploys to static hosts such as Vercel or Cloudflare Pages. The repository is maintained by itsyujay on GitHub.

Key Features

• Apple-style design aesthetic — a minimalist visual direction modeled on Apple's design concept, per the template's stated intent.
• Astro framework — built with Astro for the site structure and build pipeline; requires Node.js v20 or higher.
• Tailwind CSS styling — utility-first styling across the template's pages.
• GSAP animations — animation library integrated for motion effects.
• Three.js 3D elements — 3D integration alongside the standard page content.
• React component support — React components can be used inside the Astro project.
• Fully responsive layout — the design adapts across screen sizes.
• Typography — uses the Inter and Source Sans Pro fonts.

Who is it for?

• Developers building personal portfolios: scaffold a portfolio site with one command and customize the content.
• Freelancers and agencies doing client work: the MIT license permits invoicing for work shipped on the template.
• Astro learners: a reference project combining Astro, React, Tailwind, GSAP, and Three.js in one codebase.

What can you do with Apple-Style Portfolio?

• Ship a portfolio fast: run npm create astro@latest -- --template itsyujay/apple-style-portfolio, install dependencies, and start npm run dev on localhost:4321.
• Deploy to Vercel: fork the repository, connect it to Vercel through GitHub, and Vercel auto-detects Astro and configures the build.
• Deploy to Cloudflare Pages: connect the repo in the Cloudflare dashboard with build command npm run build, output directory dist, and Node.js 20.x.

How does Apple-Style Portfolio work?

Clone the repository or scaffold it with the Astro create command, run npm install, then npm run dev for local development. Build with npm run build and preview the production output with npm run preview before deploying to Vercel or Cloudflare Pages.

Pricing

Apple-Style Portfolio is MIT licensed and free for commercial use. The page lists optional support tiers: a $75 commercial sponsorship, a $199 ship-assist, and a $499/yr agency plan.

FAQ

Is Apple-Style Portfolio free?

Yes. The template is MIT licensed, meaning you can use it for client work and invoice for it without owing anything. Optional paid support tiers exist but are not required to use the template.

What Node.js version does it need?

The prerequisites state Node.js v20 or higher, and the Cloudflare Pages deployment instructions specify Node.js 20.x as the build environment version.

Where can the template be deployed?

The README documents two deployment paths: Vercel, which auto-detects Astro, and Cloudflare Pages, using npm run build with the dist output directory.