No design tokens, no GSAP — here's what actually holds cuberto.com together

Issue 002 · measured, not guessedUpdated October 22, 2026

cuberto.com is a motion-design studio's own site — the kind of build you'd expect to lean on a careful token system. A real browser measured it on 22 October 2026 and found the opposite: zero named colors, zero named easings, and no live GSAP. What it has instead is a very small set of hardcoded values, used over and over. That repetition is the whole system.

One typeface, two weights in use, five more declared and unused

The font file the page loads is Suisse Intl, from Swiss Typefaces (the best Swiss Grotesk available in digital form). It draws 100% of the text. The CSS declares 5 weights (300, 400, 500, 600, 700), but only 400 and 500 actually render any visible text — the other 3 (300, 600 and 700) sit in the font-face rules unused on this page. The page also loads Manrope from Google Fonts (weights 200 800), which likewise draws none of the text a crawl of this page reaches.

The font file's own name table doesn't say "Suisse Intl" anywhere — its family and full-name fields just read "Font". The real name only appears in the trademark notice: "Suisse Int'l is a trademark of Swiss Typefaces Sàrl." Some commercial foundries do this deliberately so a casually extracted file doesn't reveal what it is; cuberto.com's own CSS is where the real name is actually declared. Credit, per the foundry's own site: Ian Party / Swiss Typefaces (original design); Quentin Schmerber / Swiss Typefaces (development and updates).

Size carries the hierarchy instead of weight. The page uses 7 distinct sizes from 14.5px to 38px, but 80.7% of all text sits at just two of them: 16px (59.3%) and 18px (21.4%).

A palette with no names, and only two real accents

Zero custom properties means zero named colors — every value below is a literal, repeated across the stylesheet rather than declared once. Measured by coverage, the page is almost entirely two colors:

Text on background has a contrast ratio of 21:1 — about as high as contrast gets. There is no single "accent" role; instead, 2 pastel tints show up in small doses on cards and testimonials: #e3f5f3 (4.6% of background area) and #f1f3fa (4.1%).

No GSAP, no WebGL — just Lenis and two easing curves

For a studio whose own portfolio is full of GSAP and WebGL work, its own homepage runs neither, at least not on 22 October 2026: a local read and Enrichr's own capture — which hooks into the page before its own scripts run, specifically so a library with no leftover global isn't missed — agree on both counts. The page's own script bundle does name-check ScrollTrigger, but nothing using it was observed running in either capture, and no canvas on the page draws with WebGL.

What actually moves is CSS transitions, on hover and on scroll-position changes, with 0 keyframe animations running idle (the stylesheet declares 12 @keyframes rules, mostly for the page-transition states, not the idle page). The generic ease keyword covers the most transitions (94), but the two deliberate curves are cubic-bezier(0.16, 1, 0.3, 1) (on 49 elements) and cubic-bezier(0.4, 0, 0, 1) (on 12). Durations cluster the same way: 0.4s (39 elements), 0.6s (33) and 1.2s (30).

Steal this

• A token system isn't the only way to be consistent. Pick two easing curves and three durations, then reuse them everywhere by hand. 14 stylesheets' worth of rules here lean on just a handful of motion values.
• Carry hierarchy with size, not more fonts. One family, two loaded weights, and most of the text sits at two sizes.
• Reserve color for small doses. Two pastel tints do all the "accent" work here, each covering a few percent of the page.

transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
            opacity 0.6s cubic-bezier(0.4, 0, 0, 1);

Inspect it yourself

Every claim above can be checked. Paste cuberto.com into the font finder, the color palette extractor, the animation library checker or the design token extractor, or install the Chrome extensions and click.

How this was measured

A local read in headless Chrome at 1440 by 900, after scrolling the page once, run 2 times. Two long-tail palette entries under 1% share (a near-black and a light gray, both well outside the four role colors and the pastel accents this issue cites) each drifted by one shade between runs — consistent with a lazily-loaded image or video frame rendering slightly differently. Every value this issue actually quotes (fonts, type scale, the four role colors, the pastel accents, custom-property count, transitions, easings and motion libraries) was byte-for-byte identical across both runs. Enrichr's animation and WebGL capture, which instruments the page before its own scripts run, ran twice with identical results. The font file's name table, read directly. The evidence files are kept with the issue, and a test fails if a number in the text stops matching them. Sites change, so treat this as a snapshot of 22 October 2026.

FAQ