← Back to the library

Other · Developer tools

Ghostty — platform download selection page

Sign in to save

A restrained dark download page with a centered app mark and version, paired macOS/Linux installation cards and a compact utility footer.

Visit original website ↗Captured Oct 17, 2026 · 1440px wide

Build with this design

Download DESIGN.md into your project and ask your coding agent to follow it alongside this reference. Review inferred values against the original before implementation.

Download DESIGN.md ↓
View DESIGN.md
---
version: alpha
name: Ghostty — platform download selection page
colors:
  primary: '#4D5FFF'
  surface: '#0F0F11'
  text: '#F0F0F4'
typography:
  primaryRole:
    fontFamily: pretendardStdVariable, "pretendardStdVariable Fallback"
    fontSize: 45px
    fontWeight: 500
    lineHeight: 54px
  supporting:
    fontFamily: pretendardStdVariable, "pretendardStdVariable Fallback"
    fontSize: 16px
    fontWeight: 400
    lineHeight: 22.4px
omitted:
- section: spacing
  reason: Per-reference geometry is recorded in Layout; a global spacing scale was
    not inferred.
- section: rounded
  reason: Observed shape roles are described in Shapes, without inventing a universal
    radius scale.
- section: components
  reason: The individual pattern is specified in prose, not an inferred component
    API.
---

## Overview

A restrained dark download page with a centered app mark and version, paired macOS/Linux installation cards and a compact utility footer.

Captured from https://ghostty.org/download at 2026-10-17T06:04:15.066349+00:00. This reference preserves the complete public page.

## Colors

Primary accent `#4D5FFF`, surface `#0F0F11` and principal text `#F0F0F4` describe visible roles. These are reference-local colors, not an exhaustive brand system. Match the screenshot where gradients or image colors differ.

## Typography

- h1 “Download Ghostty”: pretendardStdVariable, "pretendardStdVariable Fallback"; 45px, weight 500, line height 54px.
- h2 “macOS”: pretendardStdVariable, "pretendardStdVariable Fallback"; 25px, weight 500, line height 30px.
- h2 “Linux”: pretendardStdVariable, "pretendardStdVariable Fallback"; 25px, weight 500, line height 30px.
- p “Version 1.3.1 - Release Notes”: pretendardStdVariable, "pretendardStdVariable Fallback"; 16px, weight 400, line height 22.4px.
- p “A universal binary that works on both Apple Silicon and Intel machines”: pretendardStdVariable, "pretendardStdVariable Fallback"; 16px, weight 300, line height 22.4px.

These are measured computed styles; rendered font availability and platform-specific fallback can affect exact glyph shapes. Do not apply the primary-role token indiscriminately to every text level.

## Layout

Use a slim global header, centered app mark, Download Ghostty title and release/version line. Place equal-width macOS and Linux cards side by side below; each has platform-specific explanatory text and two outlined installation routes. Keep the footer separated by a thin rule.

Desktop primary image: 1440 × 1000px at a 1440px viewport and device scale 1. Mobile evidence: 390 × 844px at a 390px viewport. The primary screenshot is the complete page; mobile evidence covers only the opening 844px viewport.

At 390px the global nav becomes a hamburger control, platform cards stack within 24px page gutters and each card’s two installation actions stack vertically. The first mobile viewport includes macOS and the start of Linux; lower mobile content was not captured.

## Elevation & Depth

Use flat near-black surfaces, faint outlines and no prominent shadows. Blue button borders are the main emphasis.

## Shapes

Rounded rectangular cards and modestly rounded buttons stay subordinate to the ghost-shaped app mark.

## Components

The version is 1.3.1 at capture time. Available routes include a universal binary, package-manager guidance and source build guidance. No binaries were downloaded and no installation command was run.

## Do’s and Don’ts

Keep platform requirements adjacent to the relevant actions. Do not replace observed routes with fabricated platform support or treat this free download page as pricing.

Use only observed source content. Sizes above are measured; unquantified visual treatments are qualitative observations. No forms were submitted, accounts created, trials started or purchases made.

If copying fails, download the file or select the text above.

Full screenshot of Ghostty — platform download selection page

Design belongs to its original creator. Use this example for inspiration, not as a licensed template.

A little more taste in your inbox.

A weekly selection of standout designs, useful UI elements, and fresh inspiration from TastefulKit.