Retool

Item: Retool
Rating: 7.4

Platform for building secure internal apps and AI agents.

7.4/10MABTU rating

DESKTOP · 1440 × 9,713/ ↗

MOBILE · 390

Section outline · Home

01heroGradient photo panel with centred prompt box, starter chips, watch-film pill1,040
02logosTwo-row customer logo grid
03galleryRow of dark and light dashboard thumbnails, view gallery button628
04featuresPinned left headline, scrolling grey product panels right4,076
05case studiesThree value columns, logo row, hairline grid of stats and portraits496
06ctaPrompt box over glass 3D render and CGI hand887
07blogLarge feature post plus two small posts with 3D art720
08footerFive link columns and giant Retool wordmark942

Rating · Home

Visual design7.8

UX & clarity7.3

Originality7.2

Craft & consistency7.3

Motion7.0

Performance & a11y7.7

This page scores 7.4; the site score weights the home page double.

Main colours

Light & dark toggle·black background·mono

Typography

Saans Fontheading · sans · self-hosted Saans Fontbody · sans · self-hosted PX Grotesk Fontaccent · sans · self-hosted

Stack & style

Next.js React Sanity Tailwind CSS

Minimal Corporate / clean 3D Rounded / soft Swiss grid Dark tech Product-UI-led Custom cursor Hero video Logo cloud Pinned sections Sticky header Transparent header

Also: Meta Pixel, HubSpot, Hotjar, Vercel, Google Analytics, Google Tag Manager

Design DNA

Near-black canvas with a light-weight grotesk for every headline and tiny grey body copy. The hero is a blurred warm-to-blue gradient photo panel holding a cream prompt box with starter chips, followed by a two-row logo grid and a strip of dashboard thumbnails. A pinned feature band keeps a short headline on the left while grey product panels scroll on the right. A hairline-ruled case-study grid mixes stats with two portrait photos, then a glass 3D shape and CGI hand frame a repeat prompt box, a blog row and a footer closed by an oversized wordmark.

Worth borrowing

Put the product's own prompt box, with starter chips, in the hero instead of a screenshot.
Build the proof section as a hairline grid mixing big metric cells with two tall portrait photos.
End the footer with a wordmark scaled to the full content width.