Ace
At a glance
A dark technical studio where narrow type, fine rules and rationed lime carry the identity, and a 640px box clips the mobile introduction.
A research notebook by Zeyad Omran
Six websites,
taken apart.
I study how distinctive websites use type, motion and structure. I measure what I can, test what I can reach, and keep what I saw apart from what I think.
Inspect measures this page live, the same way the research measured each website. Press I any time.
Deal a finding
24 sourced observations, one card at a time. Flick a card, or use the buttons and arrow keys.
No. 01Ace
Ace’s mobile introduction keeps its 640px desktop width inside a 390px screen, so its sentences are cut off mid-line.
Observed: I inspected the live page or exercised the control, at a recorded viewport.See the evidence
- Websites
- 06
- Story chapters
- 30
- Measured type roles
- 21
- Sourced findings
- 24
01 · The studies
Read by site, or by question.
6 websites, five chapters each. Open a study to read it end to end, or pick a lens to compare one chapter across all of them.
Question What is each website trying to be?
Arkon Digital
At a glance
A developer portfolio built as one persistent 3D scene, with a 162px script title and a 12px biography that has to read over the sphere.
Neue Montréal
At a glance
A type specimen shaped like a travel guide, where scrolling, splitting and swapping letters show what the typeface can do.
MONOLOG
At a glance
A studio site that builds trust in order, from atmosphere to founder, work, process and answers, while seven sitemap case URLs return generic shells.
Lama Lama
At a glance
An agency identity carried by pixels, mono labels and hidden layers, from a ten-slide pitch deck in the menu to a camera grid on the contact page.
Noho
At a glance
A furniture concept with playful photography, a headline that stays about 60px on mobile, and an energy panel that makes calm a visible choice.
Research findings
Across the collection
What five distinctive websites share: typography as identity, motion with a job, deliberate mobile redesign, and unfinished edges that undo the polish.
02 · Type lab
21 text roles,
one ruler.
Every measured role in the library, on the same pixel scale. The filled square is the desktop size at 1440 × 1000; the outlined square is the same role at 390 × 844. Sort them, pick a website, or replay the trip to mobile.
- AceService headlines40 → 40±0%
- AceExplanatory heading16 → 16±0%
- AceFixed-rail prose14 → —removed
- AceChapter labels12 → 12±0%
- Arkon Digital“Creative”161.54 → 121.15−25%
- Arkon Digital“Developer”107.69 → 80.77−25%
- Arkon DigitalBiography12 → 12±0%
- Arkon DigitalNavigation12 → 16+33%
- Neue MontréalCover title74.08 → 29.6−60%
- Neue MontréalCover explanation / Story label24 → 15−37%
- MONOLOGHero positioning17.75 → 14.11−21%
- MONOLOGFounder statement45 → 25.31−44%
- MONOLOGService names94 → 33.31−65%
- MONOLOGProcess display139.5 → 83.72−40%
- Lama LamaHero headline72 → 40−44%
- Lama LamaHero explanation20.04 → 16−20%
- Lama LamaMono action labels10 → 10±0%
- NohoHero60.05 → 60.67+1%
- NohoSection heading60.05 → 52−13%
- NohoSupporting line18.72 → 16.25−13%
- NohoEnergy note10.51 → 16.25+55%
Show every value as a table
| Website and role | Typeface / weight | Desktop size / leading | Mobile size / leading |
|---|---|---|---|
| Ace · Service headlines | Anton 400 | 40 / 42 | 40 / 42 |
| Ace · Explanatory heading | GT America Regular 400 | 16 / 22.4 | 16 / 22.4 |
| Ace · Fixed-rail prose | GT America Light 300 | 14 / 21 | Not displayed |
| Ace · Chapter labels | GT America Mono Light 300 | 12 / 12 | 12 / 12 |
| Arkon Digital · “Creative” | Bonheur Royale 400 | 161.54 / 80 | 121.15 / 80 |
| Arkon Digital · “Developer” | Bebas Neue 400 | 107.69 / 107.69 | 80.77 / 80.77 |
| Arkon Digital · Biography | JetBrains Mono 400 | 12 / normal | 12 / normal |
| Arkon Digital · Navigation | JetBrains Mono 300, active/hover emphasis | 12 / 16.8 | 16 / 22.4 |
| Neue Montréal · Cover title | PP Neue Montreal Bold 700 | 74.08 / 66.67 | 29.6 / 26.64 |
| Neue Montréal · Cover explanation / Story label | PP Neue Montreal Text Regular 400 | 24 / 24 | 15 / 15 |
| MONOLOG · Hero positioning | KHTeka 500 | 17.75 / 19.53 | 14.11 / 15.52 |
| MONOLOG · Founder statement | KHTeka 700 | 45 / 49.5 | 25.31 / 29.11 |
| MONOLOG · Service names | KHTeka 700 | 94 / 94 | 33.31 / 33.31 |
| MONOLOG · Process display | Animo, computed weight 500 | 139.5 / 125.55 | 83.72 / 75.35 |
| Lama Lama · Hero headline | Suisse BP Intl 700 | 72 / 57.6 | 40 / 32 |
| Lama Lama · Hero explanation | Suisse BP Intl 400 | 20.04 / 24.05 | 16 / 19.2 |
| Lama Lama · Mono action labels | Sometype 500 | 10 / 18 | 10 / 18 |
| Noho · Hero | Switzer 600 | 60.05 / 60.05 | 60.67 / 57.63 |
| Noho · Section heading | Switzer 600 | 60.05 / 60.05 | 52 / 49.4 |
| Noho · Supporting line | Switzer 400 | 18.72 / 18.72 | 16.25 / 16.25 |
| Noho · Energy note | Switzer 400 | 10.51 / 10.51 | 16.25 / 16.25 |
Computed CSS pixels, not estimates from screenshots. Five websites were measured September 15–16, 2026; Noho on September 20, 2026. Each row opens that study’s type chapter. The full tables live in the research findings.
03 · Method
Every claim carries its evidence.
A screenshot shows one moment. Source code shows intent. A design judgment is only a judgment. Each finding here is labeled, so you know how much weight it can bear.
How the research works- Observed
I inspected the live page or exercised the control, at a recorded viewport.
For exampleAce’s mobile introduction keeps its 640px desktop width inside a 390px screen, so its sentences are cut off mid-line. Source
- Observed + source
Seen in the browser and supported by public source code for the same behavior.
For exampleNeue Montréal’s weight chapter maps Display 900 → 100 against Text 200 → 700, and finishes at 70% of its scroll. Source
- Source-confirmed
Public HTML, CSS or JavaScript supports it. Source alone doesn't prove what renders.
For exampleArkon’s viewport tag sets user-scalable=no and maximum-scale=1, which restricts pinch zoom. Source
- Hook only
Markup suggests the behavior, but its implementation or outcome wasn't confirmed.
For exampleMONOLOG’s markup suggests a one-at-a-time values accordion, but its script refused direct access, so the behavior stays unconfirmed. Source
- Interpretation
A design judgment about hierarchy, direction or usability. Not a measured result.
For exampleNoho’s warm panels keep interface color quiet so the photographs supply it.
- Illustration
An original demonstration made for this library. It explains an idea; it isn't evidence.
For exampleEach story’s demonstrations, like the Lama Lama exits game, are drawn for this library.