Huly
Noorderlicht bij het Middernachtobservatorium - de hoofdrolspeler is een verticale paarse lichtstraal die overgaat in koraalrood, en elk rustig gedeelte eronder vertelt hetzelfde tweekleurige verhaal in een meer ingetogen tint.
Huly roept de sfeer op van een kosmische werkruimte: een bijna zwart canvas met een enkele violet-amberkleurige gloed die door het hoofdelement snijdt, en daaronder een meer ingetogen raster voor verhoogde productiviteit. Het systeem werkt binnen een smal kleurenpalet – een helderblauw en een koraalkleur vormen de basis voor de branding tegen gelaagde grafietkleurige oppervlakken, waardoor de donkere modus nooit neutraal aanvoelt. De typografie is in Inter-stijl voor alle functionele elementen, met een aangepast lettertype (Esbuild) gereserveerd voor de belangrijkste punten, met een pitch van 80-84px en een agressieve negatieve letterafstand. Componenten hebben een capsulevorm: radii van 9999px voor bedieningselementen, 12px voor kaarten, minimale schaduw en gloeiende verlooplijnen als belangrijkste decoratie. De pagina wisselt af tussen paginavullende donkere gebieden en rustige lichte gedeelten, dus bij het openen van een nieuw scherm moet eerst de gewenste modus worden bepaald voordat de kleuren worden gekozen.
De homepage, die de volledige breedte beslaat, toont een verticale lichtstraal van het noorderlicht en een links uitgelijnde koptekst, samen met een productscreenshot rechtsonder. Onder de homepage bevindt zich een contentgebied met een maximale breedte van 1200px, met afwisselend donkere en lichte strepen. Elke sectie bestaat uit één verticaal blok: een koptekst plus een raster van kaarten met 3 of 4 kolommen, gescheiden door tussenruimtes van 96px. De sectie "MetaBrain" doorbreekt het raster met een gecentreerde koptekst en een mozaïek van kaarten van verschillende groottes (een grote hoofdkaart plus kleinere ondersteunende kaarten). De pagina is contentrijk, conform de SaaS-standaarden, maar gebruikt afwisselende donkere en lichte strepen om elke sectie de nodige ruimte te geven. De navigatie bestaat uit een enkele transparante balk bovenaan die ondoorzichtig wordt naarmate je scrollt.
Het hoofdelement is een puur aurora-gradient, zonder foto's. Alle illustraties zijn daadwerkelijke screenshots van de gebruikersinterface van het product (Kanban in donkere modus, inbox, kalender), ingekaderd in kaartframes die zowel als bewijs als decoratie dienen. Geen lifestylefoto's, geen stockfoto's, geen 3D-renders. Het enige visuele element dat niet gerelateerd is aan de gebruikersinterface is een warme, radiale gloed van een zonnestralenpatroon aan de voet van de aurora, weergegeven als een CSS-gradient. Pictogrammen zijn monochrome lijnpictogrammen in #95979 of wit, nooit meerkleurig. Het systeem beschouwt zijn eigen donkere gebruikersinterface als het hoofdelement – het product zijn de foto's.
Palet
Merk
- Electric Iris
#5683da— De hoofdachtergrond, de actieve navigatie-indicator en het opvallende noorderlichtaccent – een levendige violetblauwe kleur op een gitzwarte achtergrond – wekken een indruk van betrokkenheid in plaats van zakelijke activiteit. - Ember Pulse
#ff8964— Een secundair accent, een warme zone die doet denken aan het noorderlicht, een herkenningspunt en een illustratief hoogtepunt: een amberkleurige tint die de soberheid van het blauw doorbreekt en warmte toevoegt aan de lichtstraal.
Neutrale
- Obsidian Canvas
#303236— De pagina-achtergrond, het dominante oppervlak, is bijna zwart met een lichte warme tint, de standaardomgeving voor alle content. - Void
#090a0c— De diepste oppervlaktelaag voor verlopen op het hoofdscherm, modale achtergronden en kaders die in het canvas moeten overvloeien. - Charcoal Card
#111111— Verhoogde oppervlakken van karton en panelen, één trede boven het doek geplaatst. - Slate Edge
#4a4b50— Subtiele randen en scheidingslijnen op donkere oppervlakken - Iron Veil
#6b6c6d— Gedempte achtergrond voor tags, opvulling van lijstitems en uitgeschakelde opvulling. - Smoke
#95979e— Pictogramcontouren, extra tekst en inactieve bedieningselementen zijn de belangrijkste werkelementen in middengrijs.
Typografie
van 11 tot 80px · 8 stappen
- Inter — vervanging: DM Sans · overzichten 300, 400, 500, 600, 700 · Alle functionele tekst in de gebruikersinterface – hoofdtekst, navigatie, knoppen, lijstitems, labels en kleine kopjes – gebruikt een lettergrootte van 500-600 voor accentuering, 400 voor hoofdtekst en spaarzaam 300 voor onopvallende metadata.
- Esbuild — vervanging: Sora · overzichten 400, 500, 600 · Alleen voor weergave: splash-titels, sectiekoppen en titels van MetaBrain-artikelen. De compacte vormgeving en de kleine letterafstand wekken de indruk dat 84px meer geschikt is voor redactioneel werk dan voor SaaS-projecten. Gebruik nooit een kleinere lettergrootte dan 28px.
Intervallen en vorm
| Doel | Betekenis |
|---|---|
| Dikte | ruim |
| Basisstap | 12px |
| Knopradius | 9999px |
| Kaartradius | 12px |
| Schaduwen | zachte schaduwen |
| Tussen secties | 96px |
| Paginabreedte | 1200px |
AI bouwt je website in de stijl Huly 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
- monday — Witte werkplaats met pastelkleurige stickers
- Slack — Het podium is auberginekleurig met witte spotlights. Een diepe pruimkleur domineert de donkere gedeelten, terwijl het gebroken witte doek de grote, avant-gardistische titels de ruimte geeft om volledig tot hun recht te komen.
- Base44 — Zonnig notitieboekje met limoengroene marker
- Supahub — Zacht daglicht op een paarse heuvelrug. Een overwegend wit, luchtig canvas verlicht door een enkele heldere paarse zon, met decoratieve, kleurverloopbollen die kleur in de negatieve ruimte verspreiden en royale, afgeronde geometrische vormen die elk oppervlak een aangename, tastbare zwaarte verlenen.
- Raycast — Middernacht Commandocentrum, Koraal Neon
- Dimension — een bij schemering verlichte werkplek met panelen van matglas
- Wiza — Een observatorium voor mineralenonderzoek bij schemering, gehuld in een lavendelkleurige mist.
- Paste — Een amberkleurige lantaarn op wit marmer – het warme, geleidelijke logo van het merk zweeft in de uitgestrekte witte ruimte, als het enige verlichte raam in een met sneeuw bedekt gebouw.
- Reworkd — Het zachte daglicht op de productafbeelding is de enige kleur die echt opvalt; het is de actieknop en de kleurovergang in de koptekst erboven.
- Reflect Notes — De paarse sterrenhemel is een donker observatorium waar noten als sterrenbeelden zweven tegen een achtergrond van bijna zwarte indigo leegte.
- Ameba — De controlekamer om middernacht – een elektrisch blauwe puls in de matglazen panelen.
- Todoist — Een zonnige werkplek met een papieren agenda – een warm crèmekleurig bureau, aantekeningen in inkt, een rode pen.