← Back to the library

Call to action · Developer Tools

E2B — Agent Machine Closing CTA

Sign in to save

A centered closing CTA pairs a compact adoption statistic with an uppercase headline, vermilion primary action and outlined secondary action.

Visit original website ↗Captured Sep 30, 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: E2B — Agent Machine Closing CTA
colors:
  primary: '#E32A01'
  canvas: '#FFFFFF'
  ink: '#000000'
  surface: '#F4F4F4'
typography:
  heading:
    fontFamily: '"PP Supply Sans", "PP Supply Sans Fallback", sans-serif'
    fontSize: 72px
    fontWeight: 300
    lineHeight: 61.2px
  body:
    fontFamily: '"Commit Mono", ui-monospace, monospace'
    fontSize: 14px
    fontWeight: 400
    lineHeight: 15.4px
---

## Overview
A centered closing CTA pairs a compact adoption statistic with an uppercase headline, vermilion primary action and outlined secondary action. Inspected at 1440px desktop and 390px mobile widths on September 30, 2026.

## Colors
Palette tokens describe the observed visual roles. Condensed uppercase industrial headings, hairline rules, monospace details and vivid vermilion actions. Favor square corners and grid alignment over decorative shadows. Transparent and gradient text layers must be considered with their painted background, not interpreted as solid-color text.

## Typography
The sampled heading uses "PP Supply Sans", "PP Supply Sans Fallback", sans-serif at 72px, weight 300, with 61.2px leading. Supporting sample: "Commit Mono", ui-monospace, monospace, 14px / 15.4px. These are computed styles at capture width, not fixed requirements for every breakpoint. Use licensed font assets or deliberate substitutes.

## Layout
Center the headline, separate the two actions clearly, and put installation syntax below as supporting information. Exact responsive breakpoints were not measured.

## Elevation & Depth
Preserve separation through the reference’s surface contrast, border rules and whitespace. Avoid adding heavy shadows to a flat interface. Shadow strength is visual guidance, not a measured token.

## Shapes
Keep the visible distinction between content panels, fields and actions. Match the photographed corner treatment rather than applying one global radius; measured element radii are retained in the evidence.

## Components
The adoption statistic and free-tier copy are source claims, not reusable social proof.

## Do's and Don'ts
Do adapt hierarchy, spacing and responsive ordering with your own brand and truthful copy. Do not reuse customer endorsements or performance numbers as your own. Do not infer hover, keyboard, validation, dark-mode or accessibility compliance from static images.

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

Full screenshot of E2B — Agent Machine Closing CTA

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.