CURATED · OPEN · FREE

Buck

A minimalist, high-contrast portfolio designed to let large-format creative work take center stage.

01

Identity DNA

A high-end creative agency portfolio showcasing large-scale motion and brand work.

02

Color

Extreme minimalism with a strict black-and-white canvas, using vibrant project imagery as the only source of color.

03

Typography

geometric-sans · monospace

• display50px · 100
• body21px · 100

The primary typeface (Mabry) is used exclusively across all elements. · Headings and body text both utilize an ultra-light weight (100). · Text transforms to uppercase are frequently applied for project categories.

04

Spacing

Asymmetric, with large generous padding around project thumbnails and a clear vertical flow.

05

Surfaces

Extremely thin 1px solid borders used sparingly, primarily for structural separators or interactive elements.

06

Layout

A loose, masonry-like grid where project cards of varying sizes are placed with wide gutters.

07

Motion & Interaction

Smooth transitions on background-color changes. · Subtle hover effects on project cards. · Staggered reveal of grid items on scroll.

Subtle background-color shifts or slight opacity changes on project thumbnails. · Direct navigation to project case studies, often with a smooth page transition.

08

Components

• button Minimalist text-based buttons, often in uppercase, relying on thin weights for elegance.
• card A clean container holding a large full-bleed image followed by structured text metadata (Category, Title, Description).
• chip Uppercase text labels used to categorize work without traditional box or pill styling.
• input Search functionality likely uses a minimalist icon-triggered input or full-screen overlay.
• hero A bold, large-scale typography block that states the company's mission in a single continuous flow.

09

Voice & Don'ts

• Tone Professional, authoritative, yet understated.
• Headlines Ultra-light, large-scale sans-serif type that conveys confidence through simplicity.
• CTAs Minimalist, relying on navigation links rather than prominent call-to-action buttons.

• Don't use bold weights for headings — screenshot shows ultra-light (100) weights for all primary text.
• Don't add drop shadows to project cards — screenshot shows completely flat, clean surfaces.
• Don't use a colorful background — screenshot shows a strictly pure white (#FFFFFF) canvas.
• Don't use rounded corners on containers — screenshot shows sharp, rectangular thumbnails.
• Don't use decorative borders — screenshot shows clear separation through whitespace and minimal line weight.
• Don't use complex, multi-layered grid layouts — screenshot shows a relatively simple, staggered 2-column flow.
• Avoid: Heavy, bold typefaces for body copy.
• Avoid: Cluttered layouts or dense paragraphs.
• Avoid: Decorative flourishes or unnecessary borders.

10

Inside the pack — real screenshots

Captured from the live site · real computed styles

11

System prompt

en · zh-CN · zh-TW · ja · ko