Skip to content
BetaFree MCP server

Cntrl

cntrl.site/

Cntrl is a freehand, no-code website builder aimed at designers rather than developers, letting users build animations, custom interactions, and typography visually, with a Next.js/SDK path for those who want code access. Its hero copy is written entirely in stylized capitals with trademark symbols attached to invented terms — "MOVING THINGS WITH YOUR HANDS©, USING YOUR EYES© TO MAKE A JUDGEMENT AND YOUR IMAGINATION© TO LEAD THE WAY" — an unusually performative voice for the category. One feature claim is time-boxed rather than vague: "this hover effect took me 5 min to make from scratch, no code or markup skills required." Pricing is stated plainly (free tier with 3 projects, Pro at $19/month, Studio at $39/month with hosting), and the site includes a section soliciting investors.

Category
Design & Creative
Style
LightColorful
Stack
Next.js
Fonts
MelangeFavorit Mono
Palette
Meta title
Control | Design websites
Sections
2
Updated

Cntrl's landing page, section by section

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

Cntrl design review: how the homepage is built

The desktop page is 7,418px tall and sits on a white ground, turning black from the FAQ down. The two accents are #fde702 yellow and #fcd5bb peach, which appear on tilted sticker labels and on the feature icons, while #e7e7e9 and #b7b7b8 handle the greys. The detected faces are Melange for display and Favorit Mono for body. Its distinctive habit is typographic: the hero line is set in all-caps and then paired with a grey serif word, so the page keeps one split-weight treatment in its section headings across the page.

Above the fold

Above the fold, a white header carries "Login" and a bright green "Sign Up" button. The headline opens "CREATE WEBSITES INTUITIVELY, MOVING THINGS WITH YOUR HANDS©," and continues in the same capitals. Beneath it, "Keep Control" sits on one line with a grey serif "Keep" beside a black sans "Control". A card titled "01—Work Index" sits below, with tilted yellow and peach stickers at the page edges.

Portfolio mock and feature label grid

A portfolio mock with its name set in tall black letters sits under the hero, followed by the line "Freehand webdesign tool for creatives by creatives." Beside a purple card reading "Born in New York City, I'm drawn", twelve monospace labels run in four columns, including "DESIGN YOUR WEBSITE FROM SCRATCH", "CREATE CUSTOM GRIDS AND BREAKPOINTS" and "PROMPT IMAGE EFFECTS AND CUSTOM INTERACTIONS", each marked by a yellow icon.

Preview cards, shaders and component library

Three preview cards headed "Animate. Instantly. With Ease." and "Unleash your inner graphic designer and make your typography stand out." sit over the previews "Luca Bianchi", "Charlotte Moor" and "EASY KERNING IN CONTROL". A split row pairs a photograph with "Add new layer to your visual game." and "Meet Shaders." above a green "TRY NOW →" button. "Comes with a library of customizable components." then heads a row of colour tiles.

Closing section and footer

The lower page turns black. "Yes, we've got templates, and they are beautiful." sits over a dimmed template mosaic with a "BROWSE →" button, followed by nine "Frequently Asked Questions" items, among them "Is Control free?" Monospace help headings include ">HIRE A PRO". The page closes on "Make Your Website Happen" with a "START NOW" button and a footer with "PRIVACY POLICY".

On mobile

At 390px the header keeps "Tutorials" and "Templates" in a row above the headline, and the monospace feature labels become a single column of twelve lines. The three preview cards turn into stacked image-and-text pairs, the nine FAQ questions become a full-width accordion, and the footer stacks into one column. The purple portfolio card keeps its full width, and the closing "START NOW" button sits left-aligned under the headline.

Worth borrowing

  • Split one headline across two typefaces and weights, as the "Keep Control" line does, to carry the brand without an image.
  • Give each feature a small icon and a monospace caption so twelve capabilities read as one indexed grid.
  • End a dark section on a bold call to action, such as "Make Your Website Happen" over "START NOW".
Pexo landing page design
Pexo
Design & Creativepexo.ai/
Figma landing page design
Figma
Design & Creativefigma.com/
Gamma landing page design
Gamma
Design & Creativegamma.app/
Runway landing page design
Runway
Design & Creativerunway.com/
Modeinspect landing page design
Modeinspect
Design & Creativemodeinspect.com/
Onuniverse landing page design
Onuniverse
Design & Creativeonuniverse.com/