Figma
chassis monochrome no ka haunaele chromatic
Hana ka interface ma ke ʻano he pahu hoʻonohonoho paʻa a kiʻekiʻe, e hāʻawi ana i ka mana ʻike piha i ka ʻike i hana ʻia e ka mea hoʻohana. ʻO ke kumu hoʻohālikelike he palette paʻa #000000 a i #ffffff, kahi e pale aku ai i nā aka hina hina ma ke ʻano o ka ʻokoʻa loa no nā palena mua a me nā kikokikona. Hoʻokumu ʻia ka hierarchy typographic ma ka nui a me ka hoʻokaʻawale ʻana o nā leka maikaʻi ʻole ma mua o nā ʻokoʻa kala, e hoʻololi ana i nā laina nui o ka kikokikona i nā poloka kiʻi paʻa. Hoʻokumu ka logic o ka radius palena i kahi dichotomy koʻikoʻi: ʻo nā "kui" waho 50px no nā mea hoʻokele honua e hoʻohālikelike me nā kihi 0px koʻikoʻi o nā pahu ʻike.
Hoʻokumu ʻia nā haku mele ma nā palena laulā kiʻekiʻe loa (1440px max) e kikowaena ana i ka viewport a hoʻokomo pū i nā hui mānoanoa o ka ʻike i hoʻokaʻawale ʻia e ka macro-space nui (96-120px o ka whitespace ma waena o nā ʻāpana). Hoʻohana pinepine ka archetype "hero" i kahi hale kiʻi asymmetrical o nā kiʻi i hoʻopaʻa ʻia ma lalo o kahi poloka UI lana, kūpono i waenakonu. Ma lalo o ka ʻili, kūlike koke ka ʻike i kahi grid ʻehā kolamu paʻa me ka ʻole o nā palena, e hoʻopili ana i nā hui kāleka hou, e hoʻonui ana i ka nui o nā mea me ka hoʻopau ʻana i nā palena mai ka mōlina.
Hoʻokumu ʻia ka hoʻolālā ʻike maka ma nā hopena i kālele ʻia e ka mea hoʻohana. Hōʻike ʻia nā kiʻi ma ke ʻano he mau huinahā pālahalaha, ʻaʻohe kiʻi a i ʻole nā ʻāpana i hoʻopuehu ʻia, e uhi ana, e hoʻomanaʻo ana i nā mea kino, e kūʻē i kahi kua ʻike ʻole ʻia a hakahaka. ʻO nā kiʻi wale nō ke kumu o ke kala ma ka pūnaewele. ʻAʻohe mea paʻi kiʻi nohona a i ʻole nā kiʻi maʻamau o nā ʻoihana—ʻo kēlā me kēia mea kiʻi he kiʻi pololei a pololei o kahi canvas kikohoʻe, e hana like ana ma ke ʻano he hōʻoia huahana a me kahi mea aesthetic mua.
Paleta
Lama
- Context Action Violet
#4d49fc— Ke kāhea mua i ka hana kūloko i loko o nā sub-panels - ho'ākāka kahi kala hoʻopau hoʻokahi i ke kiko kikowaena.
Kūlike ʻole
- Absolute Canvas
#ffffff— Ka hope o ka ʻaoʻao, nā pahu hana lana, nā kumu panel i hoʻokiʻekiʻe ʻia. - Structural Ink
#000000— Momi kumu maʻamau, hope pihi paʻa, nā kiʻi pihi. - Graphite Metadata
#595959— Kikokikona kākau lua, kikokikona kūloko, nā waiwai placeholder - Boundary Frame
#e2e2e2— Nā mea hoʻokaʻawale maalea a me nā palena o ke kahua hoʻokomo hana ʻole. - Angular Teal
#33dfdf— Nā hopena hoʻonaninani, nā ʻōuli hoʻouka a me ka nānā ʻana i ka cursor hana.
Palapala hoʻopili
mai 12 a i 72px · 6 mau ʻanuʻu
- figmaSans — pani: Inter · nā hoʻolālā 320, 330, 340, 400, 450, 480, 520, 700 · He mea hana honua e hoʻokele i nā mea āpau mai nā poʻo inoa hōʻike a hiki i nā lepili hoʻokele. Hoʻokumu ia i kahi hiʻohiʻona kū hoʻokahi ma ka hoʻololi ʻana i ka hahai ʻana i ka maikaʻi ʻole o ka optical.
- figmaMono — pani: JetBrains Mono · nā hoʻolālā 400 · ʻO nā microtags, ka nānā ʻana i ka hoʻonohonoho ʻana, a me nā ʻano loea e hana nui aku ana ma ke ʻano he mau mea o ka pilina mea hoʻohana ma mua o ka ʻike.
Nā wā a me ke ʻano
| Kumu | Manaʻo |
|---|---|
| Ka nui o ka paʻa | mānoanoa |
| Kaʻanuʻu kumu | 24px |
| Ka radius o ke pihi | 8px |
| Ka laulā o ke kāleka | 12px |
| Nā aka | ʻaʻohe - nā palena ma kahi o nā aka |
| Ma waena o nā ʻāpana | 96-120px |
| Ka laulā o ka ʻaoʻao | 1440px |
E kūkulu ʻo AI i kāu pūnaewele ma ke ʻano Figma a hoʻopiha iā ia
- E hoʻopiha me nā huahana a me nā pou ma o ka loulou - Instagram, TikTok, Facebook.
- E hoʻoili i ka ʻike mai kāu pūnaewele kahiko—e kuhikuhi wale i ka helu wahi.
- Hoʻolālā hou ma ka ʻenekini maikaʻi loa: React ( Next.js) me ka hoʻoili ʻana o ke kikowaena a me ka hoʻonui ʻana o SEO ma waho o ka pahu.
- Hoʻonohonoho piha ʻana i ka SEO no nā hopena hulina a me nā ʻōlelo paipai pūnaewele neural.
Nā kaila like
- Caldera — E hana i ke ahi ma luna o ka pōhaku lepo mehana. He palaki maka a mehana ka canvas, a ua like kēlā me kēia ʻāpana ʻalani me nā lanahu e puhi ana i kaomi ʻia i loko o ka ʻili.
- Vercel — Paʻi ʻia ke kikowaena ma ka pepa keʻokeʻo
- Dylanbrouwer — ʻO ka hale hana hao Brutalist i ka napoʻo ʻana o ka lā
- Headspace — He kihi olakino lā ma ka pepa mahana
- WHOOP — Keʻena hana hana i ke aumoe - nā papa hana keʻena lapaʻau keʻokeʻo ma lalo o kahi ʻole keaka ʻeleʻele, hoʻokahi pulse poni o ka uila
- (dot)connect — He kiʻi ʻenekinia Swiss me kahi ʻāpana lanahu hoʻokahi
- Together AI — Papa hana noiʻi ma ka pepa hau
- Vivid+Co — mālamalama prismatic ma o ka obsidian
- Sequel — ʻO kahi hōʻikeʻike pilikino ma hope o ka pōʻeleʻele wale nō ke kukui mehana i loko o kahi hale kiʻiʻoniʻoni pouli.
- v0 by Vercel — Ke kaha kiʻi ʻana o ka mīkini hana. He mea nui ka pololei a me ka hana pono, me kēlā me kēia mea e lawelawe ana i kahi kumu maopopo ma luna o kahi ʻili maʻemaʻe a kūpono hoʻi.
- ThoughtLab — He kia hoʻomanaʻo obsidian me kahi hōʻailona ʻulaʻula. He canvas o ka ʻeleʻele hakahaka, kahi o ka mea ʻulaʻula piha wale nō i loko o ka hale pule nui, i paʻi ʻia me nā leka keʻokeʻo nui, he kiʻi chromatic hoʻokahi.
- Dovetail — He kiʻi hoʻolālā ma lalo o ka mahina ʻeleʻele—nā laina kiʻi i ʻike iki ʻia, ka hua palapala keʻokeʻo, hoʻokahi ʻālohilohi poni