
Letters
Een ochtendafspraak in een openluchtkliniek: een steriele witte tafel onder een zachtblauw plafond, bezaaid met blauwe chirurgische instrumenten.
Letters is een medisch hulpmiddel voor het schrijven van brieven dat begint met een koptekst in de vorm van een open hemel met een kleurverloop – een zachte, sfeervolle blauwe streep die een kalme, klinische sfeer creëert – voordat het overgaat naar een strakke witte werkruimte. Het systeem is ontworpen in een monochrome stijl: een schoon wit canvas, bijna zwarte tekst (#070709), donkere pilvormige call-to-actions en afgeronde kaarten die zweven in subtiele schaduwen. Een enkele heldere blauwe kleur (#2597d0) is gereserveerd voor functionele interpunctie – pictogrammen, micrographics, golfvormspelers – en wordt nooit gebruikt voor knoppen of grote vlakken. De typografie maakt gebruik van Open Runde, een geometrisch humanistisch schreefloos lettertype met een agressieve negatieve letterafstand bij grotere schermformaten (-0,04em bij 80px), waardoor de kopteksten compact en zelfverzekerd overkomen. De componenten voelen licht aan, als een medisch instrument: dunne randen, ruime kaartafstand, pilvormige knoppen en een discreet gebruik van hoogteverschillen waardoor de hemelvormige koptekst de emotionele impact kan overbrengen.
Een hemelsblauwe, verlopende homepage beslaat de volledige breedte van de pagina, met een gecentreerde titel en subtekst, en een call-to-action-knop eronder. Deze loopt vloeiend over in een wit contentgebied met ruime tussenruimte tussen de secties (80-120px). De feature-secties gebruiken een raster van twee kolommen met grote, afgeronde kaarten (radius 18-32px) van gelijke proporties. Sectiekoppen staan altijd gecentreerd, in één kolom, boven het kaartraster. De navigatie bestaat uit een vaste witte bovenbalk met een gecentreerde groep links en rechts uitgelijnde inlogacties. Het algehele ritme wordt bepaald door een enkele, sfeervolle hoofdlijn, afgewisseld met witte en #f5f5f5-secties met consistente verticale ruimte. Er is geen zijbalk, geen megamenu, geen asymmetrische lay-outs – de pagina voelt aan als een rustige, symmetrische kolom.
Het visuele ontwerp is vrijwel volledig gericht op de gebruikersinterface van het product – geen lifestylefoto's, geen abstracte 3D-renders. De visuele taal is opgebouwd rond productkaarten die de native interface van de app laten zien: een "Voor" en "Na" vergelijking van documenten, een laadgebied met een stippellijn en een audiospeler in de vorm van een golfvorm. Het enige sfeervolle visuele element is de kleurovergang in de hoofdafbeelding. De iconen zijn platte, eenkleurige lijniconen in #2597d0 (envelop, microfoon, vinkje) met uniforme lijndiktes, zonder gevulde varianten. De illustratiestijl is ingetogen: productmockups worden weergegeven op een witte achtergrond, licht gedraaid om diepte te creëren, nooit scherp gekanteld. Een handgeschreven lettertype (The Doctor) is het enige organische/handgemaakte element, dat uitsluitend wordt gebruikt om het klinische handschrift op de "Voor" kaart op te roepen.
Palet
Merk
- Surgical Blue
#2597d0— Pictogrammen, een microfoonpictogram, een geluidsgolfspeler en kleine functionele accenten creëren een uniforme kleurstelling in de hele interface.
Neutrale
- Obsidian
#070709— De hoofdtekst, de ingevulde call-to-action-knoppen en de donkere UI-elementen – er is gekozen voor bijna zwart in plaats van puur #000 om het contrast met de witte achtergrond te verzachten. - Paper White
#ffffff— De pagina-achtergrond, de kaartoppervlakken en de knoptekst vormen het belangrijkste canvas voor alle secties onder het hoofdelement. - Cloud Gray
#f5f5f5— Extra kaartoppervlakken en sectieachtergronden scheiden functionele blokken van het hoofdcanvas. - Sky Tint
#d7e6f5— De kleur van het kartonnen frame en de nauwelijks zichtbare blauwe tint van het oppervlak creëren een gevoel van sfeer in plaats van grauwe tinten. - Charcoal
#60606c— Hoofdtekst, bijtekst en subtiele randen - een dominante neutrale kleur voor de inhoud die geen kop is. - Slate
#8b8b8b— Kleine tekst en inactieve grensstaten - gebruikt om locaties aan te duiden en de toegankelijkheid voor mensen met een handicap te garanderen.
Typografie
van 12 tot 80px · 8 stappen
- sans-serif — vervanging: Inter · overzichten 400, 700 · sans-serif - gevonden in de geëxtraheerde gegevens, maar niet beschreven door de AI.
- Open Runde — vervanging: Inter Tight · overzichten 400, 500, 600, 700, 900 · Het primaire lettertype voor koppen en navigatie is een geometrisch humanistisch lettertype met een kleine letterafstand bij grote formaten; -0,04em bij 80px comprimeert de kop tot één compact blok. Gebruik dit lettertype voor alle koppen, navigatie en grote tekst.
- Inter — vervanging: system-ui · overzichten 400, 500 · Secundaire tekst en UI-tekst – gebruikt voor kleine kopjes, navigatie-elementen en inline links waar een neutraler leesritme gewenst is. Combineert met Open Runde om hiërarchisch contrast te creëren.
Intervallen en vorm
| Doel | Betekenis |
|---|---|
| Dikte | gespannen |
| Basisstap | 12-16px |
| Knopradius | 100px |
| Kaartradius | 18px |
| Schaduwen | geen randen in plaats van schaduwen |
| Tussen secties | 80-120px |
| Paginabreedte | 1200px |
AI bouwt je website in de stijl Letters en vult deze in.
- Vul het account aan met producten en berichten via de link - Instagram, TikTok, Facebook.
- Neem de inhoud van je oude website over; geef gewoon het adres op.
- Modern design op de beste engine: React ( Next.js) met server-side rendering en SEO-optimalisatie direct uit de doos.
- Volledig geautomatiseerde SEO-optimalisatie voor zoekresultaten en aanbevelingen op basis van neurale netwerken.
Vergelijkbare stijlen
- Integrated Biosciences — Bioluminescentielaboratorium om middernacht
- Mintlify — Een wolkentuin boven een glazen tafel. De handgetekende lucht en de documentaire zijn samen ingekaderd – de enige plek waar kleur en concept botsen voordat de pagina vervaagt in ascetisch wit.
- Gleap — Een werkruimte ingericht in warme crèmekleuren met grafietaccenten – een studio waar matte zwarte inktstippen lijken te zweven boven de linnen architectuur.
- Render — Het ontwerp is uitgevoerd in geborsteld aluminium. De interface doet denken aan een strak, geometrisch technisch document: witruimte, dunne lijnen en een enkele paarse lijn die de aandacht vestigt op de actie.
- Grafbase — technische tekening op koud marmer
- Slash — Nachtkluis met vergulde grootboeken
- Modal — Een fosforescerende terminal in een verduisterde serverruimte - de enige lichtbron is een felgroene lamp.
- Whimsical — Rijke pruimkleurige inkt op een lavendelkleurige achtergrond: een creatief studionotitieboek dat tevens dienstdoet als technisch whiteboard.
- AgentQL — Het noorderlicht boven de terminal 's nachts
- Alveos One — Een knus toevluchtsoord gemaakt van rivierstenen – een stille, crèmekleurige meditatieruimte waar een enkel grafieten object rust in een zachte amberkleurige gloed.
- GitHub — Een ruimtecommandopaneel met bioluminescente bedieningspunten – een donkere, sfeervolle werkruimte waar een enkele groene gloed de weg wijst.
- Buddy — Een technische tekening op ruitjespapier. Het witte tekenoppervlak is voorzien van een nauwelijks zichtbaar raster, aangebracht met bijna zwarte inkt, met fluorescerende limoengroene markeringen en iriserende kleurovergangen.