# fancy.design

Source: https://fancy.design/
Captured: 2026-09-20
Tags: agency, landing, dark, both, dark-techno, maximalist, playful, energetic, confident, futuristic, playful
Colors: #ddc4dd, #030303, #b399d7, #faf4f6, #17bef2, #53b3f6, #7f39b2, #707070
Type (h1): Sherika · 90px/81px · 500 — "Design Subscription for Business"
Type (h2): Sherika · 90px/90px · 500 — "Let's start right now — it's incredibly simple!"
Type (h3): Sherika · 67.5px/67.5px · 500 — "Start Subscription"
Type (button): Sherika · 18px/21.6px · 500 — "Book a call"
Button: "Book a call" — fill #ffffff, text #000000, radius 100px, border 0px, padding 0px 0px, height 68px, type 18px/500
Radii: 50% (10), 100px (7), 30px (6), 20px (4)

## Images

- Hero (desktop): https://media.lvly.design/library/fancy-design/hero.webp?v=b11a38b3
- Page crop (mid-1): https://media.lvly.design/library/fancy-design/mid-1.webp?v=c2ec7f8f
- Page crop (mid-2): https://media.lvly.design/library/fancy-design/mid-2.webp?v=580bba33
- Hero (mobile): https://media.lvly.design/library/fancy-design/mobile-hero.webp?v=a6e4a1eb
- Full page (desktop): https://media.lvly.design/library/fancy-design/full.jpg?v=05dd948c
- Full page (mobile): https://media.lvly.design/library/fancy-design/mobile-full.jpg?v=b2bc0a29
- Clip preview (mp4): https://media.lvly.design/library/fancy-design/video-ok1521.preview.mp4?v=d8b2846f

A near-black page (#000000) that spends its whole budget on rendered 3D objects — a glass cube on a lilac-to-cyan gradient in the hero, a chrome rocket, a foil packet, a wall of glossy magenta and violet blobs in the footer — and then sets plain white Sherika on top of it with almost no chrome in between. The hero is the thesis: a full-bleed iridescent render with a hard-edged solid black card dropped over its right half, 90px/81px headline inside, and a white award strip welded to the card's bottom edge so the trust logos read as part of the same object. Everything below is black canvas with one bright thing on it at a time — a rotated fan of saturated purple, pink and blue benefit cards, a glow-lit priorities section where the right column cycles words while the left title holds, a quadrant of thumbnail nav cards. Radii are pills and circles (100px, 50%) with 30px/20px on the cards, buttons are 68px tall solid white with black labels, and a hot pink pill floats fixed above the fold line the entire way down. It works because the contrast is structural rather than tonal: every piece of type sits on either pure black or pure white, so the renders can be as loud as they like without ever fighting a word.

## Steal-worthy details

- Hero headline lives in a solid black card laid over the render rather than in a scrim — hard right-aligned edges, no blur, no gradient, so the photograph keeps full saturation and the type keeps full contrast
- The award strip is a white sub-panel welded to the black card's bottom edge, sharing its left and right edges — monochrome logos separated by hairline vertical rules, so social proof reads as one object with the headline instead of a band floating under it
- Display type is 90px at 81px line-height (0.9) in a 500 weight — the sub-one leading is what makes a three-line headline read as a block; body stays 16px/normal at 400 in the same family, so the whole page is one typeface doing two jobs
- One radius system, all round: 100px pills on every button, 50% circles on the language chip and arrow buttons, 30px and 20px on cards — nothing on the page has a square corner, which is what keeps loud 3D imagery feeling friendly
- Paired CTAs invert each other: the primary is a solid white pill with black 18px/500 text at 68px tall, the secondary the same pill in page-black with a 1px light hairline — same geometry, opposite fill, zero size difference
- Benefit cards are dealt as a rotated overlapping fan — each tilted a few degrees off axis, each a different saturated flat color (violet, pink, cyan), 30px radius, running past both page edges so the row reads as a deck being scrolled rather than a grid
- Section title stays fixed while the value beside it cycles — "Our priorities" holds on the left and the right column swaps Speed, Creativity, Reasonableness, with the outgoing word still ghosted at low opacity mid-transition so the change is legible instead of a flicker
- The footer replaces a link list with four labeled nav cards, each carrying its own product render and a circular arrow button, laid out as a 2x2 quadrant — the last screen sells the same way the first one does

## Style recipe

Build on pure black `#000000` and let rendered 3D objects, not surfaces, supply every color. Type: one geometric sans (Sherika, or Poppins/Outfit as a substitute) for everything. Display 88–92px, weight 500, line-height 0.9, normal tracking, pure `#ffffff`; secondary display 64–68px at 1.0; body 16px/400 at normal leading in white or white at 60%. Never letterspace, never go above 500 weight — the size does the shouting.

Color roles: ground `#000000`; ink `#ffffff`; one violet-to-magenta brand family (`#7f39b2` deep, `#b399d7` light, plus a hot magenta for the persistent CTA) and one cyan (`#17bef2`) used only inside imagery, glows and card fills, never on text; a pale lilac `#ddc4dd` reserved for full-bleed gradient backgrounds behind hero-scale renders. Type is only ever pure white on black or pure black on white — if a color would end up behind words, put the words on a solid panel instead.

Panels over scrims: to place a headline on an image, drop an opaque `#000` rectangle with square corners on top of it and set the type inside at 48–64px of padding, then weld a white sub-panel (badges, logos, proof) to its bottom edge sharing the same left and right. Never dim, blur or `backdrop-filter` the image.

Radii and controls: 100px on every button, 50% on chips and icon buttons, 30px on large cards, 20px on small ones — no square corners anywhere. Primary button = solid `#ffffff`, black label, 18px/500, 68px tall, 28–32px of horizontal padding. Secondary = identical geometry, ground-black fill, 1px white-at-15% border. A tertiary accent pill in the brand magenta with one word of the label in yellow can float fixed near the bottom center for the whole scroll; it is the only persistent chrome.

Rhythm: one idea per viewport, sections 700–900px tall, generous vertical air, content on a 1440 frame with ~40px gutters. Cards may run past both edges. Deal repeating cards as a rotated fan — 2–6 degrees of alternating tilt, 60–80% overlap, each a different flat saturated fill — rather than an even grid. Borders are rare; separation comes from fill and from black space. Shadows are effectively invisible on black, so use a radial color glow (a blurred 600–900px ellipse of brand violet or red at 20–35% opacity) behind a section instead.

Motion: pin a section title and cycle the value beside it, cross-fading the outgoing word at low opacity so both are briefly readable; fade and rise elements 16–24px on entry; keep a fixed award/badge ribbon on one screen edge. The two moves that make it recognizable are the opaque black panel laid over an untouched render, and the all-pill radius system carrying loud, glossy 3D imagery.