piqo.app

Piqo Analytics is an indie analytics tool wearing a soft, rounded face: Quicksand headings at 600 with a highlighter-style pale lavender pill behind the word "affordable", Marlin Soft body copy in warm gray, and one hard electric blue-violet (#3600ff) doing all the work on a near-white #fbfbfc ground. The page is essentially a stack of hairline-bordered white cards, each holding a real product screenshot in a bordered frame, with a short left-aligned paragraph beside it that bolds two or three phrases as inline headlines instead of using a heading at all. Nothing shouts except the accent: the CTAs, the "Add a website" button and the chart lines all share it, while a neutral secondary button and gray avatar strip keep the hero grounded. A sticky dark lifetime-deal pill floats at the bottom like a toast, the one dark object on an otherwise pale page. The overall feel is a friendly, budget Plausible: approachable rounded type, tight card grid, and a single loud color.

Build a light, rounded SaaS page on a near-white ground (#fbfbfc) with white cards. Headings in Quicksand 600 (or a similarly geometric rounded sans), tracking -0.02em, sizes about 40px for the H1 and 26–28px for section copy; body in a soft humanist sans at 16–17px, line-height 1.65, color #6e6e70 with emphasised phrases stepped up to #1a1a1a at weight 600 rather than adding sub-headings. One accent only: #3600ff for primary buttons, links, chart strokes and small badges; a pale tint #e3dafd for highlight pills behind a single headline word and for chart fills. Secondary buttons are flat #efefef with dark text, same height (38px) and radius (10px) as the primary; primary text is white, 14px, weight 700, padding 9px 18px. Cards use a 1px #dadad6 hairline, 10px radius and no shadow; small controls and inputs use 4–6px radii, status pills 999px with a 6px green dot. Screenshots sit inside cards with their own 1px frame and slight inset. Keep sections as a vertical stack of equal-width cards with generous internal padding and text on the left, image on the right. Allowed dark surface: one floating bottom toast in #111 with white text and the accent button inside it. Avoid gradients, drop shadows and decorative illustration; let the accent and the rounded type carry the personality.