Kostenloses Online-Dating weltweit
datingonlinede.com“A functional, no-nonsense utility brand focused on global connectivity and simplicity. The aesthetic is strictly utilitarian and flat, prioritizing clarity and accessibility over emotional flair or decorative elements. It feels like a reliable, straightforward tool for finding relationships rather than a lifestyle magazine.”
Color Palette
Colors
Typography
Fonts
Arial
Helvetica, sans-serif
Arial
Helvetica, sans-serif
The quick brown fox
14pxThe quick brown fox
24pxComponents
Design System
Voice & Tone
Personality
Visual Energy
Design Era
flat-2.0
Emotional Tone
neutral-helpful
Target Audience
Non-technical users seeking straightforward, free international dating services who value functionality and clarity over luxury or trendiness.
Comparable Brands
Brand Rules
Dos & Don'ts
Do
- Use Arial (system sans-serif) for all text; headings at 700 weight in Title Case, body at 400 weight with 20px line-height.
- Primary CTA buttons must use #088ce1 background, #ffffff text, 5px border-radius, and 12px 24px padding.
- Maintain a flat design aesthetic: strictly NO box-shadows and NO gradients on any element.
- Use #525252 for all body text and #000000 or #1a1a1a for headings to ensure high contrast against #ffffff background.
- Keep copy simple and jargon-free; use action-oriented imperative verbs for CTAs (e.g., 'Registriere dich', 'Starte deine Suche').
- Apply a 2px base spacing unit for consistent padding and margin calculations across layout components.
- Avoid decorative elements like emojis, icons with heavy styling, or complex illustrations; stick to clean, functional UI.
- Use #088ce1 as the sole primary accent color for interactive states and key highlights to maintain visual hierarchy.
Don't
- Do not use serif fonts (e.g., Georgia, Times New Roman) or non-system fonts; the brand is strictly Arial-based.
- Do not use title-case for body text; reserve Title Case exclusively for headings.
- Do not use emojis or exclamation marks in marketing copy; the tone is matter-of-fact and serious.
- Do not apply any drop shadows, inner shadows, or multi-layer depth effects to buttons, cards, or containers.
- Do not use gradients for backgrounds or buttons; all surfaces must be solid flat colors.
- Do not use pill-shaped buttons (100% border-radius); strictly use 5px medium border-radius for all interactive elements.
- Do not use vibrant or neon colors outside the primary #088ce1 and neutral grays; keep the palette limited and professional.
- Do not use complex animations or hover effects that alter layout; keep interactions subtle and immediate.
Design Assets
Visual Elements
How to use this file
1. Save this file as DESIGN.md in your project root (sibling to README.md).
2. AI agents that read project files (Claude Code, Cursor, v0, Lovable, Bolt, Windsurf) will discover it automatically.
3. Validate or export tokens with the official CLI:
npx @google/design.md lint DESIGN.md npx @google/design.md export --format tailwind DESIGN.md
Developer Access
# Fetch the full brand kit
curl https://extractvibe.com/api/brand/datingonlinede.com \
-H "x-api-key: ev_your_key"
# Export as CSS variables
curl https://extractvibe.com/api/extract/JOB_ID/export/css \
-H "x-api-key: ev_your_key"
# Export as Tailwind config
curl https://extractvibe.com/api/extract/JOB_ID/export/tailwind \
-H "x-api-key: ev_your_key"Extract your own brand kit
Get colors, fonts, voice, and personality from any website in seconds. Open source.