# workos.com/launch-week/summer-2025

Source: https://workos.com/launch-week/summer-2025
Captured: 2026-09-13
Tags: saas, landing, light, both
Colors: #76cff8, #e9f6f8, #afe3f9, #d5d5d0, #b3b2af, #70a4bb, #40bdee, #537395
Type (h2): Instrument Serif · 40px/48px · 400 · tracking 0.4px — "A week of launches from WorkOS"
Type (h3): Times New Roman · 44px/52.8px · 400 — "SwimClub"
Type (body): Times New Roman · 19px/26.6px · 400 — "Take full control of your auth UI with custom CSS. Style elements, customize lay"
Type (small): Ibm Plex Mono · 12px/19.2px · 400 · tracking 0.24px — "background-color"
Type (button): W95FA · 20px/20px · 400 — "Subscribe for updates"
Button (primary): "Subscribe for updates" — fill #a6e3fa, text #0f0f14, radius 4px, border 1px, padding 9px 20px, height 56px, type 20px/400
Radii: 2px (21), 4px (14), 5px (12), 3px (9), 6px (9)

## Images

- Hero (desktop): https://media.lvly.design/library/workos-com-launch-week-summer-2025/hero.webp?v=28999638
- Page crop (mid-1): https://media.lvly.design/library/workos-com-launch-week-summer-2025/mid-1.webp?v=7f40eab5
- Page crop (mid-2): https://media.lvly.design/library/workos-com-launch-week-summer-2025/mid-2.webp?v=78e22591
- Hero (mobile): https://media.lvly.design/library/workos-com-launch-week-summer-2025/mobile-hero.webp?v=8f207587
- Full page (desktop): https://media.lvly.design/library/workos-com-launch-week-summer-2025/full.jpg?v=1ca4d501
- Full page (mobile): https://media.lvly.design/library/workos-com-launch-week-summer-2025/mobile-full.jpg?v=b03f85c6
- Clip preview (mp4): https://media.lvly.design/library/workos-com-launch-week-summer-2025/video-4ezvzo.preview.mp4?v=370c6bbd

A summer launch-week page that trades WorkOS's usual enterprise sobriety for a sky. The hero is a soft, dithered cloudscape in powder blues (#76cff8, #afe3f9) with "Launch Week" rendered as a giant glossy, glass-lettered script floating through it, a lone WorkOS wordmark above and a tiny circular "Scroll" badge below. Every piece of content sits inside a classic-Mac-style window — cream (#fefcf5) paper ground, 1px hairline chrome, a title bar of horizontal pinstripes with a small icon at left, 2–5px radii — and each launch is its own window stamped "Launch 02: 06.24" like a dated postcard. Type is all serif: Instrument Serif at 72px/400 for display, Times-family serif at 19px for body, which gives the pixel art and old-OS UI a literary, unhurried voice. Inside the windows the product demos are dressed as a fictional "SwimClub" app with 8-bit pool and cabana icons, pixel-perfect toggles and a pixel-art palm-tree photo, and the code panels are near-black so they read as a separate layer. The single CTA is a glossy aqua-gel button ("Subscribe for updates" plus an X mark) with a 1px border and 4px radius — the one place gradient shine is allowed. The effect is nostalgic and vacation-bright without being kitsch: a calm summer palette, a disciplined window grammar, and serif restraint holding a lot of playful pixel detail in place.

## Steal-worthy details

- **Dithered cloud sky as a hero ground** — a soft blue gradient with visible halftone dither, so the "photo" feels printed rather than rendered, and the cream page below it reads as paper.
- **Glossy script wordmark as the hero object** — "Launch Week" set in a chrome/glass brush script, tilted, sitting *in* the clouds rather than on top of a heading stack; the real headline is demoted to a side window.
- **Classic-OS window as the universal container** — hairline border, pinstriped title bar with an app icon, dated label ("Launch 02: 06.24"), cream fill. Every launch, the hero card, and the CTA all use the same chrome, so a campaign of six releases reads as one system.
- **Fictional demo app ("SwimClub") in a consistent pixel-art dialect** — 8-bit pool/cabana icons, a "NEW" pill, a rounded search field with a glossy magnifier button, and beveled toggles; the product feature is shown *through* a toy product instead of a screenshot.
- **All-serif type pairing** — Instrument Serif display (72px, 400, slight positive tracking) over a Times-family body at 19px/1.4; no sans anywhere but the logo.
- **One gel button** — the aqua CTA (#a6e3fa on #0f0f14 text) with a vertical shine gradient, 1px border, 4px radius and 56px height, used exactly once so the glossiness stays special.
- **Tiny radii everywhere (2–6px)** — keeps the retro-OS feeling; nothing is pill-shaped except the search field and "Popular" badge inside the fictional app.
- **Near-black code panels** as the only dark surfaces, set against the sky-blue demo canvas so the "developer" layer is legible at a glance.

## Style recipe

- **Palette:** page ground cream #fefcf5; sky blues #76cff8 / #afe3f9 / #e9f6f8 for hero and demo canvases; CTA aqua #a6e3fa; ink #0f0f14; hairlines in warm gray #d5d5d0; one near-black code surface.
- **Type:** display in a high-contrast serif (Instrument Serif or similar) at ~72px/400 with +1% tracking; body in a Times-class serif at 18–19px, line-height ~1.4; no sans except the logo and UI labels inside mock windows.
- **Containers:** 1px hairline windows on cream, 2–6px radii, a pinstriped title bar (repeated 1px horizontal rules) with a 16px icon at left and an optional date label; light drop shadow only on the floating hero window.
- **Hero:** full-bleed dithered gradient sky, a single oversized script or display word set in glass/chrome, small centered logo up top, a round "Scroll ↓" badge at the bottom, the actual copy + CTA in one window pinned bottom-right.
- **Content rhythm:** one window per release, stacked with generous vertical air; each window splits into a cream copy pane (title, 2–3 line description, "Read blog post ↗") and a wide sky-blue demo pane.
- **Illustration:** pixel-art / 8-bit icons and photo treatments, a fictional but coherent demo app, beveled toggles and gel buttons; keep motifs seasonal (pools, palms, cabanas) and consistent across every window.
- **Buttons:** one glossy gradient CTA with 1px border and 4px radius; everything else is plain text links with a ↗ arrow.
- **Avoid:** sans-serif headings, large radii, flat SaaS cards, more than one glossy element per viewport.
