We Analysed 355 SaaS Websites: Stacks, Colours, Fonts and Sections

Almost every article about SaaS web design is an opinion with screenshots attached. This one is a count.

We capture and tag every site in this catalog ourselves — full-page desktop, mobile at 390px, individual sections, plus an extracted colour palette, detected typefaces and a detected tech stack. That produces something the usual inspiration listicle cannot: a dataset. Below is what 355 real SaaS websites actually look like when you stop curating and start counting.

Methodology, and what these numbers are not

Read this part before quoting any figure.

The sample. 355 SaaS websites with a complete desktop capture, collected over roughly a year. Every site has a screenshot; 354 have an extracted palette; 355 have at least one detected typeface; 332 have at least one detected tech stack.

It is not a random sample. These sites were selected for a design catalog. They skew toward well-designed, mostly English-language, mostly venture-backed B2B software companies. A random sample of all SaaS companies would contain far more WordPress, far more template themes, and far worse typography. Every number here describes this catalog, and that is how each is phrased.

Detection is automated and imperfect. Stacks are inferred from build artefacts and markup signatures, fonts from computed styles. Both can miss. 23 sites returned no stack at all — that means undetected, not "hand-written HTML". So every stack count is a floor, not an exact total.

Section counts are a floor too, and this is the biggest caveat. When we report that 137 sites have a pricing page, that means our pipeline identified and captured one. A site whose pricing lives behind a "Contact us" form, or whose FAQ is a set of scattered accordions rather than a discrete block, will not be counted. Read these as "sites with an identifiable, capturable section of this type", never as "sites that have this content".

Colour is measured mechanically. We extract a palette from the rendered page and treat the first swatch as the dominant colour, then classify it by hue and luminance. This measures pixels, not brand guidelines. A site with a huge photographic hero may register the photo's colour rather than its logo's.

With that said.

Tech stack: two libraries, one default

The headline finding is not that Next.js and Tailwind lead — anyone paying attention could guess that. It is how completely they have merged into a single default: 125 of the 355 sites run both together. That is more than a third of the entire catalog on one specific pairing, and it means roughly three-quarters of Next.js sites in this set are styled with Tailwind.

Most sites use a small stack. The distribution:

Nothing in the catalog registers more than three. The sprawling frontend stack that gets complained about on social media does not show up in marketing sites, which makes sense — these are content pages, not applications.

The genuinely interesting result is the no-code share. Webflow and Framer together account for 98 sites, 28% of the catalog. That is not a long tail; that is roughly one in four of the best-designed SaaS sites we could find, built on a visual tool. Anyone still treating Webflow as a tier below hand-built is working from a stereotype rather than the evidence — Lattice and Jasper, both in our thirty best, are Webflow sites.

Stack splits sharply by category

This is where the averages stop being useful:

Developer tools are the most homogeneous group in the catalog: 50 of 74 on Tailwind, 39 of 74 on Next.js. Infrastructure is close behind at 25 of 30 on Tailwind. These are companies whose own engineers build the marketing site, and they reach for what they already know.

Marketing is the mirror image. Only 7 of 36 marketing-category sites run Next.js, while Webflow (9) and Framer (7) together beat it. Marketing teams buy tools that let marketers ship without a deploy pipeline, which is exactly what you would expect and exactly what the aggregate number hides.

If you want the deeper treatment of what each stack does to a site's look and performance, the tech-stack breakdown goes stack by stack, and each one has its own hub — Next.js, Tailwind CSS, Webflow, Framer.

Colour: SaaS is still blue

We extract a palette from every captured page and classify the dominant swatch by hue. Across the 354 sites with a palette:

Blue leads by more than the next three hues combined. This is the least surprising and most stubbornly true finding in the whole study: after a decade of people declaring SaaS blue dead, more than a third of the best-designed SaaS sites we can find still lead with it.

Two results are counter-intuitive though.

Neutral is the second most common "colour." 59 sites lead with a grey or near-black dominant swatch — more than red, more than green. A meaningful slice of modern SaaS design has no leading brand colour at all in the fold. Attio is the clean example: its extracted palette runs #FEFEFE, #E7E7E8, #C7C7C9, #A7A8A8, four greys, with every trace of colour coming from the product screenshot itself. Polar is even more extreme at #090909, #272728, #787878.

Indigo and violet are rare as a lead. Only 9 sites. Purple feels like the default SaaS accent because a handful of extremely visible companies use it, but as a dominant colour it is one of the least common choices in the catalog. That gap between perception and count is the most useful thing on this page if you are choosing a brand palette.

Light versus dark: not close

Classifying each site's dominant swatch by luminance:

And by our own style tagging, where a site can carry more than one tag:

Both measures say the same thing: light designs outnumber dark ones by roughly two to one. This directly contradicts the impression you get from any design gallery front page, including, honestly, ours — dark sites screenshot beautifully, dominate social feeds, and are what people submit. They are not the norm.

