tryalcove.com

Alcovesaved 6h ago · captured 6h ago

Ten details, nine pinned.

View as Markdown ↗

Colors8 colors · ground #FEF0DF

ground#fef0df·63.76%accent#42227f·17.49%#4931ae·5.76%#322e2c·2.04%#ae9db3·1.68%#d1c2b4·1.42%#2f155d·1.24%#5b534e·1.20%

Sized by coverage · click to copy.

Typography1 family · 3 styles · system-ui

Dynamic Island. Now for your Mac

system-ui · 96/96 · 700 · -2.4px

Fluid transitions

system-ui · 30/36 · 700 · -0.4px

Small

Emagination (B - Side)

system-ui · 12/16 · 600 · normal

Specimens are the page's own words at their measured metrics; shown in Inter when the family is not loaded.

ButtonsFAQs1 style

FAQs

primary · fill — · label #292524 · radius 16px · border 0px · padding 16px 20px · height 60px · type 18px / 700

Shape3 radii · 14 uses

16px7 uses · 50%

12px6 uses · 43%

8px1 use · 7%

AnalysisA short single-scroll landing for a Mac utility that leans on Apple's own vocabulary and then warms it up.

A short single-scroll landing for a Mac utility that leans on Apple's own vocabulary and then warms it up. The whole page sits on a peach-cream ground (#fef0df) with warm near-black ink (#322e2c / #292524). Type is plain system-ui throughout: a 96px/700 headline at -2.4px tracking and line-height 1.0. All the color is concentrated in one big rounded demo panel, a deep violet macOS lock screen (#42227f to #4931ae), which works as a live, interactive product preview rather than a screenshot. Everything around it stays quiet. The personality comes from two hand-marked touches: a pink highlighter bar behind "Mac" and a lavender pen loop around "native app". Both make a stock SF-style page feel made by a person. The page closes with an oversized ghost wordmark bleeding off the bottom edge.

Style recipeBuild on a warm peach-cream ground (#fef0df) with warm near-black ink (#292524 for UI, #322e2c for display) and a muted warm gray (#5b534e, #d1c2b4 for hairlines and tints).

Build on a warm peach-cream ground (#fef0df) with warm near-black ink (#292524 for UI, #322e2c for display) and a muted warm gray (#5b534e, #d1c2b4 for hairlines and tints). Use the system UI stack (system-ui, -apple-system) only. Display at 96px/700, line-height 1.0, tracking -2.4px. Section heads at 30px/700, -0.4px. Labels at 18px/700. Captions at 12px/600 in warm gray. Body at 16/24. Keep the chrome neutral and put all saturation in one place: a large rounded media panel (32px radius) in a deep violet gradient (#42227f to #4931ae, with magenta glows). Ideally make it a live or interactive product preview with a small "it's interactive" caption under it. Primary buttons are #292524 fills with white 18px/700 text, 16px radius, 16px 20px padding, a leading glyph and a soft warm drop shadow. Secondary buttons are borderless tinted ghosts (a cream about 4% darker than the ground) at the same radius, and they can carry a dark inset chip for a price or count. The radius scale is 16 / 12 / 8, plus 32 on hero media. Add human marks sparingly, at most two per page: a flat low-set pink highlighter bar (#ffa8b4) behind one headline word, and a hand-drawn lavender ellipse around one phrase. Feature lists are cardless: chunky 2px-stroke icons over two-line bold centered labels in a 4-column grid. End with an oversized, low-contrast, cropped wordmark. The header is chromeless at rest and gains a frosted cream blur and soft shadow on scroll. If violet feels too heavy for a different product, the pink highlighter can carry the accent role instead.

Details10 worth noting

tryalcove.com — the captured page — Landing, 1440 × 900 · captured Oct 9, 2026

1Low-set highlighter bar behind key word
Highlighter swipe behind the headline's key word: a flat pink (#ffa8b4) rectangle set low behind "Mac", covering only the lower half of the x-height so the glyphs sit on top like a marker stroke. No skew and no rounding, which keeps it deliberately crude
2Inline logo glyph as a headline word
Inline brand glyph inside the headline: the Apple logo set at cap height as a word in the sentence ("Now for your [apple] Mac"), weighted to match the 700 type
3Superscript version pill on wordmark
A version chip on the wordmark: a tiny superscript "v1.7" pill (≈10px, 1px warm-gray border, 6px radius) floating at the logotype's top-right. It quietly signals that the product is alive and shipping
4Price chip nested in secondary button
Price inside the secondary button: "Purchase" carries a dark inset chip ($14.99, white on #292524, 6px radius), so the ghost button states the cost before the click
5Floating dark key-cap CTA
A dark primary CTA with a soft, warm, long drop shadow (≈0 16px 32px rgba(50,46,44,.25)), so it reads as a physical key sitting on paper, paired with a borderless tinted ghost twin
6Live interactive demo as hero media
The product demo is the hero image. A 32px-radius full-width panel renders an interactive macOS lock screen with a real Dynamic Island pill and the current date and time, captioned below by a tiny gray "Psst… it's interactive!" with a cursor glyph
7Hand-drawn pen loop annotation
A hand-drawn lavender ellipse loops around "native app" in the feature grid. One annotation like this, used once, carries more voice than any illustration
8Cardless icon-and-label feature grid
Icon-over-label feature grid with no cards, borders or descriptions: 4×2 chunky 2px-stroke glyphs above two-line 26px/700 centered labels. Each feature gets a name and nothing else
9Cropped ghost wordmark footer
A giant ghost wordmark at the foot: "Alcove" at roughly 250px, a barely darker cream than the ground, fading out and cropped by the page bottom
10Header frosts only after scroll
On scroll the header picks up a frosted cream backdrop blur and a soft bottom shadow. At the top it is fully chromeless

saas · landing · light · minimal, playful · warm, friendly, playful, confident

trysundrop.app1

tryanim8.com0

sohna.dev0

sohna.dev/waterlemon0

tryklack.com1

superscale.ai1

tryalcove.com

More like this