mymind.com

A private-notes app sold like a literary object. The hero is a huge white disc punched out of a blurred peach-to-coral aura (#fedac5 → #feb194 → #fe8c67, with a yellow #ffc671 bleed at the lower left), and inside it a 140px high-contrast book serif with -8.4px tracking sets the promise in two centered lines. Everything else stays quiet: Inter at 20px with an airy 44px line height, gray ghost pills, an off-white #fbfafb canvas, and product UI shown as soft gray-blue cards with 16px corners. Color is rationed into tiny signals (colored nav dots, outlined content-type chips) until one full-bleed saturated orange band breaks the calm halfway down. Lower down, a two-column bento of feature cards in pale tinted fills, a floating pill nav that detaches on scroll, and furniture photography scattered like a moodboard keep it feeling like a curated private collection rather than software.

Build a calm, literary light UI on an off-white canvas (#fbfafb), with ink #343233 and secondary text #6d6f74; reserve pure white for cards and the hero disc. Headlines use a high-contrast book serif (a Garamond or Canela-like face) at regular weight, huge (120–140px desktop), centered, with tracking at -0.06em and line height around 0.85 so the lines nearly touch. Section headlines use the same serif at 56–64px; use an italic condensed serif for placeholder and quote moments. Body and UI text is Inter at regular 400, 18–20px, -0.02em tracking, with a generous 2.2 line height for lead copy. Color: a warm peach-to-coral family (#fedac5, #feb194, #fe8c67, a #ffc671 yellow touch) used as heavily blurred auras (filter: blur(80–120px)) behind white shapes, never as flat fills, except for one full-bleed saturated orange section (about #fe5a1f, which is also the Sign up fill) that carries the core claim. Ration other hues into tiny signals: 5px colored dots before nav links, and 1px outlined pills whose border and text share one hue. Shapes: pills at 100px radius for every button and chip, cards at 16px, small inner surfaces at 12px. Primary CTA is a solid orange pill with white text; secondary actions are borderless light-gray (#f0f1f3-ish) pills with gray #748297 text in a rounded sans, 10px 24px padding, about 50px tall. Feature cards sit in a two-column bento with pale tinted fills (blue-gray, sage, blush), 48px inner padding, a softly blurred product vignette on top, a 40px sans heading and gray body text below. The header floats as an inset white pill with a wide, low-opacity shadow. Use real objects and photography as collage, slightly overlapping, never stock illustration. Keep motion slow and soft.