Roundproxies

Overview

Roundproxies sells residential, datacenter and rotating proxy infrastructure, and its free proxy list is the public top of that funnel. The page is a working tool: a live table of 8,384 endpoints, filters for country, protocol, speed, anonymity and uptime, and export to TXT, CSV or JSON. The aesthetic is Dark Utilitarianism, a near-black graphite canvas (#212121) with restrained cyan (#49C0F8) as the single interactive accent and mint (#65FB9E) reserved for live status and the promotional strip.

The emotional target is competence and immediacy rather than delight. Numbers are large and unadorned ("5 sec Last updated"), copy is plain and direct, and the brand speaks as an operator to operators. Example sentence: "These public proxies are scraped from the Internet. We don't guarantee their security, reliability, or anonymity."

Colors

Primary (#49C0F8) is the signature accent: it fills the header "Sign up" CTA and the "Start with 50% discount" action, and marks active interactive state. Its on-color is #131F24, a deep blue-black that keeps contrast above 9:1 on the cyan. Secondary (#65FC9F) is a status mint used for live indicators and the top promo band (#65FB9E) with shadow 0 0 6px rgba(101,251,158,0.5). Tertiary (#A78BFA) is a violet reserved for badge-level emphasis.

The surface stack steps in small increments: page canvas #212121, header and first cards #1C1B1B, inputs sink to #191719, and hover raises to #2A2A2A. Never use a surface step larger than one tier per elevation level. Text is pure #FFFFFF for headings and #9A9A9A for secondary copy. Error is the orange #F97316 used in fallback overlays.

Typography

The type system pairs Roboto for all reading and UI text with Fira Mono for technical micro-labels such as the URL field caption and filter headers. Headline-lg at 32.4px / 600 carries section titles, display at 27px / 600 anchors the page H1, and body-md at 14.4px / 400 with 21.6px line height runs the copy. Labels use 12.6px / 700 with letter-spacing 0.432px in uppercase only for button text; mono captions at 10.8px use letter-spacing 0.05em in uppercase to read as data tags. Weight 600 is the ceiling for headings; avoid 800 or 900 because it fights the data density.

Layout

The layout is a fixed container of 1280px with a 12-column grid and 24px gutters. Margins are 32px on desktop. Section rhythm uses xl (24px) between filter rows and lg (20px) inside cards, with 32px separation before the table block. White space is generous around the hero stats (5 sec / 8,384 / 141) but the filter panel is tight, favouring scanning. Use the sm (12px) spacing for label-to-input gaps and md (16px) for button padding groups.

Elevation & Depth

Depth is conveyed by tonal stepping rather than shadow. Level 1 (page): #212121. Level 2 (cards, header): #1C1B1B with no border. Level 3 (inputs, hover): #191719 sunken or #2A2A2A raised. The only shadow in use is the mint glow on the promotional band, 0 0 6px rgba(101,251,158,0.5), and a subtle 0 8px 24px rgba(0,0,0,0.4) on the floating chat composer. Borders, where present, are 1px solid rgba(255,255,255,0.2).

Shapes

The shape language is Soft-Technical: corners are modest, not pill-shaped, except the promotional code tag. Buttons use 3.6px (sm) for the ghost action and 5.4px for the primary CTA, inputs 4.5px (md), and cards 14.4px (lg) to give the table container a friendlier silhouette. The 9999px full radius is limited to status badges.

Components

Action Elements The primary header CTA is a 36px-tall cyan fill with 5.4px radius and 14.4px horizontal padding, label-md weight 600. On hover, transition background-color 150ms ease to #2FA6DE (primary-fixed-dim). Ghost actions such as "Login" use a 1px rgba(255,255,255,0.2) border with transparent fill.

Containers & Surfaces Cards sit on #1C1B1B with a 14.4px radius and 20px internal padding. Elevate on hover by stepping to #2A2A2A over 200ms ease-out. The table header row is #191719 to read as a recessed index.

Inputs & Interaction Select and text inputs use #191719 with a 4.5px radius, 10.8px mono placeholder text and 0 10.8px horizontal padding. Focus rings are 2px solid #49C0F8 at 50% alpha (rgb(59 130 246/0.5) fallback). Filter pills toggle between surface-container an

Do's and Don'ts

**Do**

• Use cyan #49C0F8 only for the single most important action per viewport.
• Keep surface steps to one tier at a time (#191719 to #1C1B1B to #212121).
• Set technical labels in Fira Mono at 10.8px uppercase with 0.05em tracking.
• Reserve mint #65FB9E for live status and the promotional band only.

**Don't**

• Don't use drop shadows on cards; separate them with tonal steps.
• Don't introduce a second saturated accent beside cyan and mint.
• Don't set headings above weight 600; the table data must stay the loudest thing.
• Don't round primary buttons beyond 5.4px; pill shapes break the utility tone.