Ui
klinisk plan på matt papper
shadcn/ui är en workshop för att skapa ett monokromt designsystem: en ren vit duk, mjuka, varma grå ytor och kort med stor radie placerade på de mest subtila kanterna. Gränssnittet är nästan helt akromatiskt – svart text, vita ytor, grå sekundärtoner – med en enda, störande röd färg reserverad för feltillstånd och inget annat. Typografin bygger på Geists geometriska neutralitet med snäv bokstavshöjd på skärmar, vilket skapar en lugn, kodliknande känsla som känns mer som utvecklarinfrastruktur än en konsumentprodukt.
Minimala bilder – systemet består nästan uteslutande av användargränssnittet. Inga viktiga foton, illustrationer eller dekorativ grafik. Produktdemonstrationer presenteras som komponentmodeller (kort, inmatningsfält, knappar) i ett rutnät, som fungerar både som dokumentation och visuellt innehåll. Ikoner är tunna geometriska linjer (troligen lånade från Lucide) 1,5–2px tjocka i #0a0a0a eller #737373, som används sparsamt som funktionella ledtrådar. Det visuella språket är själva UI-komponenterna – sidan fungerar som en levande stilguide, där varje synligt element är ett synligt designelement.
Palett
Neutral
- Canvas
#f5f5f5— Sidbakgrund, dämpad ytfyllning, ytterligare knappar. - Paper
#ffffff— Kortytor, popup-bakgrunder, primära knappfyllningar - Surface Alt
#fafafa— Sidofältets bakgrund, diskret kortalternativ, inmatningsfältets viloläge. - Ink
#0a0a0a— Huvudtext, rubriker, knappetiketter, ikonkonturer. - Ink Soft
#171717— Bakgrundsbilder för knappar med fyllning, ytterligare text på ljusa ytor. - Mid Gray
#737373— Huvudtexten, platsmarkörtexten, hjälpetiketterna och ikonfyllningen i vila är alla avstängda.
Typografi
från 12 till 48px · 8 steg
- Geist — ersättning: Inter · konturer 400, 500, 600 · All gränssnittstext – brödtext med en radtjocklek på 14px/400, rubriker med en radtjocklek på 24–48px/600 och knappar med en radtjocklek på 13–14px/500. Geists geometriska bokstavsformer och enhetliga radtjocklek skapar en neutral känsla för utvecklarverktyg; en radtjocklek på 600 med 48px bokstavsavstånd och -0,05em bokstavsavstånd säkerställer tydliga, självsäkra rubriker som ser genomtänkta snarare än redigerade ut.
Intervaller och form
| Ändamål | Menande |
|---|---|
| Densitet | tät |
| Grundläggande steg | 8px |
| Knappradie | 18px |
| Kortradie | 24px |
| Skuggor | inga gränser istället för skuggor |
| Mellan sektioner | 48-80px |
| Sidbredd | 1280px |
AI kommer att bygga din webbplats i Ui -stil och fylla den
- Fyll på med produkter och inlägg via länken - Instagram, TikTok, Facebook.
- Överför innehåll från din gamla webbplats – ange bara adressen.
- Modern design på den bästa sökmotorn: React ( Next.js) med serverrendering och SEO-optimering direkt ur lådan.
- Helautomatisk SEO-optimering för sökresultat och rekommendationer för neurala nätverk.
Liknande stilar
- Ventriloc — Ett redaktionellt observatorium för data på varmt papper - en enda orange glöd som framhäver den monokroma precisionen
- Geniestudio — En mjuk dagsljusbok – den sorten med breda marginaler och ett tjockt pennstreck
- xAI — Varm gräddelaboratorium med svart piller
- Cal — Monokrom praktiskhet, ett mänskligt förhållningssätt. Ett system som prioriterar tydlighet och funktionalitet genom en strikt svartvit palett, men mjukar upp den med vänlig typografi och rundade former.
- Scale — Ett högkvalitativt fotolabb av museikvalitet kombinerat med ett tekniskt projekt
- Contractbook — kontrakt av krämfärgat papper under en ultramarinblå himmel
- AutoSend — En mysig stenstudio med ett enda lila ljus – där serif-rubriker och ljusa indigofärgade uppmaningar till handling samsas i ett tyst, nästan vitt utrymme.
- Air — skulpturen "Midnattshimmel genom glas"
- SpatialChat — lila puls på vitt pergament
- Squarespace — Filmiskt monokromt galleri
- Giga — Midnattshorisont över frostad obsidian
- Supabase — En kodredigerare vid midnatt med en fosforescerande grön prick – en enda kromatisk puls på ett hav av koldamm