Ui
kliiniline plaan mattpaberil
shadcn/ui on töötuba monokroomse disainisüsteemi loomiseks: puhas valge lõuend, pehmed soojad hallid pinnad ja suure raadiusega kaardid, mis on paigutatud kõige peenematele ääristele. Liides on peaaegu täielikult akromaatiline – must tekst, valged pinnad, hallid sekundaarsed toonid –, üheainsa häiriva punase värviga, mis on reserveeritud veaolekutele ja mitte millelegi muule. Tüpograafia tugineb Geisti geomeetrilisele neutraalsusele ja kitsale tähekõrgusele ekraanidel, luues rahuliku, koodilaadse tunde, mis meenutab pigem arendaja infrastruktuuri kui tarbekaupa.
Minimaalselt pilte – süsteem koosneb peaaegu täielikult kasutajaliidesest. Puuduvad olulised fotod, illustratsioonid või dekoratiivsed graafikad. Toote demod esitatakse komponentide makettidena (kaardid, sisestusväljad, nupud) ruudustikus, mis toimib nii dokumentatsiooni kui ka visuaalse sisuna. Ikoonid on õhukesed geomeetrilised jooned (tõenäoliselt laenatud Lucide'ist) paksusega 1,5–2 pikslit ja märgistusega #0a0a0a või #737373, mida kasutatakse harva funktsionaalsete vihjetena. Visuaalne keel on kasutajaliidese komponendid ise – leht toimib elava stiilijuhendina, kus iga nähtav element on nähtav disainielement.
Palett
Neutraalne
- Canvas
#f5f5f5— Lehe taust, summutatud pinnatäide, lisanupud. - Paper
#ffffff— Kaardipinnad, hüpikakende taustad, peamiste nuppude täidised - Surface Alt
#fafafa— Külgriba taust, märkamatu kaardivalik, sisestusvälja jõudeolek. - Ink
#0a0a0a— Põhitekst, pealkirjad, nuppude sildid, ikoonide kontuurid. - Ink Soft
#171717— Nuppude taustapildid täidisega, heledatel pindadel lisatekst. - Mid Gray
#737373— Põhitekst, kohatäitetekst, abisildid ja ikoonide täide puhkeolekus on kõik vaigistatud.
Tüpograafia
12-st 48 pikslini · 8 sammu
- Geist — asendamine: Inter · kontuurid 400, 500, 600 · Kogu liidesetekst – põhitekst reapaksusega 14px/400, pealkirjad reapaksusega 24–48px/600 ja nupud reapaksusega 13–14px/500. Geisti geomeetrilised tähekujud ja ühtlane reapaksus loovad arendustööriistadele neutraalse tunde; 600 reapaksus, 48px tähevahe ja -0,05em tähevahe tagavad selged ja enesekindlad pealkirjad, mis näevad välja läbimõeldud, mitte toimetatud.
Intervallid ja vorm
| Eesmärk | Tähendus |
|---|---|
| Tihedus | tihe |
| Põhisamm | 8px |
| Nupu raadius | 18px |
| Kaardi raadius | 24px |
| Varjud | ei - varjude asemel äärised |
| Sektsioonide vahel | 48-80px |
| Lehe laius | 1280px |
Tehisintellekt loob teie veebisaidi Ui stiilis ja täidab selle
- Täida toodete ja postitustega lingi kaudu - Instagram, TikTok, Facebook.
- Kanna sisu oma vanalt saidilt üle – täpsusta lihtsalt aadress.
- Moodne disain parimal mootoril: React ( Next.js) koos serveri renderdamise ja SEO optimeerimisega koheselt.
- Täisautomaatne SEO optimeerimine otsingutulemuste ja närvivõrgu soovituste jaoks.
Sarnased stiilid
- Ventriloc — Toimetuse andmete vaatluskanal soojal paberil - üks oranž sütt, mis rõhutab mustvalget täpsust
- Geniestudio — Pehme päevavalgusmärkmik – selline, millel on laiad veerised ja üks paks pliiatsitõmme
- xAI — Soe kreemilabor musta tabletiga
- Cal — Monokroomne praktilisus, inimlik lähenemine. Süsteem, mis seab range mustvalge paleti kaudu esikohale selguse ja funktsionaalsuse, kuid pehmendab seda sõbraliku tüpograafia ja ümarate vormidega.
- Scale — Kvaliteetne muuseumikvaliteediga fotolabor koos tehnilise projektiga
- Contractbook — kreemika paberi lepingud ultramariinise taeva all
- AutoSend — Hubane kivistuudio üheainsa lilla tulega – kus serif-värvi pealkirjad ja erksad indigosinised üleskutsed tegutsemisele eksisteerivad koos ühes vaikses, peaaegu valges ruumis.
- Air — skulptuur "Kesköötaevas läbi klaasi"
- SpatialChat — lilla pulss valgel pärgamendil
- Squarespace — Kino mustvalge galerii
- Giga — Kesköö horisont härmas obsidiaani kohal
- Supabase — Keskööl olev koodiredaktor fosforestseeruva rohelise täpiga – üks kromaatiline pulss söetolmu merel