01
GSAPBrand canonv3.html ↗
Visual canon.
Tokens, fonty, baza.
Wszystko czego trzymamy się przy migracji screen-by-screen. Jeśli tu coś nie pasuje, przed dotknięciem kolejnego ekranu - wracamy.
Aventura · editorial cinematwo becoming oneitalic = emphasisedge-to-edge layoutsentence case always
PaletaAventura · editorial cinema
Paleta
Brand chrome
Primary surfaces & text
--color-navy#14151d
--color-navy-2#1a1b25
--color-light#eae8e8
--color-light-2#d6d1d0
--color-light-3#f3f1f0
--color-text#424346
--color-text-muted#6f6968
--color-white#ffffff
Signature accent
Bronze - italic emphasis, key UI moments. NOT yellow.
--color-accent#b38c61
--color-accent-soft#dac8b7
Per-couple accent
Couples wybierają jeden - applied as --color-accent w scope ich event surface.
--color-burgund#6b2737
--color-oliwa#4a4d38
--color-terracotta#c67b5c
--color-honey#e8b23a
TypografiaInstrument Serif · Inter Tight · Fraunces
Typografia
Display XL · Instrument Serif 400 · clamp(72,12vw,156px) · -0.025em
Wasi goście.
Display · 96px / lh 1.05 · Roman + Italic mix
Każdy gość widzi inne wesele.
H1 · 56px / lh 1.06 · sentence case
Cztery kroki, jeden ranek po.
H2 · 32px / lh 1.2
Naszym celem jest
Lead · Inter Tight 400 · 20px / lh 1.5
Plakat z QR kodem na stoły weselne. Goście skanują, robią zdjęcia, wszystko ląduje w jednej galerii - bez aplikacji, bez logowania.
Body · Inter Tight 400 · 15px / lh 1.5
Piękne wesele kosztuje. Galeria - nie. Jedna kwota raz na zawsze, bez subskrypcji, bez ukrytych kosztów, bez aplikacji dla gości. Plakat wysyłamy na adres pary; goście skanują z każdego stołu.
Inter Tight italic display · inline editorial moment
Wesele jest filmem. Wy jesteście reżyserami. Goście - Waszym kadrem.
Eyebrow · Inter Tight 500 · uppercase 0.22em · 11px
Wesele 2026 · cała Polska
Folio · canon: l + bond + r · reveal on view
Cztery krokijeden ranek po
Naszym celemfotografowane przez gości
Jedna kwotabez subskrypcji
Wordmark · Fraunces italic 500 · -0.06em · lowercase
dwojedwojedwojedwoje
VoiceRoman + Italic · italic = emphasis
Italic nosi emfazę.
Wasi goście są Waszym fotografem.
Jedna kwota. Bez subskrypcji.
Naszym celem jest jeden ranek po.
Wesele: szybciej, mądrzej, bez stresu.
Klaps. Pięć minut. Reszta - Wasza.
Brand glyphfilled-infinity · two becoming one
Bond glyph
merged (default) · 24 / 56 / 120 / 220
dot · two-circle favicon variant
single · seed / lifecycle stage 0 (draft)
hover · magnetic separation 25% + scale 1.06 (back.out 1.56) · motion-lab v07
dwojenajedź kursorem ↑
attract · ambient drift loop · 4.6s ping-pong
breath · always-fused alive watermark · 5.6s sine
PhaseGlyph · lifecycle stages (0 draft → 2 live)
0 · draft
1 · published
2 · live
On accent · color: var(--color-accent)
Motion canonGSAP · imperative timelines
Motion canon
Cztery cinematic timelines wraps <Bond> w GSAP - preloader build, orbital convergence, magnetic snap, hero entrance ze stałym breath cycle. Każdy timeline polished w motion-lab 1:1 (BASE_DX 21.25, expo.inOut, back.out(1.8)). Klik Replay żeby zobaczyć ponownie.
02
GSAPOrbital convergence
03
GSAPMagnetic snap
04
GSAPHero entrance
Buttonypill · 4 variants · 3 sizes
Buttony
Primary · navy bg, light text. Hover → accent.
Accent · bronze bg, light text. Hover → navy.
Ghost · transparent + 1px line border. Hover → navy fill.
Light · light bg, navy text. Hover → accent.
Polaunderlined · uppercase label · accent focus
Pola
On darknavy surface · accent on italic
On dark.
Display on dark - italic accent visible
Każdy gość widzi inne wesele.
Wordmark on dark + hover variant
Bond glyph on dark
Buttons on dark - ghost inverts color
Field on dark
Folio on dark
Cztery krokijeden ranek po
Chips on dark
PlakatGaleriaAtrakcjePamiątka
Accent overrideruntime --color-accent · per-couple chrome
Per-couple accent
Klik = ustawia --color-accent na całej stronie /brand. Wszystkie italic emphasis oraz bronze chrome odświeżają się natychmiast - to mechanizm, którym couple personalizują swoje event surface (panel, plakat, guest view, galeria).
Wasi goście są Waszym fotografem.
Jedna kwota. Bez subskrypcji.
Plakat--color-accent: #b38c61