16:10 media
Card
Destination tile
Soft shadow, line border, hover lift — no neon edge.
Brand kit
Night Formation
How Latest Byte looks and speaks online — restrained drone-show light, operator-grade calm. Live samples from production tokens.
Identity
Brand lines
Prefer constants from code over hard-coded variants.
- Brand
- Latest Byte
- Product
- China Innovation Tour — GBA
- Full line
- Latest Byte - China Innovation Tour — GBA
- Tagline
- 8 Days · Inside How China Builds
- Domain
- latestbyte.com
Page titles: {Page} | Latest Byte· Source: src/consts.ts
Logo mark
Monochrome mark inherits currentColor. Dark on light chips; light on ink. Avoid multicolor LED treatments.
Concept
Night Formation
Chongqing drone shows work because of dark field + sparse, precise light — not because everything glows.
Stage
Deep night sky
Ink heroes, footer, closing bands — ~20–25% of the site.
Formation
Cool aqua
Links, focus, kickers. Bright aqua only on dark surfaces.
Call to act
One warm LED
Coral signal on primary CTAs only — ink label for contrast.
Color
Palette
Production tokens. Utilities: bg-{token}, text-{token}. WCAG AA for body links and CTA labels.
- #080c12
ink
Night field
- #26292e
ink-elevated
Panels on ink
- #ffffff
paper
Default page
- #f4f7f9
mist
Soft bands
- #e0e6e9
line
Borders
- #15202b
text
Body on light
- #5b6770
muted
Secondary
- #0e7490
accent
Links / nav (AA)
- #22d3ee
accent-bright
On-dark glints
- #ff6b3d
signal
CTA fill
- #e85a2e
signal-press
CTA hover
- #b91c1c
danger
Form errors
On-ink type ramp
text-on-ink — titles, primary
text-on-ink-muted — body on dark (minimum for paragraphs)
text-on-ink-subtle — labels / captions ≥14px
text-on-ink-faint — legal / meta only
Typography
Noto Sans
Clean, bilingual-ready. No neon display fonts. Headings balanced; long-form pretty-wrapped.
Hero / display
China.From the factory floor.
Section
Eight days. Then you brief differently.
Body
Understand China’s next decade through direct access to the people, factories, and ecosystems building it. Operator-led since 2000. Operator story →
Eyebrow
Greater Bay Area · Circuit
Surfaces
Cards, panels, bands
Day carries reading. Night is a set piece. Prefer a mist buffer before mid-page ink.
Panel
Form shell / aside
Same radius family as cards. Use for sticky booking rails.
Panel ink
Elevated night
ink-elevated background for offer cards on dark.
band-ink-buffered
Mid-page night with formation hairline
Softens paper → ink scroll flash. Footer may hard-cut without this.
Forms
Fields & feedback
Accent focus ring. Danger for errors. Required asterisk is decorative — native required carries a11y.
Hint under the label or field.
Example error message.
Do
- Tokens over raw hex
- Paper for reading; ink for set pieces
- Aqua for intelligence; coral LED for action
- One formation glow per viewport
- Brand strings from
consts.ts
Don’t
- Rainbow / multi-LED decoration
- Sitewide forced dark mode
- White type on signal buttons
- Signal-colored body links
- Neon borders on every card
Full technical guide for designers and agents lives in the repo atdocs/brand/style-guide.md· Voice:docs/brand/voice.md· Code:src/styles/global.css