80.lv website design: fonts, colors and UI patterns

3 featured captures from 80.lv, with sourced design evidence from Fudge.

How is 80.lv designed? Show me the visual system I can use as a reference.

Design character

80 Level is a games-art and CG editorial site. The design is media-first journalism: large thumbnails, bold short headlines, and a dark or high-contrast shell that feels closer to a content network than a corporate blog. Energy comes from artwork, not from decorative UI.

What should survive adaptation: - Artwork-led cards as the primary unit - Strong sans headlines at modest display sizes (not billboard 100px marketing) - Dark ambient framing around bright key art - Clear sectioning for news, features, and partner content

Foundations

Color

Structured hex roles were thin. Visual system: - Dark page chrome and nav - White/light headline type on dark modules; dark type on light article surfaces where used - Full-color key art inside cards - Accent likely reserved for links, badges, or live labels rather than large fills

Typography

  • Headlines ~31–32px weight 600, line-height ~42–44px
  • Mid heads 18–20px weight 600
  • Body/UI 14–16px, weights 300–700 depending on emphasis
  • Compact meta 14–15px

Spacing and layout

  • Horizontal page padding ~32–48px; larger vertical section pads ~60–72px
  • Card radii ~16–22px
  • Multi-column editorial grids; featured story may span wider

Visual language

  • Rounded media cards with overlay titles
  • Badge/chip labels on stories
  • Dense but readable magazine packing
  • Minimal illustration in chrome; photography/3D art does the talking

Components and states

  1. Top nav + logo
  2. Featured story hero
  3. Story cards (thumbnail, title, meta)
  4. Section headers for feeds
  5. Newsletter or partner modules

Responsive behavior

Home captured at multiple widths including a short strip. Expect card columns to drop from multi-col to single column; keep thumbnail aspect ratios stable.

Practical guidance

Preserve: art-first cards, bold mid-size heads, dark media framing. Avoid: turning the home into a sparse startup landing page or washing out thumbnails with heavy overlays.

Scope note

Three home captures. Color roles not fully measured; type sizes, radii, spacing, and visual reading inform the system.

Captured pages