Column
մուգ կապույտ գրքույկ զով լուսաբացի տակ
«Սյունակը» գրեթե սպիտակ ֆոնի վրա օգտագործում է խորը, ինստիտուցիոնալ մուգ կապույտ գույն. էջը սկզբում զգացվում է որպես ամուր բանկային ապրանքային մակերես, իսկ հետո՝ որպես մշակողի խաղահրապարակ: Ապրանքանիշի գույնը մեկ գույն չէ, այլ համակարգված զույգ՝ մուգ կապույտ #111a4a՝ լուրջ կառուցվածքի համար, անանուխի կանաչ #44b48b՝ տվյալների և կոդի համար՝ մեկ տաք նարնջագույնով (#ec652b), որը նախատեսված է բարձր ինտենսիվության շեշտադրման մակերեսների համար, ինչպիսին է Brex քարտը: Տիպագրության մեջ գերակշռում է SuisseIntl-ը՝ երկրաչափական sans serif, որն օգտագործվում է ամբողջ քաշի միջակայքում՝ 300-ից (հղումներ) մինչև 600 (ցուցադրում), համակարգին տալով նուրբ, խմբագրական ոճ, որը բացակայում է ֆինտեխ ընկերությունների մեծ մասում: Քարտերը լողում են մեծ սպիտակ մակերեսների վրա՝ նուրբ, շերտավոր ստվերներով. ինտերֆեյսի տարրերի մեծ մասը հարթ է, խորությունը երևում է միայն այնտեղ, որտեղ քարտը պետք է զգացվի որպես ֆիզիկական օբյեկտ (գործարքների վիջեթներ, ապրանքի մակետներ): Կոդը և ֆինանսական տվյալները ներկայացված են մոնոխրոմ, ծովի փրփուրի գույնի՝ տեսողական ազդանշան, որ սա ինժեներների կողմից ինժեներների համար կառուցված բանկ է:
Էջի կառուցվածքը լիալայնք է, կենտրոնացված լայն կողային լուսանցքներով (64–15 սմ աշխատասեղանի վրա): Գլխավոր էկրանը բաժանված դասավորություն ունի. վերնագիրը և գործողության կոչերը ձախից հավասարեցված են 25 սմ-ի վրա, մինչդեռ լողացող գործարքի վիջեթը տեղադրված է աջ կողմում՝ 55 սմ-ի վրա՝ կիսատոն քարտեզի ֆոնի վրա: Գլխավոր էկրանի տակ բաժինները հերթագայում են սպիտակ (4 սմ) և բաց կտավի (5 սմ) միջև՝ 6 սմ ուղղահայաց ջրանցքներով: Պարունակությունը դասավորված է մեկ 6-սյունակ ցանցի համաձայն. տեքստային բլոկները զբաղեցնում են 4 սյունակ (7 սմ), պատկերի/արտադրանքի քարտերը՝ 5–6 սյունակ՝ ցանցից միտումնավոր շեղումով: Հատկանիշները նկարագրող բաժինները օգտագործում են 2-սյունակ դասավորություն. տեքստը՝ ձախ կողմում, ապրանքը՝ աջ կողմում: Վստահության վիճակագրության բաժինը բաժանված է 4-սյունակ ցանցի՝ էջի ամբողջ լայնությամբ: Հաճախորդների լոգոները տեղակայված են մեկ կենտրոնացված շարքում՝ 48px ջրանցքներով: Ստորին մասը ունի կոմպակտ երկսյունակ դասավորություն: Նավիգացիան գլխավոր էկրանի վերևում գտնվող ֆիքսված, 62px բարձրությամբ, թափանցիկ վերին գոտի է՝ մշուշոտ ֆոնով, որը գլորելիս սպիտակում է։ Կողային գոտի կամ մեգա-մենյու չկա. իջնող ցանկերը պարզ սլաքաձև ցանկեր են։
Տեսողական ոճը մինիմալիստական և ֆունկցիոնալ է. «Սյունակ»-ը լիովին խուսափում է արխիվային լուսանկարչությունից: Տեսողական լեզուն կառուցված է երեք աղբյուրների վրա՝ (1) SVG տվյալների նկարազարդումներ, մասնավորապես՝ կետավոր կիսատոն աշխարհի քարտեզ, որը ներկայացված է ինդիգոից նարնջագույնից մինչև փիրուզագույն գրադիենտով, ստեղծելով գլոբալ մասշտաբի մթնոլորտ հիմնական տարրի հետևում. (2) ապրանքի քարտի դասավորություններ՝ լողացող վիջեթներ, որոնք ցուցադրում են հաշվի մնացորդները, փոխանցման մանրամասները և JSON կոդի հատվածները սպիտակ քարտերում՝ դրամատիկ ստվերներով. (3) գրաֆիկների վիզուալիզացիաներ՝ փիրուզագույն մոմակալ կամ սյունակային գրաֆիկներ՝ բարակ միացնող գծերով, որոնք օգտագործվում են վստահության/վիճակագրության բաժնում: Կիսատոն քարտեզը ստորագրության տեսողական տարր է. դրա գրադիենտը անցում է կատարում #d65620-ից (նարնջագույն) մինչև մանուշակագույն, կապույտ, երկնագույն, փիրուզագույն և դեղին, ստեղծելով սպեկտր, որը միավորում է ամբողջ ապրանքանիշի պալիտրան մեկ դեկորատիվ մակերեսի վրա: Պատկերակները ունեն 1.5–2px միատարր ուրվագծի հաստություն #232730 կամ #a9acb6 տարբերակներում՝ ակտիվ վիճակների համար լրացմամբ: Առանց կենսակերպի լուսանկարներ, առանց աբստրակտ 3D ռենդերինգի. սահմանափակումը միտումնավոր է՝ ուշադրությունը կենտրոնացնելու ապրանքի և տվյալների վրա։
Պալիտրա
Բրենդ
- Indigo Navy
#111a4a— Հիմնական ապրանքանիշի գույնն օգտագործվում է գործողության կոչերի, ակտիվ նավիգացիայի վիճակների, վերնագրի և լոգոյի համար: Մուգ մանուշակագույն-կապույտ գույնը կայքին հաղորդում է ամուր, բայց հարուստ սև երանգ. սպիտակ տեքստի հետ զուգակցվելով՝ այն ստեղծում է կայքի ամենաազդեցիկ կոճակը: - Seafoam 600
#44b48b— Կոդի և տվյալների գույնը JSON բանալիների, նույնականացուցիչների և կոդի հատվածներում ֆինանսական արժեքների ապրանքանիշային գույնն է: Այն նաև օգտագործվում է տվյալների կետերի համար գծապատկերներում և աճի վիզուալիզացիաներում: - Seafoam 700
#167e6c— Ծովափրփուրի ավելի մուգ երանգ՝ տվյալների համատեքստում ուրվագծի, գծապատկերի գծերի և պատկերակների շեշտադրումների համար: Սա ծովափրփուրի մասշտաբը ամրացնում է ավելի մուգ ֆոնի վրա: - Seafoam 400
#94efb7— Կոդի ընդգծված հատվածը պարունակում է տողային արժեքներ, URL-ներ և API վերջնակետեր կոդի բլոկների ներսում: Ամենաբաց ծովափրփուրի գույնը կարդացվում է որպես կանաչավուն երանգով միատարր տառատեսակ: - Deep Sea
#023247— Դիագրամի դեկորատիվ ուրվագիծը և շեշտադրման գույնը հարուստ փիրուզագույն գույնն է, որն օգտագործվում է SVG նկարազարդումներում և տվյալների վիզուալիզացիաներում, ինչպես նաև ծովի փրփուրի գունային գամման։
Չեզոք
- Midnight Ink
#011821— Մուգ մակերես և ընդգծված տեքստ՝ ապրանքի քարտի ֆոն, բարձր կոնտրաստով հիմնական տեքստ։ Մոխրագույնին ավելի մոտ՝ սառը կապտա-կանաչ երանգով։ Օգտագործվում է որպես մուգ ռեժիմի հիմք, երբ անհրաժեշտ է շրջել որևէ բաժին։ - Slate Ink
#3b3e47— Երկրորդական վերնագիրը և հիմնական տեքստը մի փոքր ավելի տաք են, քան «Կեսգիշերային թանաքը», որն օգտագործվում է այնտեղ, որտեղ մաքուր սևը չափազանց կոպիտ կթվար բաց կտավի վրա։ - Steel
#7c7f88— Հիմնական տեքստում և հղման տեքստում գերակշռում է խլացված գույնը (հիմնական տեքստում օգտագործվել է 245 անգամ): Չեզոք մոխրագույն-կապույտ գույն, որը ընկալվում է որպես հանգիստ, երբեք՝ որպես գունաթափված պատկեր: - Fog
#a9acb6— Պատկերակների ուրվագծեր, երրորդային սահմաններ և տեղապահ տեքստ: Միջին մոխրագույն գույն, որը առանձնացնում է տեքստը՝ առանց մրցակցելու դրա հետ: - Mist
#cbcccf— Հիմնական տեքստը՝ ստորագրությունները, հրաժարագրերը և մանր տառերով գրվածները, ընթեռնելի են սպիտակ ֆոնի վրա, բայց տեսողականորեն պակաս նկատելի։ - Silver Lining
#e3e4e8— Քարտի եզրագծեր, մուտքագրման դաշտերի եզրագծեր, բաժանարար գծեր: Այս կառուցվածքային, նուրբ գույնը օգտագործվում է այն դեպքերում, երբ երկու մակերեսները պետք է առանձնացվեն առանց ստվերների:
Տպագրություն
10-ից մինչև 60px · 10 քայլ
- SuisseIntl — փոխարինում: Inter · ուրվագծեր 300, 400, 500, 600 · Հիմնական տառատեսակ՝ օգտագործվում է բոլոր վերնագրերի, հիմնական տեքստի, կոճակների, նավիգացիայի, հղումների և քարտի տեքստի համար: Եզակի երկրաչափական sans serif-ը Column-ին հաղորդում է առանձնահատուկ խմբագրական ոճ, որը այն տարբերում է բացառապես Inter-only-ի հետ աշխատող այլ ֆինանսական տեխնոլոգիաների ընկերություններից: Վերնագրերի համար քաշը 600 է 52–60px-ի դեպքում, ենթավերնագրերի համար՝ 500, հիմնական տեքստի համար՝ 400 և ցածր շեշտադրմամբ հղումների համար՝ 300:
- SuisseIntlMono — փոխարինում: JetBrains Mono · ուրվագծեր 400 · SuisseIntl-ին նման միատարր տառատեսակ, որն օգտագործվում է տեխնիկական պիտակների, API նույնականացուցիչների և UI տարրերում ներդրված տվյալների համար: Այն պահպանում է SuisseIntl-ի նույն համամասնությունները, ուստի միատարր և համամասնական տեքստը ճիշտ են դասավորվում խառը համատեքստերում:
- SFMono — փոխարինում: Fira Code · ուրվագծեր 400 · Կոդի հատվածների ցուցադրում – ցուցադրվում է JSON օրինակներում և API փաստաթղթերի բլոկներում: Ծովափրփուրի երանգը օգտագործվում է կոդը UI տեքստից տեսողականորեն տարբերելու համար:
Ժամանակահատվածներ և ձև
| Նպատակ | Նշանակություն |
|---|---|
| Խտություն | միջին |
| Հիմնական քայլ | 8px |
| Կոճակի շառավիղ | 8px |
| Քարտի շառավիղ | 8px |
| Ստվերներ | ստվերների փոխարեն՝ առանց սահմանների |
| Բաժինների միջև | 72px |
| Էջի լայնությունը | 1200px |
Արհեստական բանականությունը կկառուցի ձեր կայքը Column ոճով և կլրացնի այն
- Լրացրեք ապրանքներով և գրառումներով՝ հղումով - Instagram, TikTok, Facebook:
- Տեղափոխեք բովանդակությունը ձեր հին կայքից՝ պարզապես նշեք հասցեն։
- Ժամանակակից դիզայն լավագույն շարժիչի վրա՝ React ( Next.js)՝ սերվերի ռենդերինգով և SEO օպտիմիզացիայով՝ անմիջապես։
- Լիովին ավտոմատացված SEO օպտիմալացում որոնման արդյունքների և նեյրոնային ցանցերի առաջարկությունների համար։
Նմանատիպ ոճեր
- dope.security — Կեսգիշերային տերմինալ՝ մանուշակագույն փարոսներով
- Leonardo — Շրջված խմբագրական պատկերասրահ։ Սև պատերով թանգարան, որտեղ մանուշակագույն վերնագրերը ծառայում են որպես պատի ինստալյացիաներ, իսկ ներքևում արհեստական բանականության կողմից ստեղծված դիմանկարները կախված են խիտ ցանցի մեջ։
- VEED — Սպիտակ պատկերասրահի պատ՝ նեոնային կանաչ լույսով կոճակներով
- Craft Docs — Սքրեփբուքինգի համար նախատեսված թվային կոլաժ: Դիզայնը նման է մտածված, շոշափելի սքրեփբուքի, որտեղ կառուցվածքային թվային նշումները համադրվում են մեղմ, օրգանական հյուսվածքների հետ:
- Letter — Մասնավոր պատկերասրահ, որտեղ ցուցադրվում են պահեստից վերցված փայլուն արտեֆակտներ: Սև պատերով ցուցասրահ, որտեղ պատկերասրահի մգեցված պատերին քրոմապատ քանդակների վերևում լողում են սրբապատկերներով զարդարված վերնագրեր:
- Railway — Տիեզերական կեսգիշերային ճեպընթաց։ Հանգիստ, հուզիչ ճանապարհորդություն մութ, աստղազարդ տիեզերքով, որը առաջնորդվում է հստակ ազդանշաններով։
- Garden Eight — Հուշարձանային խմբագրական՝ կրեմագույն թղթի վրա: 215px serif վերնագիրը առանձին դրված է տաք մագաղաթի վրա՝ շրջապատված լողացող քանդակային ձևերով և ծովի օդը հիշեցնող բացասական տարածությամբ. էջն ավելի շատ նման է արվեստի մենագրության շապիկի, քան վահանակի:
- Steep — Սերիֆ տառատեսակների վերլուծություն տաք թղթի վրա
- ElevenLabs — Լուսանկարչական ակնարկ տաք կրեմագույն երանգներով՝ նուրբ վերնագրերով: Բաուհաուսի ոճի տետր՝ ձվի կճեպի գույնի թուղթ, սև թանաք և մեկ մանուշակագույն ու նարնջագույն շեշտադրում ապրանքի ցուցադրման համար:
- Awesomic — Խմբագրական ցինկե ցանց՝ կոնֆետի հիշեցնող նարնջագույն կետադրական նշաններով
- Monad — խմբագրական տեխնիկական ամսագիր տաք մագաղաթի վրա
- AI for Business — Բրուտալիստական խմբագրական ցուցասրահ տաք մոխրագույն երանգներով