CURATED · OPEN · FREE

Danielaandmoe

An elegant, warm, and illustrative editorial website for a wedding celebration.

EditorialCurationPhotographicPremiumClean
Danielaandmoe screenshot
↓ Download design system (24 MB)Open in OpenDesign

Visit: https://danielaandmoe.com

📦 Browse pack contents →

01

Identity DNA

WeddingCelebrationEditorialWarmInvitation

A high-end printed wedding invitation suite translated into a digital editorial format.

02

Color

#11223FInk
#F7BCA5Ink soft
#FEF1ECBG
#FF5734Muted
rgba(255,87,52,1.0)Line

A warm, earthy palette centered around a soft peach background and deep navy text, punctuated by terracotta accents.

03

Typography

didone-serif · humanist-sans

Use didone-serif for all major display and heading text to convey elegance. · Use humanist-sans for body copy and smaller labels to maintain readability. · Apply generous tracking to all uppercase labels for a refined, airy feel.

04

Spacing

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

A flexible, spacious rhythm that prioritizes generous padding and margins to let the illustrations breathe.

05

Surfaces

sm · 0px
md · 0px
lg · 0px
pill · 200px

A 1px solid navy border is used primarily for button outlines, while thin terracotta lines serve as decorative dividers.

06

Layout

1280container
12columns
24pxgutter
768 / 1024breakpoints

A clean, centered single-column layout for content, heavily decorated with floating, asymmetric organic illustrations.

07

Motion & Interaction

125msmicro
275mssmall
750msmedium
cubic-bezier(0.52, 0.12, 0.46, 1.1)easing

Elastic, slightly bouncy transitions for interactive elements like buttons. · Smooth, slow ease-out transitions for background and transform properties.

Subtle background and color shifts using a custom cubic-bezier easing curve. · Immediate tactile response via fast transitions.

08

Components

09

Voice & Don'ts

10

Inside the pack — real screenshots

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

Captured from the live site · real computed styles

11

System prompt

A warm, editorial wedding website that blends elegant typography with organic, hand-drawn illustrations. The design uses a soft peach (#FEF1EC) background and deep navy (#11223F) text for a sophisticated contrast. The typography mixes a refined didone serif for headlines with a clean humanist sans-serif for body copy, both set with generous letter-spacing. Key interactions feature a custom bouncy easing curve. Do not use stark whites, rigid geometric shapes, or heavy bold fonts. Maintain a spacious, breathing layout that allows the decorative illustrations to stand out without cluttering the content.

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