← OpenDesign
CURATED · OPEN · FREE
Antoniouve
A playful illustration and animation portfolio defined by vibrant yellow hues, bold black typography, and scattered whimsical graphic elements.
Playful Expressive Warm Friendly Studio
01
Identity DNA
Playful Whimsical Animated Illustrative Fun
A sketchbook that jumped off the page and started dancing.
02
Color
#000000Ink
#FFC900BG
#7A7A7AMuted
rgba(0,0,0,1.0)Line
High-chroma, warm yellow background with sharp black typography for maximum impact and playful energy.
03
Typography
geometric-sans
display 123px · 500h1 34px · 400body 26px · 400small 9px · 400Use geometric sans-serif for all text · Maintain tight line-heights for display text
04
Spacing
4px
8px
16px
24px
32px
48px
64px
96px
Flexible spacing with generous padding on key interactive elements.
05
Surfaces
sm · 17px
md · 17px
lg · 429px
pill · 429px
1px solid black
06
Layout
1440 container
12 columns
24px gutter
768 / 1024 breakpoints
Full-width hero canvas with scattered absolute-positioned graphic elements.
07
Motion & Interaction
450ms micro
450ms small
600ms medium
cubic-bezier(0.19, 1, 0.22, 1) easing
Smooth elastic transitions for floating elements · Transform and opacity fades
Smooth transforms and transitions on interactive elements. · Standard interaction feedback.
08
Components
button Rounded pill-shaped buttons with black borders and 24px padding. card Rounded containers, though the primary visual is scattered floating elements. hero Massive 123px title overlapping abstract animated shapes on a solid yellow background.
09
Voice & Don'ts
Tone Playful, informal, and confident. Headlines Bold, lowercase or mixed case, and highly expressive. CTAs Simple, inviting, and rounded. Don't use a white background — screenshot shows a dominant yellow instead Don't use serif fonts — screenshot shows geometric sans-serif text instead Don't make it minimal — screenshot shows a canvas full of scattered, colorful shapes instead Don't use subtle pastels — screenshot shows saturated yellow, orange, and pink accents instead Don't use sharp corners — screenshot shows rounded and pill-shaped elements instead Don't use rigid alignment — screenshot shows scattered, overlapping graphic elements instead Avoid: Corporate language Avoid: Rigid grids Avoid: Dull colors
10
Inside the pack — real screenshots
桌面首屏(hero) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 移动首屏 Captured from the live site · real computed styles
11
System prompt
This is a playful, expressive portfolio for an illustrator and animator. It is positioned as a fun, creative, and approachable studio. The dominant color is a warm yellow (#FFC900) paired with solid black (#000000) for text. Typography features a geometric sans-serif category, with large display text up to 123px and small UI text at 9px. Critical donts: Never use a white or dark background, never use rigid grid structures, never use serif fonts, and never present elements in a sterile or overly corporate manner. The layout is a full-viewport canvas with scattered, overlapping colorful graphic elements.
More from the library
en · zh-CN · zh-TW · ja · ko
OpenDesign · curated web aesthetics for AI-readable design DNA · opendesign.cc
Why we curated this: An excellent example of expressive, playful web design that prioritizes personality and motion over rigid structure.