linearity.io/

Linearity

linearity.io/

Linearity is a Design & Creative product. See its linearity.io landing page design in full — desktop and mobile screenshots plus close-ups of the heroes, features, footers, pricing, about us, and 3 more. It's built with Nuxt, Vue and Tailwind CSS. Its type is set in AcidGrotesk, anchored by a #ff4800 palette. Study how Linearity structures its messaging, layout and visual hierarchy, then explore more of the best Design & Creative website designs.

Visit website

Category

Design & Creative

Style

Dark Colorful

Stack

Nuxt Vue Tailwind CSS

Fonts

AcidGroteskInter

Palette

Meta title

Linearity | AI Design Generator: Editable, On-Brand Campaigns

Sections

Updated

Oct 15, 2026

Linearity's landing page, section by section

Each section below is cropped straight from Linearity's live page — useful references for design & creative landing page design.

Linearity design review: how the homepage is built

Linearity's homepage is a 16,384-pixel dark page, captured at 834px wide: a hero with a prompt box, three captioned image fields, a four-step walkthrough, a comparison block, a brand-kit diagram, a use-case carousel, five pricing cards, a question list, a closing prompt box and a footer ending in a full-width wordmark. The ground is near black with blurred orange #ff4800 and amber #ffb714 light and a green swoosh across the middle, with brown #481802 in the glows. AcidGrotesk sets headlines and Inter the small copy. Generated posters, not interface screenshots, fill most of the page.

Above the fold

The header lists "Use cases", "Products", "Business", "Enterprise", "Blog", "Guides", "Learn", "Pricing" and "Company", with "Log in" and "Get started" at right. A rotating sentence, "Let Malik from Marketing create Q4 Event Slides", sits over "On brand. Every time." A wide prompt box with an orange send arrow precedes two pills, "Get started" and "Contact sales". A bottom strip adds "Watch the 60-second demo", four logos and an "App of the Day" badge.

Image fields and the stepper

Three centred captions with green brush underlines read "Prompted in seconds On-brand & Editable.", "Designed in seconds" and "Created in seconds", labelled "REAL OUTPUTS", "EDITABLE GRAPHICS" and "BRAND ASSETS". Posters and ad layouts scatter around each, several cropped by the page edge. A "HOW IT WORKS" block then repeats "Describe it. Tweak it. Use it everywhere." beside a dark editor frame with a blue "Explosive Design" card.

Comparison, brand kit and use cases

"They build image generators. We built a design engine." pairs a flat dark poster with an orange editable version beside a layers panel. "Everyone creates. Brand stays in control." links four chips, "Marketing", "Sales", "Regional" and "HR", to a "Brand Kit" card, then "More campaigns. Same team." sets a red-orange dot grid against a green one. "One brand. Every asset" cycles five rows while the poster stack changes.

Pricing, questions and footer

Under "Pay for speed. Keep the control.", five pricing cards run "Free", "Pro", "Studio", "Business" and "Enterprise", at $0, $10, $30, $80 and "Custom"; "Business" carries a "POPULAR" mark and an orange button. An eleven-question list opens with "How is Linearity different from AI image generators?". "One prompt, every marketing asset." repeats the prompt box, and ten footer columns lead to a giant wordmark.

On mobile

At 390px the capture is 12,774 pixels tall. The rotating hero sentence breaks into three short lines, the prompt box fills the width and the two pills sit side by side. The poster fields lose most of their images, leaving centred captions. The walkthrough shows one frame and a dot pager, pricing becomes a swipe carousel showing the "Studio" card, and footer columns collapse into rows with plus signs.

Worth borrowing

A hero line that rotates a name, a team and a deliverable shows personalization in motion before any copy explains it.
Repeating the "Get started" and "Contact sales" pair under every heading keeps a conversion path visible through a very long scroll.
Setting a flat poster against its editable twin turns a competitor comparison into a picture.