Skip to content
datingonlinecn.com logo

全球免費線上約會

datingonlinecn.com

“A functional, no-nonsense utility brand that prioritizes accessibility and clarity over aesthetic flair. The design is strictly flat and utilitarian, using a standard system font stack to convey reliability and ease of use for a global audience seeking straightforward connections.”

utilitarian
flat
accessible
global
functional
system-font
minimalist
direct

Color Palette

Colors

#088ce1

primary

#ffffff

background

#525252

text

#088be1

secondaryText

#525252

link

#088be1

muted

Typography

Fonts

Arial

body
400
700
system

Helvetica, sans-serif

Arial

heading
700
system

Helvetica, sans-serif

body

The quick brown fox

h1

The quick brown fox

Components

Design System

開始註冊
primary
5px
#088ce1#ffffff

Voice & Tone

Personality

Visual Energy

3/10

Design Era

flat-2.0

Emotional Tone

reliable-neutral

Target Audience

Global users seeking practical, low-friction dating platforms who value functionality and clarity over luxury or gamification.

Comparable Brands

TaskRabbit
Craigslist
Meetup
GitHub

Brand Rules

Dos & Don'ts

Do

  • Use Arial as the sole typeface family for all headings (weight 700) and body text (weight 400).
  • Apply lowercase casing to all headings to maintain a casual yet structured hierarchy.
  • Set body text line-height to exactly 20px for optimal readability on standard screens.
  • Style primary CTA buttons with #088ce1 background, #ffffff text, 5px border-radius, and 12px 24px padding.
  • Maintain a flat design system by avoiding all box-shadows and gradients across the interface.
  • Use #525252 for primary body text and #ffffff for backgrounds to ensure high contrast and accessibility.
  • Keep border-radius consistent at 5px for all interactive elements and containers.
  • Use action-oriented imperative verbs in copy (e.g., 'Start Registration') without exclamations or emojis.

Don't

  • Do not use any serif fonts; the brand is strictly sans-serif using system fonts.
  • Do not apply box-shadows or depth effects; the design must remain completely flat.
  • Do not use gradients for buttons or backgrounds; use solid colors only.
  • Do not use title case or sentence case for headings; strictly enforce lowercase.
  • Do not include emojis or excessive punctuation (exclamations) in marketing copy.
  • Do not deviate from the #088ce1 primary blue for main interactive elements.
  • Do not use complex animations or transitions; keep interactions simple and immediate.
  • Do not use decorative borders; rely on spacing and color contrast for separation.

Design Assets

Visual Elements

與世界各地的人們免費在線約會
png320×45

DESIGN.md

AI-ready

Drop into any project root. Cursor, Claude Code, v0, Lovable, and other AI coding agents read this file to generate on-brand UI. Spec

Download
DESIGN.md not yet generated for this brand.
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
cURL
# Fetch the full brand kit
curl https://extractvibe.com/api/brand/datingonlinecn.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.

Get started free