Ui
daim ntawv qhia kev kho mob ntawm daim ntawv matte
shadcn/ui yog ib lub chaw ua haujlwm rau kev tsim ib lub tshuab tsim monochrome: ib daim ntaub dawb huv, cov nplaim grey sov so, thiab cov ntawv loj loj uas nyob rau ntawm cov ciam teb me me. Lub interface yuav luag tsis muaj xim - cov ntawv dub, cov nplaim dawb, cov xim grey thib ob - nrog rau ib xim liab uas tsis zoo rau cov xwm txheej yuam kev thiab tsis muaj dab tsi ntxiv. Cov ntawv sau cia rau Geist txoj kev tsis sib xws geometric nrog cov ntawv siab ntawm cov ntxaij vab tshaus, tsim kom muaj kev thaj yeeb, zoo li code uas zoo li cov khoom siv tsim kho dua li cov khoom siv rau cov neeg siv khoom.
Cov duab tsawg kawg nkaus—lub kaw lus muaj yuav luag tag nrho ntawm tus neeg siv interface. Tsis muaj cov duab tseem ceeb, cov duab kos, lossis cov duab kho kom zoo nkauj. Cov khoom demos tau nthuav tawm ua cov khoom sib xyaw mockups (daim npav, cov teb nkag, cov nyees khawm) hauv ib daim phiaj, ua haujlwm ua cov ntaub ntawv thiab cov ntsiab lus pom. Cov cim yog cov kab geometric nyias (tej zaum qiv los ntawm Lucide) 1.5–2px tuab hauv #0a0a0a lossis #737373, siv tsawg tsawg ua cov cim ua haujlwm. Cov lus pom yog cov khoom UI lawv tus kheej—nplooj ntawv ua haujlwm ua tus qhia kev ua neej, qhov twg txhua yam khoom pom yog cov khoom tsim pom.
Xim av
Nruab nrab
- Canvas
#f5f5f5— Keeb kwm yav dhau ntawm nplooj ntawv, qhov chaw tsis muaj suab nrov, cov nyees khawm ntxiv. - Paper
#ffffff— Cov nto ntawm daim npav, cov keeb kwm yav dhau los uas tshwm sim, cov nyees khawm tseem ceeb - Surface Alt
#fafafa— Keeb kwm yav dhau ntawm sidebar, kev xaiv daim npav tsis pom tseeb, lub xeev tsis ua haujlwm ntawm daim teb nkag. - Ink
#0a0a0a— Cov ntawv tseem ceeb, cov npe, cov ntawv lo rau ntawm lub pob, cov duab qhia ntawm cov cim. - Ink Soft
#171717— Cov duab keeb kwm yav dhau los ntawm khawm nrog kev sau, cov ntawv ntxiv rau ntawm cov chaw kaj. - Mid Gray
#737373— Cov ntawv tseem ceeb, cov ntawv qhia chaw, cov ntawv cim pabcuam, thiab cov cim sau thaum so yog muted tag nrho.
Kev sau ntawv
txij li 12 mus rau 48px · 8 kauj ruam
- Geist — hloov: Inter · cov qauv qhia 400, 500, 600 · Txhua cov ntawv nyeem interface—cov ntawv nyeem lub cev nrog qhov hnyav ntawm kab ntawm 14px/400, cov npe nrog qhov hnyav ntawm kab ntawm 24–48px/600, thiab cov nyees khawm nrog qhov hnyav ntawm kab ntawm 13–14px/500. Geist cov ntawv geometric thiab qhov hnyav ntawm kab sib npaug tsim kom muaj kev xav tsis zoo rau cov cuab yeej tsim tawm; qhov hnyav ntawm kab 600 nrog qhov sib nrug ntawm tsab ntawv 48px thiab qhov sib nrug ntawm tsab ntawv -0.05em ua kom cov npe meej, ntseeg siab uas zoo li xav txog dua li kho.
Lub sijhawm thiab daim ntawv
| Lub Hom Phiaj | Lub ntsiab lus |
|---|---|
| Qhov Ceev | ntom ntom |
| Kauj ruam yooj yim | 8px |
| Lub vojvoog ntawm lub pob | 18px |
| Lub vojvoog ntawm daim npav | 24px |
| Duab ntxoov ntxoo | tsis muaj ciam teb es tsis yog duab ntxoov ntxoo |
| Nruab nrab ntawm cov ntu | 48-80px |
| Qhov dav ntawm nplooj ntawv | 1280px |
AI yuav tsim koj lub vev xaib hauv hom ntawv Ui thiab sau nws
- Sau cov khoom thiab cov ntawv tshaj tawm los ntawm qhov txuas - Instagram, TikTok, Facebook.
- Hloov cov ntsiab lus ntawm koj lub xaib qub - tsuas yog qhia qhov chaw nyob xwb.
- Tsim qauv niaj hnub ntawm lub cav zoo tshaj plaws: React ( Next.js) nrog rau kev ua haujlwm ntawm lub server thiab kev ua kom zoo dua SEO tawm ntawm lub thawv.
- Kev ua kom zoo dua SEO tag nrho rau cov txiaj ntsig tshawb nrhiav thiab cov lus pom zoo ntawm neural network.
Cov qauv zoo sib xws
- Ventriloc — Ib daim ntawv sau txog cov ntaub ntawv ntawm daim ntawv sov - ib lub teeb txiv kab ntxwv uas qhia txog qhov tseeb ntawm cov xim monochrome
- Geniestudio — Ib phau ntawv sau mos mos thaum nruab hnub—hom ntawv uas muaj ntug dav thiab ib tus cwj mem tuab xwb
- xAI — Chav Ua Noj Qab Zib Sov nrog Tshuaj Dub
- Cal — Kev siv tau yooj yim ntawm cov xim monochrome, ib txoj kev uas tib neeg siv. Ib lub kaw lus uas muab qhov tseem ceeb rau qhov meej thiab kev ua haujlwm los ntawm kev siv cov xim dub thiab dawb nruj, tab sis ua kom nws mos dua nrog cov ntawv sau zoo thiab cov duab puag ncig.
- Scale — Ib lub chaw kuaj duab zoo li tsev khaws puav pheej ua ke nrog ib qho project txuj ci
- Contractbook — cov ntawv cog lus ntawm cov ntawv nplaum qab zib nyob rau hauv lub ntuj ultramarine
- AutoSend — Ib lub studio pob zeb zoo nkauj nrog ib lub teeb xim ntshav—qhov twg cov ntawv xov xwm serif thiab cov lus hu kom ua haujlwm ci ntsa iab nyob ua ke hauv ib qho chaw ntsiag to, yuav luag dawb.
- Air — duab puab "Ntuj Nruab Hnub Los Ntawm Iav"
- SpatialChat — lub plawv ntshav ntawm daim ntawv parchment dawb
- Squarespace — Duab thaij ntawm Cinematic Monochrome
- Giga — Lub qab ntuj tsaus ntuj hla lub frosted obsidian
- Supabase — Ib tug kws kho code thaum ib tag hmo nrog lub teeb ntsuab phosphorescent - ib lub teeb chromatic pulse ntawm ib lub hiav txwv ntawm cov hmoov av thee