CURATED · OPEN · FREE

Henryheffernan

A stark, monochrome interactive portfolio that relies on bold typography and a command-line aesthetic to showcase work.

PortfolioMonochromeBold TypographyExperimentalDark Mode

↓ Download design system (0 MB)Open in OpenDesign

Visit: https://henryheffernan.com

📦 Browse pack contents →

Identity DNA

portfolioexperimentalterminalminimalistinteractive

A minimalist terminal boot screen for a digital portfolio.

Color

#FFFF00Accent

#FFFFFFInk

#000000BG

rgba(255, 255, 255, 1.0)Line

High-contrast monochrome with a single neon accent for warnings.

Typography

transitional-serif · monospace

body16px · 400

All text is rendered in a consistent monospace or serif typeface at a uniform base size. · Letter spacing is slightly opened for improved legibility on the dark background.

Spacing

4px

8px

16px

24px

32px

48px

64px

96px

Generous internal padding within containers to prevent text from touching borders.

Surfaces

sm · 0px

md · 0px

lg · 0px

pill · 0px

Hard, thick white or black strokes used for primary containment and interactive elements.

Layout

1280container

12columns

24pxgutter

768 / 1024breakpoints

Centered single-column layout with nested bordered containers.

Motion & Interaction

200msmicro

200mssmall

200msmedium

cubic-bezier(0.4, 0.0, 0.2, 1)easing

Opacity and transform transitions for element reveals. · Typewriter-style blinking cursor effect implied by the prompt.

Cursor changes to a pointer; elements likely respond with opacity or color inversion. · Triggers state changes or transitions to the next portfolio section.

Components

button Outlined box with uppercase monospace text.
card Bordered rectangular containers with high internal padding.
chip N/A
input N/A
hero Full-screen dark canvas with a single centered bordered prompt box.

Voice & Don'ts

Tone Direct, technical, and minimalist.
Headlines Uppercase monospace or bold serif, presented within rigid borders.
CTAs Simple, clear instructions in monospace followed by a bordered button.

don't use rounded corners — screenshot shows sharp, hard-edged rectangular borders instead
don't use soft gradients — screenshot shows flat, high-contrast solid colors instead
don't use decorative imagery — screenshot shows a purely typographic, text-based interface instead
don't use a light theme — screenshot shows a dominant black background with white text instead
don't use decorative sans-serifs — screenshot shows a mix of monospace and transitional-serif fonts instead
don't use subtle shadows — screenshot shows flat elements defined purely by thick borders instead
Avoid: Avoid soft gradients or rounded corners.
Avoid: Avoid decorative illustrations or complex background imagery.
Avoid: Avoid warm, friendly, or overly casual language.
Avoid: Avoid multiple competing font families or weights.
Avoid: Avoid standard, unstyled web elements.
Avoid: Avoid cluttered layouts with many visible controls.

Inside the pack — real screenshots

Henryheffernan — 桌面首屏（hero） — 桌面首屏（hero）

Henryheffernan — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Captured from the live site · real computed styles

System prompt

This is a minimalist, experimental portfolio site that uses a terminal-inspired aesthetic. It is positioned as a bold, interactive digital showcase. The primary colors are stark black (#000000) and white (#FFFFFF), with a bright yellow (#FFFF00) used sparingly for system warnings. Typography relies heavily on monospace and transitional-serif categories at a uniform 16px base size. Key critical donts: avoid using rounded corners, as the design relies on sharp, hard edges; avoid using decorative imagery, as the focus is purely on typography; and avoid using soft gradients, as the palette is strictly monochrome with flat color fills.

Bring this taste to your agent

Hand your AI agent a machine-readable spec of this design — tokens, type, motion, the whole DNA.

OpenDesign skill ↗ · This pack for agents ↗

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