Project Detail
A project detail page layout featuring a large hero image with overlaid title, followed by a metadata section displaying project details like category, year, and artist. Includes a description section and a gallery grid. Ideal for portfolio sites, art galleries, and creative showcases.
A two-column project detail layout with a sticky sidebar containing project metadata and navigation. The main content area displays a hero image, description, and gallery. The sidebar remains visible while scrolling through the content. Perfect for detailed project pages with extensive information.
A long-form case study layout with prose sections and inline images. Features a hero section with title and metadata, followed by multiple content sections with headings and body text. Ideal for detailed project write-ups, design case studies, and portfolio pieces that require extensive explanation.
A project detail layout with a sidebar containing section navigation links. Users can click navigation items to scroll to specific sections. Features a hero image, multiple content sections with images, and smooth scroll behavior. Perfect for long project pages with distinct sections.
A dramatic project detail layout with a fullscreen hero image that fills the viewport. Title and metadata overlay the hero with a gradient for readability. Content sections follow below with alternating layouts. Ideal for visually striking portfolio pieces and creative showcases.
A gallery-focused project detail layout designed for showcasing physical artworks like sculptures. Features a large hero image with title overlay, detailed specifications section, and a masonry-style gallery. Includes dimensions, materials, and exhibition information. Perfect for artists and galleries.
A project detail layout emphasizing a grid-based image gallery. Features a compact header with title and metadata, followed by a responsive grid of project images. Each image can have a caption. Ideal for photography portfolios, product showcases, and visual-heavy projects.
A split-layout project detail page with materials and specifications on one side and images on the other. Features a hero section, detailed specs list, and gallery. Perfect for product design, industrial design, and projects where materials and construction details are important.
A compact project detail layout with metadata displayed in a horizontal bar. Features a hero image, inline metadata items, description, and gallery. Space-efficient design ideal for projects with multiple metadata fields that need to be visible at a glance.
A minimalist, centered project detail layout with clean typography and generous whitespace. Features a centered title, subtitle, and description with a single hero image. Gallery images displayed in a simple grid. Perfect for elegant, understated portfolio presentations.
A project detail layout with an interactive hover-reveal gallery. Images display titles and descriptions on hover with smooth animations. Features a header section with back navigation, title, and metadata. Ideal for interactive portfolios and creative showcases.
A project detail layout with a card-based header containing the hero image and metadata. The card has rounded corners and a subtle shadow. Content and gallery follow below. Modern, polished design ideal for tech portfolios and SaaS case studies.
A project detail layout with a sidebar listing exhibition history and venues. Features a hero image, description, and gallery in the main content area. The sidebar displays past and upcoming exhibitions with dates and locations. Perfect for artists and galleries.
A project detail layout with a related projects section displayed as a list. Features a hero image, metadata, description, and gallery, followed by a list of related projects with thumbnails. Encourages exploration of similar work. Ideal for portfolio sites.
A project detail layout with a carousel for showcasing architectural or spatial projects. Features navigation controls, dot indicators, and multiple content sections with alternating image placement. Includes a detail grid at the bottom. Perfect for architecture and interior design portfolios.
An editorial-style project detail layout designed for fashion and photography projects. Features a large title, hero image with portrait aspect ratio, credits sidebar listing team members, and a gallery of editorial images. Perfect for fashion shoots and creative collaborations.
A project detail layout with breadcrumb navigation and a sticky sidebar. Features a two-column layout with metadata in the sidebar and images in the main content area. Breadcrumbs show the navigation path. Ideal for photography portfolios with organized categories.
A project detail layout with an extra-large hero section featuring gradient overlay and scroll-based opacity effects. Includes a details grid, multiple prose sections with alternating layouts, and a gallery. Dramatic and immersive design for featured projects.
A comprehensive case study layout with tabbed navigation for different sections like Overview, Challenge, Solution, and Results. Includes content sections, testimonials, and a tools/technologies section. Perfect for detailed project case studies and client work showcases.
A project detail layout with large numbered section headings. Each section features a prominent number (01, 02, 03), title, description, and image with alternating left/right placement. Creates a clear visual hierarchy and reading flow. Ideal for process-oriented case studies.
A project detail layout with scroll-triggered clip-path reveal animations. Images are revealed as the user scrolls using CSS clip-path transitions. Features parallax effects and smooth animations. Creates an engaging, cinematic viewing experience for visual projects.
A project detail layout with parallax scroll effects throughout. The hero section features Y-axis parallax and opacity transforms. Content sections have staggered parallax effects creating depth. Ideal for immersive storytelling and visually dynamic project presentations.
