UXFolio - UI/UX designer portfolio template built with Tailwind CSS
A Tailwind CSS portfolio template designed for UI/UX designers, featuring case study-driven layouts, Alpine.js interactions, and a minimalist grid-based design that puts your design process front and center.
Optimized layout that looks polished on mobile, tablet, and desktop screens.
Case study-driven sections let you tell the full story behind each project.
Change colors, fonts, and layouts quickly with utility-first Tailwind classes.
Lightweight modals, accordions, and tabs without heavy JavaScript frameworks.
Homepage, about, services, projects, blog, blog detail, contact, and legal pages.
Setup, structure, and customization guide included for quick onboarding.
Showcase your UX design process with a purpose-built portfolio template
UXFolio is a portfolio template built with Tailwind CSS and Alpine.js, designed specifically for UI/UX designers who want to present their work through a process-driven lens. Rather than simply displaying finished visuals, the template emphasizes case study narratives, letting you walk visitors through your design thinking, research, and iterations. The clean, grid-based layout uses generous whitespace and a refined typographic scale to keep the focus on your projects. Whether you're a product designer seeking freelance clients or a UX researcher applying for in-house roles, this template provides a polished foundation to tell your design story.
What's included
- Homepage with hero intro, featured work showcase, and call-to-action sections
- About page for sharing your background, skillset, and design approach
- Services page with structured service cards
- Projects page featuring a portfolio gallery with filtering and modal previews
- Blog listing and blog detail pages with clean reading typography
- Contact page with form, location info, and social links
- Privacy policy and terms of service pages
- Documentation covering setup, structure, and customization
Ideal for
- UI/UX designers building a personal portfolio site
- Product designers showcasing detailed case studies and design processes
- UX researchers presenting findings and project narratives
- Interaction designers highlighting their workflow and deliverables
- Freelance designers looking to attract new clients
Pages included
- Homepage — Hero section, featured projects, and primary call-to-action
- About — Background, skills, and design philosophy
- Services — Service offerings displayed as cards
- Projects — Filterable gallery with modal-based project views
- Blog & Blog Detail — Article listings and full post layouts
- Contact — Form with location details and social links
- Legal — Privacy policy and terms of service
Good to know
This is a static HTML template with no backend functionality. The build process uses Gulp as its task runner, and setup requires running npm install followed by npm run dev for local development. Alpine.js handles lightweight interactions like modals, accordions, and tabs without requiring heavier JavaScript frameworks.
