Column
yon liv ble fonse anba douvanjou fre a
Column itilize yon ble maren fonse, enstitisyonèl, sou yon background prèske blan: paj la santi l tankou yon sifas pwodwi bankè solid an premye epi yon lakou rekreyasyon pou devlopè apre. Koulè mak la pa yon sèl koulè, men yon pè kowòdone—ble maren #111a4a pou yon estrikti serye, vèt mant #44b48b pou done ak kòd—ak yon sèl zoranj cho (#ec652b) rezève pou sifas aksan entans tankou kat Brex la. Tipografi a domine pa SuisseIntl, yon sans serif jewometrik ki itilize sou tout seri pwa a soti nan 300 (lyen) rive nan 600 (ekspozisyon), sa ki bay sistèm nan yon style editoryal rafine ke pifò konpayi fintech pa genyen. Kat yo flote sou gwo sifas blan ak lonbraj sibtil, an kouch; pifò eleman koòdone yo plat, ak pwofondè ki parèt sèlman kote kat la ta dwe santi l tankou yon objè fizik (widjèt tranzaksyon, maket pwodwi). Kòd la ak done finansye yo prezante an monokrom, koulè kim lanmè—yon siyal vizyèl ke sa a se yon bank ki bati pa enjenyè pou enjenyè.
Estrikti paj la se plen lajè, santre ak maj bò laj (64–15 cm sou òdinatè). Ekran prensipal la gen yon layout divize: tit la ak apèl a aksyon yo aliyen agoch a 25 cm, pandan yon widjèt tranzaksyon k ap flote pozisyone adwat a 55 cm sou yon background kat demi-ton. Anba ekran prensipal la, seksyon yo altène ant twal blan (4 cm) ak twal lejè (5 cm) ak ti maj vètikal 6 cm. Kontni an ranje dapre yon sèl griy 6 kolòn: blòk tèks yo okipe 4 kolòn (7 cm), kat imaj/pwodwi yo okipe 5–6 kolòn, ak yon dekalaj volontè soti nan griy la. Seksyon ki dekri karakteristik yo itilize yon layout 2 kolòn: tèks sou bò gòch la, pwodwi sou bò dwat la. Seksyon estatistik konfyans lan divize an yon griy 4 kolòn sou tout lajè paj la. Logo kliyan yo sitiye nan yon sèl ranje santre ak ti maj 48px. Pye paj la gen yon layout kontra enfòmèl ant de kolòn. Navigasyon an se yon ba fiks, transparan, ki mezire 62 piksèl wotè, anlè ekran prensipal la avèk yon background flou ki vin blan pandan w ap defile. Pa gen okenn ba bò oswa mega-meni—menu deroulant yo se meni senp ki gen fòm flèch.
Stil vizyèl la minimalist e fonksyonèl—Column evite nèt fotografi stock. Langaj vizyèl la bati sou twa sous: (1) ilistrasyon done SVG, espesyalman yon kat jeyografik mondyal demi-ton pwentiye, rann ak yon gradyan soti nan digo rive nan zoranj rive nan turkwaz, kreye yon atmosfè echèl mondyal dèyè eleman prensipal la; (2) mizajou kat pwodwi—widjèt k ap flote ki montre balans kont, detay transfè, ak ekstrè kòd JSON nan kat blan ak lonbraj dramatik; (3) vizyalizasyon tablo—chandelye turkwaz oswa tablo ba ak liy koneksyon mens yo itilize nan seksyon konfyans/estatistik yo. Kat demi-ton an se yon eleman vizyèl siyati—gradyan li fè tranzisyon soti nan #d65620 (zoranj) rive nan vyolèt, ble, ble ble, turkwaz, ak jòn, kreye yon spectre ki ini tout palèt mak la sou yon sèl sifas dekoratif. Ikòn yo gen yon epesè kontou inifòm 1.5–2px nan varyant #232730 oswa #a9acb6 yo, ak yon ranpli pou eta aktif yo. Pa gen foto mòd vi, pa gen rann 3D abstrè—restriksyon an fèt espre pou atire atansyon sou pwodwi a ak done yo.
Palèt
Mak
- Indigo Navy
#111a4a— Koulè prensipal mak la itilize pou apèl a aksyon ki ranpli, eta navigasyon aktif yo, antèt la, ak logo a. Koulè ble-vyolèt fonse a bay sit la yon koulè nwa solid men rich; ansanm ak tèks blan, li kreye bouton ki pi asistif sou sit la. - Seafoam 600
#44b48b— Koulè kòd ak done se koulè mak pou kle JSON, idantifikatè, ak valè finansye nan ekstrè kòd. Li itilize tou pou pwen done nan tablo ak vizyalizasyon kwasans. - Seafoam 700
#167e6c— Yon koulè kim lanmè pi fonse pou kontou a, liy tablo a, ak aksan ikòn yo nan kontèks done yo. Sa ankre echèl kim lanmè a sou background ki pi fonse a. - Seafoam 400
#94efb7— Fragman kòd ki make a gen ladan l valè chèn, URL, ak pwen final API nan blòk kòd yo. Koulè kim lanmè ki pi lejè a li kòm yon polis monospaced ak yon tente vèt. - Deep Sea
#023247— Kontou dekoratif la ak koulè aksan tablo a se yon koulè turkwaz rich yo itilize nan ilistrasyon SVG ak vizyalizasyon done, ansanm ak echèl koulè kim lanmè a.
Netral
- Midnight Ink
#011821— Sifas nwa ak tèks make - background kat pwodwi a, tèks prensipal ki gen anpil kontras. Pi pre gri ak yon ti koulè ble-vèt fre; yo itilize li kòm baz pou mòd nwa lè yon seksyon bezwen envèse. - Slate Ink
#3b3e47— Tit segondè a ak tèks prensipal la yon ti jan pi cho pase Midnight Ink, yo itilize kote nwa pi ta sanble twò di sou twal lejè a. - Steel
#7c7f88— Tèks prensipal la ak tèks lyen an domine pa yon koulè mat (itilize 245 fwa nan tèks prensipal la). Yon koulè gri-ble net ke yo wè kòm kalm, pa janm yon imaj ki pa klere. - Fog
#a9acb6— Kontour ikon, fwontyè twazyèm pati, ak tèks espas vid. Yon koulè gri mwayen ki separe tèks la san li pa fè konpetisyon avè l. - Mist
#cbcccf— Tèks prensipal la—siyati, avètisman, ak ti lèt—lizib sou yon fon blan, men li mwens aparan vizyèlman. - Silver Lining
#e3e4e8— Fwontyè kat, fwontyè chan pou antre, liy divizyon. Koulè estriktirèl ak sibtil sa a itilize kote de sifas bezwen separe san lonbray.
Tipografi
soti nan 10 a 60px · 10 etap
- SuisseIntl — ranplasman: Inter · plan 300, 400, 500, 600 · Font prensipal la – yo itilize li pou tout tit yo, kò tèks la, bouton yo, navigasyon an, lyen yo, ak tèks kat yo. Sans serif jewometrik inik la bay Column yon stil editoryal diferan, sa ki fè l diferan de lòt konpayi fintech k ap travay sèlman avèk Inter-only. Pwa a se 600 a 52–60px pou tit yo, 500 pou soutit yo, 400 pou kò tèks la, ak 300 pou lyen ki pa twò enpòtan.
- SuisseIntlMono — ranplasman: JetBrains Mono · plan 400 · Yon polis monospaced menm jan ak SuisseIntl, yo itilize pou etikèt teknik, idantifikatè API, ak done entegre nan eleman UI. Li kenbe menm pwopòsyon ak SuisseIntl, kidonk tèks monospaced ak pwopòsyonèl aliyen kòrèkteman nan kontèks melanje.
- SFMono — ranplasman: Fira Code · plan 400 · Ekspozisyon ekstrè kòd – parèt nan egzanp JSON ak blòk dokimantasyon API yo. Yo itilize yon lonbraj kim lanmè pou distenge kòd la vizyèlman ak tèks koòdone itilizatè a.
Entèval ak fòm
| Objektif | Siyifikasyon |
|---|---|
| Dansite | mwayèn |
| Etap debaz | 8px |
| Reyon bouton | 8px |
| Reyon kat | 8px |
| Lonbray | pa gen fwontyè olye de lonbraj |
| Ant seksyon yo | 72px |
| Lajè paj la | 1200px |
IA ap bati sit entènèt ou a nan style Column epi ranpli li.
- Ranpli ak pwodwi ak piblikasyon atravè lyen an - Instagram, TikTok, Facebook.
- Transfere kontni ki soti nan ansyen sit ou a—jis presize adrès la.
- Design modèn sou pi bon motè a: React ( Next.js) ak rann sèvè ak optimize SEO pare pou itilize.
- Optimizasyon SEO konplètman otomatik pou rezilta rechèch ak rekòmandasyon rezo newòn.
Stil ki sanble
- dope.security — Tèminal minwi ak baliz koulè mov
- Leonardo — Yon galeri editoryal envèse. Yon mize ak mi nwa kote tit mov yo sèvi kòm enstalasyon sou miray, epi pòtrè ki pwodui pa entèlijans atifisyèl yo pandye nan yon griy dans anba a.
- VEED — Miray galeri blan ak bouton limyè vèt neon
- Craft Docs — Yon kolaj dijital pou scrapbooking. Desen an sanble ak yon scrapbook byen panse ak taktil, kote nòt dijital estriktire konbine avèk teksti mou ak òganik.
- Letter — Yon galeri prive ki prezante objè briyan ki soti nan depo. Yon espas ekspozisyon ak mi nwa kote tit ak serife yo ap flote anlè eskilti chrome sou mi tente galeri a.
- Railway — Eksprès Kosmik Minwi a. Yon vwayaj kalm ak kaptivan nan yon espas fènwa ak plen zetwal, gide pa siyal klè.
- Garden Eight — Yon editoryal monimantal sou papye koulè krèm. Tit serif 215px la chita poukont li sou yon parchemin cho, antoure pa fòm eskilti k ap flote ak espas negatif ki fè sonje lè lanmè—paj la sanble plis ak kouvèti yon monografi atistik pase yon tablodbò.
- Steep — Analiz Polis Serif sou Papye Cho
- ElevenLabs — Yon redaksyon foto nan ton krèm cho ak tit sibtil. Yon kaye style Bauhaus—papye koulè kokiy ze, lank nwa, ak yon sèl aksan mov ak zoranj pou montre pwodwi a.
- Awesomic — May zenk editoryal ak mak ponktiyasyon zoranj ki fè moun panse ak konfeti
- Monad — jounal teknik editoryal sou parchemin cho
- AI for Business — Chanm editoryal britalist nan ton gri cho