Inside the Guise website design
Guise is a creative website built with custom code, Next.js, and Three.js. Its pages are built from navbar, hero, gallery, features, dashboard, pricing, FAQ, and footer sections, shown here in full-page captures and a scroll recording. Typography: Scoutie Sans (headings) and Inter (body text). Colours: background #000000, text #FCF7E9, main buttons #087DF5, surface #292929.
Present Figma prototypes, websites, and screenshots in realistic macOS windows. Guise makes product demos and visual feedback clearer. Download Guise for Mac. Its visual style is minimal, editorial, and corporate, with navigation bar, split hero, and feature card among its components.
Why we picked it
A black canvas lets the actual product screenshots do the talking, with real macOS window chrome and app icons giving the mockups instant credibility. Large white headline type up top fades into generous dark space before each feature, pacing the long page into clear, scannable chapters.
What to look for
- Navbar: a short menu: only the destinations visitors actually look for
- Hero: a specific headline instead of a generic slogan
- Gallery: minimal interface around the images
- Features: benefits framed around what the user gets, not internal capability names
Questions designers ask
What fonts does Guise use?
Guise uses Scoutie Sans for headings, and Inter for body text, measured from the captured page's CSS.
What is the Guise website built with?
The Guise website is built with custom code, Next.js, and Three.js, detected when the page was captured.
What colours does the Guise website use?
Measured from the captured page's CSS, the Guise website uses #000000 for the background, #FCF7E9 for text, #087DF5 for main buttons, and #292929 for surfaces.
What sections does the Guise website have?
The Guise website includes navbar, hero, gallery, features, dashboard, pricing, FAQ, and footer sections. Each one opens on its own page, so you can compare it with the same section on other websites.
