Free Liquid Glass portfolio template for React

Preview

The portfolio starter with an introduction, three project cards and a glass navigation dock

Installation

Add the @glassyui namespace to your Tailwind 4 project following Getting Started, then install:

Install portfolio

pnpm dlx shadcn@4.14.1 add @glassyui/glass-portfolio

Render it in your page. The install includes its components, stylesheet and backdrop artwork.

Portfolio page

import { GlassPortfolio } from '@/components/glassyui/glass-portfolio';

export default function Page() {
  return <GlassPortfolio />;
}

Make it yours

Pass your own profile and projects, then change the copied source and CSS as you like. The preview uses fictional sample work and an example email address.

Customize the portfolio →

The block uses Glass Scene, Panel, Button and Dock. It needs no hosted assets or extra service. Mount GlassProvider once if you want synchronized appearance preferences.