CURATED · OPEN · FREE

ABC Dinamo

A modern, refined type foundry website that emphasizes bold typography, editorial imagery, and a minimalist white-space driven layout.

typefoundry
ABC Dinamo screenshot
↓ Download design system (24 MB)Open in OpenDesign

Visit: https://abcdinamo.com

📦 Browse pack contents →

01

Identity DNA

typographyfoundrytypefacedesigncustom

A premium boutique for digital type, treating fonts as high-end collectible tools.

02

Color

#FEE905Accent
#000000Ink
#FFFFFFBG
#F0F4F6BG quiet
#EBEBEBMuted
rgba(0,0,0,0.1)Line

Minimalist high-contrast palette with a stark white canvas, black typography, and a single vibrant yellow accent.

03

Typography

geometric-sans · humanist-sans · monospace

All text uses a weight of 400. · Large headlines use tight letter spacing. · Text transforms to uppercase sparingly for labels.

04

Spacing

4px
8px
16px
24px
32px
48px
64px
96px

Generous whitespace between sections, with tight, structured spacing within navigation and UI components.

05

Surfaces

sm · 4px
md · 12px
lg · 30px
pill · 999px

Minimal borders, occasionally using 1px solid black for UI separation.

rgb(255, 249, 0) 0px 0px 0px 1px

06

Layout

1280container
12columns
24pxgutter
768 / 1024breakpoints

Asymmetric split layout with a persistent left-aligned navigation sidebar and a central/right content area for hero images and features.

07

Motion & Interaction

250msmicro
400mssmall
800msmedium
cubic-bezier(0.1, 0.6, 0.4, 1)easing

Smooth opacity and background fades for page transitions. · Cubic-bezier transforms for micro-interactions. · Linear delays for sequential element loading.

Subtle color shifts or background changes on navigation and UI elements. · Immediate feedback through active states.

08

Components

09

Voice & Don'ts

10

Inside the pack — real screenshots

ABC Dinamo — 桌面首屏（hero）
桌面首屏（hero）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
ABC Dinamo — 移动首屏
移动首屏

Captured from the live site · real computed styles

11

System prompt

This is a modern, refined type foundry website that emphasizes bold typography, editorial imagery, and a minimalist white-space driven layout. The design uses a stark white background with solid black text for maximum contrast, occasionally accented by a vibrant yellow. Typography is predominantly clean geometric and humanist sans-serif categories, presented at a large scale with tight letter spacing in headlines. A persistent left-aligned navigation sidebar anchors the interface. Key hex colors include #FFFFFF, #000000, and #FEE905. Critical donts: never use bold font weights, avoid dark mode entirely, do not introduce complex gradients, stick to sans-serif categories, keep color usage strictly minimal, and always use heavily rounded corners for cards and chips.

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