The tag combinations are as informative as the totals. 135 sites are tagged both light and colorful — the single largest cluster in the catalog, and the actual mainstream of SaaS design. Only 42 are both dark and minimal, the Linear-descended look that gets copied most and practised least. Our dark mode teardown covers what the 131 dark sites do differently when they commit.

Dark mode by category

Developer tools (35 of 74) and infrastructure (15 of 30) are the only categories anywhere near an even split. Everything else leans light, and some lean hard: analytics is 11 light to 2 dark.

Note the AI row, because it demolishes a widespread assumption. AI companies in this catalog are twice as likely to be light as dark — 22 versus 11. The "AI product means a dark, gradient-heavy site" idea is a pattern people extrapolated from a few high-profile launches. Measured across 33 AI sites, it is simply false. We dug into how AI and fintech design differ using the same underlying set.

Typography: Inter, and everyone else

Every one of the 355 sites returned at least one detected typeface. Counting each family once per site, including all its cuts and variable versions:

Roughly one site in three uses Inter somewhere. Nothing else is close: Geist, in second, appears on about a third as many sites, and everything after that is in the single-digit percentages.

Two things follow from this.

The long tail is enormous. These eleven families cover only a fraction of the catalog. The remainder is a very long list of custom and licensed faces used by one or two sites each — Family's own "Family", Figma's "figmaSans", Notion's "NotionInter", Linear's Inter Variable cut, plus foundry faces like Söhne, Roobert, Uncut Sans, Bw Gradual and Martina Plantijn. Big SaaS brands commission type; everyone else uses Inter.

Geist's rise is a stack effect, not a taste shift. Geist is Vercel's typeface, shipped with its tooling and easy to adopt on a Next.js project. Its second-place finish is substantially explained by the same 161 Next.js sites in the stack table above — a good reminder that "font popularity" in SaaS often measures developer defaults rather than design decisions.

Against that background, a serif headline is a genuinely loud act. It is why Resend setting "Email for developers" in a high-contrast didone reads as a brand statement rather than a typographic choice.

Sections: what companies actually build

This is our capture coverage across the catalog. Remember the caveat — these are floors, counting sections our pipeline could identify and capture as discrete units.

The top of that table is unremarkable: essentially every site has a hero and a footer. The bottom is where it gets interesting.

Only 137 sites — 39% — have a capturable pricing page. Some genuinely have none, running enterprise sales with a "Contact us" form instead. That is a real and consequential choice: the pricing hub is one of the most visited parts of this catalog, because pricing is where buyers go second and where most sites are weakest. Our teardown of eight real pricing pages covers what the better ones do.

A dedicated testimonial section is the rarest thing here, at 29 sites. Partly measurement — scattered inline quotes are not counted — but partly real. Many companies have replaced the testimonial wall with a logo strip, which is cheaper to maintain and, at 93 sites, three times as common. Whether that is a good trade is the subject of the testimonial teardown; Deel putting a named ElevenLabs quote in half its hero suggests some companies think it is not.

FAQ blocks at 68 sites (19%) are rarer than most SEO advice implies. Among those that build one, the good ones handle objections rather than logistics — the pattern we traced across 68 FAQ sections.

Section coverage by category

Two rows stand out.

AI has zero captured testimonial sections across 33 sites, and only 3 FAQ blocks. Read generously, these are young companies without a deep bench of quotable customers. Read less generously, an entire category is asking for trust while showing less social proof than any other group in the catalog.

Security punches far above its weight on logo clouds — 7 of just 10 sites, the highest rate anywhere. When you are selling security, naming the companies that already trust you does more work than any feature list, and those teams clearly know it.

Finance is the opposite: only 5 of 25 have a capturable pricing page, the lowest rate of any substantial category. Financial products price by negotiation, volume and regulation, and it shows.

What these numbers do not prove

A few honest limits, because a data study that only lists conclusions is just an opinion piece with tables.

Correlation with quality is not established here. Nothing in this dataset says Tailwind sites convert better, or that blue outperforms green. We measured what exists, not what works. Anyone telling you a colour lifts conversion needs an A/B test, not a screenshot count.

The sample is curated, so it lags the mainstream. If anything, this catalog is an optimistic picture of SaaS web design. The real distribution across all SaaS companies has far more WordPress, far more stock illustration, and far more Inter.

Detection floors matter most at the bottom of every table. The rarest things — testimonials at 29, FAQ at 68 — are exactly where our measurement is weakest, because they are the hardest sections to identify programmatically. Treat the top of each table as solid and the tail as directional.

These are a snapshot. Sites are recaptured periodically, and the figures move. Geist did not exist a few years ago and is now second. One site was dropped from a companion piece mid-writing because its capture had gone stale.

What holds up across all of it: SaaS design is more conservative than its galleries suggest. It is mostly light, mostly blue, mostly Inter, and increasingly all built the same way. Which is precisely why the sites that break one of those defaults on purpose — a serif headline, a monochrome palette, an inverted layout — are the ones people remember.

You can browse the underlying set by tech stack, style, category or section, and every site has a page showing its own palette, typefaces and captures.

At a glance