Stripe
Een kasboek geschreven met indigokleurige inkt op matglas.
Stripe gebruikt een bijna monochrome stijl voor financiële instrumenten: een zacht, koel wit canvas met donkerblauwe koppen, vrijwel geen decoratieve chroomelementen en een enkele heldere indigokleur (#533afd) die legitiem gebruikt zou kunnen worden als knop, link of icoonomtrek. De typografie is uitzonderlijk dun, met een gewicht van 300 punten – zelfs bij 56px – wat zelfverzekerd ingetogen aanvoelt in plaats van overdreven zakelijk; de letterafstand neemt sterk af naarmate de lettergrootte toeneemt. Knoppen zijn klein, vierkant (4px) en hebben een paarse vulling of een flinterdunne paarse omtrek. Het systeem vermijdt schaduwen volledig; diepte wordt bereikt door veranderende achtergrondtinten (wit → #f8fafd → #e5edf5 → paarse tinten), in plaats van door hoogteverschillen. De gehele interface gedraagt zich als een boekhoudkundig grootboek of een terminal: compacte informatie, duidelijke lijnen, voldoende ruimte tussen secties en kleur verschijnt alleen wanneer een actie vereist is.
De maximale breedte is ongeveer 1320px voor een gecentreerde contentkolom op een wit canvas. De hero is een links uitgelijnd tekstblok op volledige grootte (56px) met twee call-to-actions eronder, zonder hero-afbeelding – de typografie IS de hero. Secties zijn verticaal gerangschikt met gelijke tussenruimtes van 96px en scheidingslijnen van 1px (#e5edf5); er zijn geen afwisselende donkere/lichte strepen. Elke sectie volgt een herhalend patroon: een kleine sectietitel in hoofdletters (rookkleur, 12px), vervolgens een kop van 32-48px, dan een alinea van 22px, dan een raster van productkaarten (3 kolommen op desktop) of een tekstblok van 2 kolommen met afbeeldingen. Klantlogo's verschijnen in een smalle verticale strook, links uitgelijnd. De footer is één brede strook (#f8fafd) met lijsten van links in meerdere kolommen. Het algehele ritme is traag, afgemeten en overwegend tekstueel – de informatiedichtheid is laag, ondanks de lange scrolllengte.
De beeldtaal is ingetogen en documentair van stijl. Paginavullende foto's verschijnen alleen in secties met casestudies (bijvoorbeeld luchtfotografie van het verkeer voor Hertz), genomen van bovenaf of vanuit dramatische hoeken, met natuurlijke kleuren – geen duotoon of kleurbewerking. Screenshots van de gebruikersinterface van het product worden gebruikt in feature cards, weergegeven met scherpe hoeken en duidelijke randen, zonder kaders. Partnerlogo's worden in hun eigen kleuren weergegeven, zonder kaders. Er zijn geen illustraties, 3D-renders of decoratieve abstracte grafische elementen. Pictogrammen zijn uniform: lijndikte 1, lijndikte 2 op een witte achtergrond, met geometrische lijntekeningen (chevrons, pijlen, vinkjes, documentsymbolen). De pagina bestaat voornamelijk uit tekst en witruimte; afbeeldingen beslaan minder dan 3% van het totale visuele oppervlak.
Palet
Merk
- Indigo Ink
#533afd— Paars wordt gebruikt voor gevulde knoppen, geselecteerde navigatiestatussen en focusgestuurde conversiemomenten. - Indigo Hover
#7389ff— Paars wordt gebruikt om links, tags en korte zinnen te benadrukken. Het mag niet als primaire kleur voor call-to-actions worden gebruikt.
Neutrale
- Midnight Ink
#061b31— De hoofdtitel en de hoofdtekst hebben een diepe, bijna zwarte kleur met een koele blauwe tint, die als basis dient voor het gehele lettertypesysteem. - Slate
#64748d— Grijze tekst markeert links, tags en korte zinnen. - Steel
#50617a— Tussen de leigrijze en gedempte paarse tinten die op sublicenties worden gebruikt, zijn aanvullende tekst en ondersteunend materiaal geplaatst. - Smoke
#839bc8— Voor grote, decoratieve koppen en de bijbehorende tekst wordt een gedempte paarse tint gebruikt - nooit in de hoofdtekst. - Pure White
#ffffff— Het canvas van de pagina en de verhoogde oppervlakken van de kaarten; de standaardachtergrond waartegen al het andere wordt afgemeten. - Mist
#f8fafd— De achtergrond van de voettekst en de sectiescheidingslijn hebben een subtiele, koele tint die de verschillende gebieden scheidt zonder een zichtbare rand.
Typografie
van 12 tot 56px · 9 stappen
- sohne-var — vervanging: Inter Tight (variable · overzichten 300, 400 · Het enige lettertype dat in de hele interface wordt gebruikt, is voor koppen, hoofdtekst, navigatie, knoppen en labels. De letterdikte 300 overheerst zelfs bij een schermgrootte van 56px, wat een opvallend kenmerk is: koppen fluisteren in plaats van schreeuwen, en stralen autoriteit uit door ingetogenheid in plaats van volume. De letterdikte 400 verschijnt alleen bij 14-16px voor navigatie en knoptekst, waar een extra lijndikte nodig is voor leesbaarheid bij kleinere formaten.
Intervallen en vorm
| Doel | Betekenis |
|---|---|
| Dikte | ruim |
| Basisstap | 8px |
| Knopradius | 4px |
| Kaartradius | 4px |
| Schaduwen | geen randen in plaats van schaduwen |
| Tussen secties | 96px |
| Paginabreedte | 1320px |
AI bouwt je website in de stijl Stripe 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
- Ui — klinisch plan op mat papier
- monopo saigon — Een vloeibare, iriserende gloed achter de redactionele stilte – een monochrome redactionele galerij zwevend op gesmolten licht.
- Ventriloc — Een redactioneel observatorium van gegevens op warm papier - een enkele oranje gloed die de monochrome precisie benadrukt.
- Hyer Aviation — Schemering in de cockpit boven perkament. De bleke ochtendhemel raakt het schreefloze logo, dat de hele romp bedekt, en een enkel warm kleikleurig accent doorbreekt de monochrome ingetogenheid.
- Family — Een pagina uit een sprookje op crèmekleurig perkament.
- OFF+BRAND. — Iriserende bol op warm perkament
- Geniestudio — Een notitieboekje voor zacht daglicht – zo'n notitieboekje met brede marges en één dikke penstreep.
- xAI — Warme crème met zwarte pil
- Seed — een levend organisme onder laboratoriumglas
- Cosmos — Een galeriewand bekleed met linnen en behangen met Polaroidfoto's.
- Cal — Monochroom praktisch, een menselijke benadering. Een systeem dat prioriteit geeft aan duidelijkheid en functionaliteit door middel van een strikt zwart-wit kleurenpalet, maar dit verzacht met vriendelijke typografie en afgeronde vormen.
- T1 Energy — Een tekening van een productiefaciliteit op warm perkament is een rustig, monochroom tafereel waarin industriële schaal en subtiele typografie het hele merk belichamen.