MUUDS

ZapConnect 2026

Evocative and visionary tech editorial. Graphic novel-style sci-fi cityscape illustrations and warm retro sunset tones contrast against crisp cream paper-like content panels. Elegant, high-contrast serif headlines lend the conference gravitas while signature electric orange accents keep the energy urgent.

dreamyluxuriouswhimsicalplayfulsereneenergeticreassuring
Visit site

Rated

7.3/ 10

From 10 analysed sections. Two measured components and one judged by a model. Distinction is a rank within the library; the rest are scores in their own right.

AI scorejudged
9.2
Systemmeasured
4.3
Distinctionmeasured
10.0
on the grid
36%
vertical rhythm
63%
type on a scale
33%
contrast passing AA
40%
unlike the library
1.33
model craft
7.8/10
model deviation
4.3/10

Colour

Background#f8f4f0
Text#201515
Accent#ff4f00
Surface#201515
Muted#36342e

Typefaces

Display
Tiempos Headline Light
Body
Inter
Mono
—
Source
google
Scale
12 · 14 · 16 · 17 · 18 · 20

Layout

Grid
24 columns
Container
1280px
Spacing base
4px
Radius
4px

Capture

Category
saas
Sections
10
Captured
2026-09-06
Rhythm
dark x2 → cream x3 → dark → cream x2

Type rules

  • display headlines set in sentence-case serif with tight unit leading
  • body text runs in clean grotesque at an 80-character measure
  • eyebrow labels and ticker text in uppercase sans-serif separated by solid orange square marks

Colour rules

  • brand orange #ff4f00 is strictly reserved for primary CTA buttons, ticker markers, and pivotal graphic accents
  • editorial sections sit on warm cream #f8f4f0, while the hero and key announcements use rich illustrated dark grounds

Voice rules

  • lead hero headlines with a three-word alliterative or thematic triad
  • pair visionary transformation claims with concrete tactical event takeaways

Holds it together

  • use full-bleed retro-futuristic city illustrations to frame the narrative arc at the top and key milestones
  • anchor major section transitions with centered orange square dot glyphs
  • enclose speaker cards and speaker portraits in consistent hairline rectangular frames over cream surfaces

Contrast

text on background16.3:1 AAA
muted text on background11.4:1 AAA
muted text on surface1.4:1 fail
accent on background3.0:1 AA Large
background on accent3.0:1 AA Large

Type, measured

Body
20px / 1.2
Measure
80 characters
Display
148px / 1
Tracking
0em display
Scale ratio
1.65

Voice

Tone
forward-looking, authoritative, action-oriented
Sentences
medium
Person
second
Vocabulary
technical
Calls to action
register, save, meet, explore, submit

Built with

Builder
framer
Framework
—
Motion
lenis
WebGL
—
Nav
top_bar, 5 items
Length
14.9 screens

Sections in page order

Rhythm — each block is a section, as wide as it is tall, in the colour it is on

  1. 00

    hero

    Strong

    An illustrated sunset cityscape floating in clouds gives this virtual event hero an atmospheric, retro-futuristic, and visionary feel.

    Mood
    dreamy + nostalgic
    Layout
    1 col · full bleed · airy
    Open section
    An illustrated sunset cityscape floating in clouds gives this virtual event hero an atmospheric, retro-futuristic, and visionary feel.
  2. 01

    hero

    Quiet, text-focused editorial announcement hero bathed in deep warm black with refined serif typography.

    Mood
    luxurious + contemplative
    Layout
    1 col · centered · airy
    Open section
    Quiet, text-focused editorial announcement hero bathed in deep warm black with refined serif typography.
  3. 02

    cta

    Strong

    A clean registration card floats at the center of an intricate, retro-futuristic cityscape illustration.

    Mood
    whimsical + nostalgic
    Layout
    1 col · centered · balanced
    Open section
    A clean registration card floats at the center of an intricate, retro-futuristic cityscape illustration.
  4. 03

    statement

    Strong

    A warm, glowing radial aura cradles floating brand badges and elegant serif typography in a calm, ambient composition.

    Mood
    dreamy + serene
    Layout
    1 col · centered · airy
    Open section
    A warm, glowing radial aura cradles floating brand badges and elegant serif typography in a calm, ambient composition.
  5. 04

    team

    Refined editorial speaker directory pairing realistic portrait cutouts against whimsical illustrated cityscapes on a warm cream canvas.

    Mood
    playful + reassuring
    Layout
    3 col · grid · balanced
    Open section
    Refined editorial speaker directory pairing realistic portrait cutouts against whimsical illustrated cityscapes on a warm cream canvas.
  6. 05

    feature grid

    Refined editorial event section combining delicate serif headlines, hairline column rules, and lush atmospheric city illustrations.

    Mood
    serene + contemplative
    Layout
    3 col · stacked · airy
    Open section
    Refined editorial event section combining delicate serif headlines, hairline column rules, and lush atmospheric city illustrations.
  7. 06

    announcement

    Dramatic event announcement pairing high-contrast editorial serif typography on a dark background with an intense orange video preview card.

    Mood
    energetic + mysterious
    Layout
    1 col · stacked · balanced
    Open section
    Dramatic event announcement pairing high-contrast editorial serif typography on a dark background with an intense orange video preview card.
  8. 07

    cta

    Quiet, generous cream-toned call to action anchored by an oversized event logotype and refined editorial serif typography.

    Mood
    serene + luxurious
    Layout
    1 col · centered · airy
    Open section
    Quiet, generous cream-toned call to action anchored by an oversized event logotype and refined editorial serif typography.
  9. 08

    faq

    A quiet, editorial accordion FAQ with refined serif titling and delicate hairline dividers over a warm cream canvas.

    Mood
    serene + reassuring
    Layout
    1 col · stacked · balanced
    Open section
    A quiet, editorial accordion FAQ with refined serif titling and delicate hairline dividers over a warm cream canvas.
  10. 09

    footer

    An airy, warm-neutral footer arranging social channels, navigation links, and legal copy across two balanced horizontal tiers.

    Mood
    reassuring + serene
    Layout
    2 col · split · airy
    Open section
    An airy, warm-neutral footer arranging social channels, navigation links, and legal copy across two balanced horizontal tiers.

More like this

By shared mood