modal.com/

Modal

modal.com/

Modal is cloud infrastructure for running AI inference, training, batch jobs, and sandboxed code, pitched as staying "in Python, ship to the cloud" without managing servers. The homepage leads with specific hardware and latency figures rather than general cloud-speak: autoscaling from 0 to 1,000+ GPUs, sub-10ms overhead latency for online inference, and access to up to 128 B200 GPUs over 3,200 Gbps InfiniBand networking. Case studies attach named companies to concrete results — a 65% latency reduction for Decagon, a 4-month-faster launch for Suno, a 3x latency decrease for Reducto — and new signups get $30 a month in free compute rather than a generic free trial.

Visit website

Category

Engineering & Infrastructure

Style

Dark Colorful

Stack

Svelte Tailwind CSS

Fonts

GogaInter Variable

Palette

Meta title

Modal: High-performance AI infrastructure

Sections

Updated

Oct 10, 2026

Modal's landing page, section by section

Each section below is cropped straight from Modal's live page — useful references for engineering & infrastructure landing page design.

Modal design review: how the homepage is built

The homepage is 8,754 pixels tall at 1440px and is mostly black. From the top it runs a green announcement bar, a floating pill nav, a text-only hero, two rows of drifting logos, a 2x2 feature grid, one pale green panel, two accordion sections, a mosaic of customer cards, a tabbed example carousel, a closing call to action and a footer. Colour is built on the green ramp "#7fee64", "#62b84d", "#488739" and "#37672b" against "#000000". Headlines use Goga and body text uses Inter Variable. Glowing cubes and code windows recur.

Above the fold

A lime bar reads "Runtime, the conference for engineers running AI in production." with an "Apply now" link. Beneath it, a rounded dark nav holds the logo, five links, "Log In" and a green "Sign Up" pill with an arrow. The centred headline, "AI infrastructure that developers love", is green for its first three words. A subhead and two buttons, "Get Started" and "Contact Us", sit above two scrolling logo rows including "Suno", "Meta" and "Lovable".

Feature grid and workloads

"The production cloud for AI." introduces four equal cards, each with a code or chart window on a green glow, a small caps label and a title such as "Autoscale from 0 to 1000+ GPUs, instantly." A pale green panel, "Build full-scale AI systems.", then shows three isometric icon tiles for "Inference", "Training" and "Sandboxes", and a second block, "Engineered for inference.", lists four capabilities with small icons.

Infrastructure, security and customers

"Global GPU infrastructure" pairs a dotted globe with four collapsed accordion rows marked "+", and "Security and governance" mirrors it with a glass-and-green cube and four more rows. "Empowering teams of all sizes to ship at scale" opens a mosaic of eight customer cards in uneven widths. Some use gradient fills with metrics such as "65%" and "4 months", while others are dark with quotes or play icons.

Closing section and footer

"Built with Modal" offers five filter chips, from "Audio Transcription" to "Image and Video Inference", over a horizontally scrolling row of image cards with titles like "Deploy OpenCode agents". The closing block pairs a glowing cube with "Ship your first app in minutes.", a "Get Started" button and the note "$30 / month free compute". The footer shows the logo, a green tagline, five social icons and four link columns.

On mobile

At 390px the page lengthens to 11,941 pixels. The nav collapses to a hamburger, the glowing cube appears beneath the hero buttons, and the logo rows shrink to two lines. Feature cards, workload tiles and customer cards all stack in one column, and the gradient customer cards turn uniformly dark. Accordions keep their "+" markers, the closing block centres its text, and the footer becomes a centred brand block above two-column links.

Worth borrowing

Colouring only the first half of the headline in green sets the brand accent without adding a second typeface or weight.
Dropping one pale green panel into an all-black page marks the workloads section as a distinct zone.
Mixing metric cards, quote cards and play-icon cards in one uneven mosaic keeps a long customer list scannable.