Screenshot of Portal One

Portal One

www.portalone.studio

A Framer-built creative studio site where Inktrap display type, monochrome pure-black canvas, and large geometric SVG portals (tracks, wells, vortexes) carry the entire brand: a "creative gateway" rendered as actual gateways on every scroll.

Creative Studio Brand Web Design Studio strong

Design tokens

pageBlack
raisedBlack
panelOffWhite
linkClassicBlue
framerToken1
framerToken2
displayItalic
PP Neue Machina Inktrap Light Italic
displayPlain
PP Neue Machina Plain Regular
displayHeavy
PP Neue Machina Inktrap Ultrabold (900)
body
Inter
mono
Press Start 2P (pixel)
monoSans
Pixelify Sans (pixel)
condensed
Big Shoulders
classical
Times (italic, pull-quotes only)

Do / Don't

Reference it for

  • Pure black rgb(0,0,0) + near-black rgb(17,16,16) surfaces as the only dark tones — no greys in between
  • Off-white rgb(217, 217, 217) panels for inverted sections — not pure white, slightly warm grey
  • Browser-default-blue rgb(0, 0, 238) as the only chromatic accent — nostalgic, deliberate, almost 1996-era
  • PP Neue Machina Inktrap Light Italic as the display headliner for "creative" moments (200px scale)
  • PP Neue Machina Plain Regular as the geometric-sans counterpoint (118px / 96px / 88px)
  • Press Start 2P + Pixelify Sans pixel fonts for retro chrome strips, secret-code blocks, and CTA labels (Scroll to continue...)
  • 15-step type scale (11-200px) — unusually granular for a small studio
  • Two-weight system (400 / 900) only — no mid-weights

Do not copy

  • The PORT|UJF glitched logomark and the rocket-icon mark
  • The exact CREATIVE + GATEWAY and WHY PORTAL-1? hero copy
  • The 4T4*AL-1 and Book A Call nav phrasing
  • The PP Neue Machina Inktrap family in italic light specifically (Pangram Pangram-licensed; use the regular Inktrap or substitute)
  • The athletics-track / vortex-well / orbital-ring SVG illustrations themselves (commissioned to Portal One's brand world)
  • The browser-default-blue rgb(0,0,238) accent if the brand is post-2010 in tone — it reads as deliberate retro
  • The pseudo-leetspeak $|). / L&s_0 / ]d,8!> text blocks unless the brand has a real reason to look glitchy
  • The QR code in the chrome unless it actually resolves to something useful

Signature moves

Inktrap-italic display over pure-black contrast slabs

an Inktrap display italic at up to 200px headlines 'creative' moments over a 9627px page divided into hard black (#000) / off-white (rgb(217,217,217)) contrast slabs, with a browser-default-blue (#0000ee) as the only chromatic accent.

marquee tickertape brand-promise strips

marquee tickertape strips carry brand-promise text between sections, with numbered [03] mono section labels and a pixel-font 'Scroll to continue...' cue as chapter markers for the long scroller.

oversized geometric SVG portals on a huge radius scale

oversized geometric SVG illustrations (track ovals, vortex grids, orbital rings) anchor sections, with a radius scale (33/54/99/966px) used only on these portal/pill shapes, never on cards.