Superlist
Et natligt arbejdsområde med koralgløder – en stille aubergine-app-overflade, hvor en enkelt varm orange gnist signalerer enhver handling
Superlist bruger et produktivitetssprog i midnatslilla toner: dyb aubergine, varm koral som den eneste primærfarve og store sans-serif overskrifter, der indfanger hele atmosfæren. Grænsefladen fremkalder følelsen af fokuseret arbejde sent om aftenen – stille, lagdelt og selvsikkert, hvor farver kun bruges som funktionel tegnsætning på opfordringer til handling, aktive tilstande og nøglepunkter. Overfladerne er lagdelt i subtile mørke toner med en lilla undertone (#181824 → #26253b), og ren sort undgås for at sikre, at dybden føles varm snarere end steril. Komponenterne har generøse afrundede former (20px kort, pilleknapper), bløde skygger og "ånder" gennem komfortable 10-16px mellemrum i stedet for stramme gitre. Overskriftens stemme er alt: en vægt på 600 point ved 70-88px med en stram bogstavafstand på -0,02em behandler teksten som typografisk snarere end brugergrænseflade – den er tættere på redaktionel tekst end SaaS.
Mørke sektioner strækker sig over hele sidens bredde med centrerede indholdsbeholdere med maksimal bredde. Hovedsektionen er lodret centreret og indeholder en overskrift, undertekst og en opfordring til handling (CTA), efterfulgt af et stort produktskærmbillede, der overlapper det næste afsnit. Efterfølgende sektioner skifter mellem centrerede tekstblokke og kortgitter. Anmeldelsessektionen bruger et gitter med tre kolonner med anmeldelseskort og 16 indbindingsmarginer. Navigationen er en enkelt øverste bjælke med et logo til venstre, centrerede links og loginhandlinger til højre – ingen fast sidebjælke eller megamenu. Indbindingsmarginerne mellem sektionerne er generøse (16 indbindingsmarginer), hvilket skaber en rummelig, redaktionel rytme snarere end et tæt produktgitter.
Det visuelle rum domineres af produktskærmbilleder – en stor ramme med afrundede hjørner, der viser den faktiske app-grænseflade, udfylder hoved- og sekundærsektionerne. Billederne er minimale og bruges kun som brugeravatarer eller forhåndsvisninger af medier i appen (f.eks. koncertbilledet i højre panel af produktmockup'en). Logoer på tillidslinjen er flade, dæmpede hvide tekstsymboler. Der er ingen dekorative illustrationer, ingen abstrakt grafik, ingen 3D-gengivelser. Den visuelle strategi er at præsentere produktet i stor skala, lade typografien gøre det følelsesmæssige arbejde og bruge koral som den eneste accentfarve.
Palet
Mærke
- Coral Ember
#ff4a36— Orange bruges som en sekundær accent til dekorative detaljer og til at fremhæve sjældne signaler. Den bør ikke bruges som den primære farve til opfordringer til handling.
Neutral
- Aubergine Canvas
#181824— Sidens baggrund, det primære lærred, har en varm, mørk nuance, der erstatter ren sort, hvilket får brugergrænsefladen til at virke lagdelt i stedet for flad. - Elevated Plum
#26253b— Kortoverflader, inputfelter, navigationsbeholdere – et trin nemmere end lærred til at skabe dybde uden en synlig grænse. - Pure White
#ffffff— Hovedoverskrifter, knaptekst og ikonomrids – maksimal kontrast på et mørkt lærred. - Fog Text
#696f81— Hovedteksten, de sekundære overskrifter og de dæmpede rammer har alle et kontrastforhold på 7:1 for behagelig læsning mod en auberginefarvet baggrund. - Ash Text
#8e8da0— En neutral farve understøttes til sekundære UI-elementer, skillevægge og dæmpede etiketter. Den bør ikke bruges som den primære farve til opfordringer til handling. - Mist Highlight
#a3a3a7— Diskrete rammer, skillevægge og inaktive navigationselementer skaber en diskret neutral tone, der stadig skiller sig ud mod lærredet.
Typografi
fra 12 til 88px · 9 trin
- sans-serif — udskiftning: Inter · konturer 400 · sans-serif - fundet i de udtrukne data, men ikke beskrevet af AI'en.
- Haffer XH SemiBold — udskiftning: Inter Tight · konturer 400, 600 · Den primære skrifttype til visning og overskrifter. Den bruges i en størrelse på 70-88px til hovedoverskrifter med en bogstavafstand på -0,02em og en vægt på 600. Den smalle bogstavafstand og den store bogstavhøjde giver overskrifterne en redaktionel vægt, hvilket får den mørke brugerflade til at ligne mere et magasinomslag end et dashboard. Erstat med Inter Tight eller General Sans i fed tykkelse.
- Jersey 10 — udskiftning: Anybody · konturer 400 · En stor, dekorativ skrifttype til accentnumre og fremhævelser. Bruges sparsomt i meget store størrelser til at skabe typografiske accenter. Kan erstattes med Anybody eller Cabinet Grotesk.
Intervaller og form
| Formål | Mening |
|---|---|
| Tæthed | gennemsnit |
| Grundlæggende trin | 10-16px |
| Knapradius | 100px |
| Kortradius | 20px |
| Skygger | bløde skygger |
| Mellem sektioner | 80px |
| Sidebredde | 1200px |
AI vil bygge din hjemmeside i Superlist -stil og udfylde den
- Fyld med produkter og opslag via linket - Instagram, TikTok, Facebook.
- Overfør indhold fra dit gamle websted – angiv blot adressen.
- Moderne design på den bedste søgemotor: React ( Next.js) med serverrendering og SEO-optimering lige fra starten.
- Fuldautomatiseret SEO-optimering til søgeresultater og anbefalinger til neurale netværk.
Lignende stilarter
- DNA — Midnight Observatory set gennem en partikellinse
- Abetterlou — Sparks on Saddle Leather - en varm, cremet skrifttype, der gløder mod en dyb kaffesort baggrund, med ravguldfarvede knapper, der føles som varmt metal presset ned i siden.
- Galileo-ft — Et kommandodæk fra det dybe rum med elektriske blå signaler
- Decide AI — Observatorium ved midnat - perfekt signal
- Redis Agency — Redaktionsværkstedet, der er åbent efter lukketid, er et kulsort sted, hvor alt brandingarbejdet udføres med serif-skrifttyper og en enkelt rød radise.
- Spellbook — En midnatsretssal oplyst med koralblæk – en mørk redaktionel overflade, hvor den eneste lyd er det varme orange pennestrøg
- Linear — midnatspræcisionsinstrument
- Origin Financial — Et midnatsgalleri af stille overdådighed. Et stille, næsten mørkt rum, hvor store serif-skrifttyper og et par oplyste farvede paneler skaber følelsen af, at finans er et omhyggeligt kurateret kunstværk.
- Hyperstudio — Designet er ridset ind i obsidian. Tekst og fine linjer indrammer et hvidt område af ren sort, med lejlighedsvise gyldne kompasmærker, der viser vejen.
- Air — skulptur "Midnatshimlen gennem glas"
- Raycast — Midnatskommandocenter, Coral Neon
- dope.security — Midnatsterminal med lilla beacons