Skip to content
Browse
Library

Swwim. Cobalt wave with floating luxury objects.

  • Studio
  • Light theme
  • 8 colors
  • 2 typefaces

Swwim is a full-bleed, blue-saturated agency site where the hero IS the brand: a massive all-caps Baton Turbo display at 151px sits on a vivid cobalt field, scattered with floating product crops (a diamond ring, a Givenchy sandal, a megaphone) that overlap the letterforms. The rest of the system stays disciplined — white canvas pages, hairline #e5e7eb borders, pill-shaped controls with 9999px radius, Greycliff for everything readable. The color palette is nearly monochromatic: one hero blue (#1658b3) carries the page, with deeper #0d3c88 and darkest #01295f as gradient depth inside decorative graphics, and a single warm #eee1d9 flesh-tone accent peeking through illustration fills. Components are flat, borderless against the blue, and almost borderless against white — elevation comes from typography weight, not shadow stacks.

Visit weswwim.com
Screenshot of Swwim
Captured from weswwim.com on October 11, 2026

Swwim design system

Swwim

Brand4

  • Hero background, primary surface flood, outlined-link borders — the single color that defines every full-bleed section

  • Darker blue for gradient depth in decorative graphics, icon accents, footer bands

  • Violet wash for highlight backgrounds, decorative bands, and soft emphasis behind content. Do not promote it to the primary CTA color

  • Darkest blue used inside SVG decoration and deep gradient stops — never as text or button

Neutrals4

  • Body text on white, icon fills in black-mode illustrations

  • Warm flesh-tone accent inside decorative illustration fills and strokes — the only chromatic neutral, used to humanize blue compositions

  • Hairline dividers, card borders, separator rules across all white surfaces — the structural neutral of the system

  • Page background, body text on blue, primary pill button fill — the neutral that carries white sections and inverts on blue

Try a pairing

Pick any two colors from the palette to check whether text stays readable on top.

Aa

White Canvas on Cobalt Current

6.82 : 1 contrast

Background
Text
  • Body textPasses AA 4.5
  • Large textPasses AA 3
  • StrictFails AAA 7

More DESIGN.md files. Same web, different personalities.