Ui
klinisk plan på matt papir
shadcn/ui er et verksted for å lage et monokromt designsystem: et rent hvitt lerret, myke, varme grå overflater og kort med stor radius plassert på de fineste kantene. Grensesnittet er nesten utelukkende akromatisk – svart tekst, hvite overflater, grå sekundærtoner – med en enkelt, forstyrrende rød farge reservert for feiltilstander og ingenting annet. Typografien er avhengig av Geists geometriske nøytralitet med stram bokstavhøyde på skjermene, noe som skaper en rolig, kodelignende følelse som føles mer som utviklerinfrastruktur enn et forbrukerprodukt.
Minimale bilder – systemet består nesten utelukkende av brukergrensesnittet. Ingen viktige bilder, illustrasjoner eller dekorativ grafikk. Produktdemoer presenteres som komponentmodeller (kort, inndatafelt, knapper) i et rutenett, som fungerer både som dokumentasjon og visuelt innhold. Ikoner er tynne geometriske linjer (sannsynligvis lånt fra Lucide) 1,5–2 piksler tykke i #0a0a0a eller #737373, brukt sparsomt som funksjonelle signaler. Det visuelle språket er selve brukergrensesnittkomponentene – siden fungerer som en levende stilguide, der hvert synlige element er et synlig designelement.
Palett
Nøytral
- Canvas
#f5f5f5— Sidebakgrunn, dempet overflatefylling, ekstra knapper. - Paper
#ffffff— Kortflater, popup-bakgrunner, primære knappfyll - Surface Alt
#fafafa— Bakgrunn i sidefelt, diskret kortalternativ, inaktiv tilstand for inndatafeltet. - Ink
#0a0a0a— Hovedtekst, overskrifter, knappetiketter, ikonomriss. - Ink Soft
#171717— Bakgrunnsbilder av knapper med fyll, tilleggstekst på lyse overflater. - Mid Gray
#737373— Hovedteksten, plassholderteksten, tilleggsetikettene og ikonfyllet i hvilemodus er alle dempet.
Typografi
fra 12 til 48 piksler · 8 trinn
- Geist — erstatning: Inter · omriss 400, 500, 600 · All grensesnitttekst – brødtekst med en linjetykkelse på 14 piksler/400, overskrifter med en linjetykkelse på 24–48 piksler/600 og knapper med en linjetykkelse på 13–14 piksler/500. Geists geometriske bokstavformer og ensartede linjetykkelse skaper en nøytral følelse for utviklerverktøy; en linjetykkelse på 600 med 48 piksler bokstavavstand og -0,05 mm bokstavavstand sikrer klare, trygge overskrifter som ser gjennomtenkte ut snarere enn redigerte.
Intervaller og form
| Hensikt | Betydning |
|---|---|
| Tetthet | tett |
| Grunnleggende trinn | 8px |
| Knapperadius | 18px |
| Kortradius | 24px |
| Skygger | ingen grenser i stedet for skygger |
| Mellom seksjoner | 48-80px |
| Sidebredde | 1280px |
AI vil bygge nettstedet ditt i Ui -stil og fylle det
- Fyll på med produkter og innlegg via lenken - Instagram, TikTok, Facebook.
- Overfør innhold fra det gamle nettstedet ditt – bare oppgi adressen.
- Moderne design på den beste søkemotoren: React ( Next.js) med serverrendering og SEO-optimalisering rett ut av boksen.
- Helautomatisk SEO-optimalisering for søkeresultater og anbefalinger fra nevrale nettverk.
Lignende stiler
- Ventriloc — Et redaksjonelt observatorium for data på varmt papir – en enkelt oransje glør som fremhever den monokrome presisjonen
- Geniestudio — En myk dagslysnotatbok – typen med brede marger og ett tykt pennestrøk
- xAI — Varm kremlaboratorium med svart pille
- Cal — Monokrom praktisk sans, en menneskelig tilnærming. Et system som prioriterer klarhet og funksjonalitet gjennom en streng svart-hvitt-palett, men myker den opp med vennlig typografi og avrundede former.
- Scale — Et fotolaboratorium av høy kvalitet i museumskvalitet kombinert med et teknisk prosjekt
- Contractbook — kontrakter av kremfarget papir under en ultramarin himmel
- AutoSend — Et koselig steinstudio med et enkelt lilla lys – hvor serif-overskrifter og lyse indigofargede oppfordringer til handling sameksisterer i ett stille, nesten hvitt rom.
- Air — skulpturen «Midnattshimmel gjennom glass»
- SpatialChat — lilla puls på hvitt pergament
- Squarespace — Filmatisk monokrom galleri
- Giga — Midnattshorisont over frostet obsidian
- Supabase — En kodeditor ved midnatt med en fosforescerende grønn prikk – en enkelt kromatisk puls på et hav av kullstøv