Vercel
വെളുത്ത പേപ്പറിൽ പ്രിന്റ് ചെയ്ത ടെർമിനൽ
വെർസെൽ ഡിസൈൻ സിസ്റ്റം അച്ചടക്കമുള്ള മോണോക്രോമിലെ ഒരു വ്യായാമമാണ്: വെളുത്ത നിറത്തോട് അടുത്ത ക്യാൻവാസ് (#fafafa), കറുത്ത ടൈപ്പ്, നേർത്ത ബോർഡറുകൾ, അലങ്കാര നിറങ്ങളുടെ പൂർണ്ണ അഭാവം. ദൃശ്യ ഭാഷ പ്രിന്റിൽ റെൻഡർ ചെയ്ത ഒരു ഡെവലപ്പറുടെ ടെർമിനലിനെ ഉണർത്തുന്നു - 400-450 ഭാരവും -0.06em അക്ഷര വിടവും ഉള്ള "ഹീറോയിക്" സ്കെയിലിൽ Geist Sans വളരെ വ്യക്തമല്ല, അതേസമയം Geist Mono 11-13px ക്യാപ്പുകളിൽ ലേബലുകൾ, മെറ്റാഡാറ്റ, കോഡ് സാമ്പിളുകൾ എന്നിവ പ്രയോഗിക്കുന്നു. ബട്ടണുകൾ വെളുത്ത നിറത്തിൽ ശുദ്ധമായ കറുപ്പിന്റെ മൂർച്ചയുള്ള 6px ആരങ്ങളോ ദീർഘചതുരങ്ങളോ അല്ലെങ്കിൽ കറുപ്പിൽ വെള്ളയോ ആണ്. സിസ്റ്റം നിറത്തേക്കാൾ കോൺട്രാസ്റ്റിനെയും ടൈപ്പോഗ്രാഫിക് ശ്രേണിയെയും ആശ്രയിക്കുന്നു, ത്രികോണ ചിഹ്നവും (▲) രണ്ട്-വരി വേഡ്മാർക്കും മാത്രമാണ് ബ്രാൻഡിംഗ് ഘടകങ്ങളായി ഉപയോഗിക്കുന്നത്. ഉപരിതലങ്ങൾ #fafafa → #ebebeb → #171717 എന്ന ക്രമത്തിൽ പരസ്പരം അടുക്കിയിരിക്കുന്നു, നിഴലിനോ നിറത്തിനോ പകരം ടോണൽ മൂല്യങ്ങൾ മാറ്റുന്നതിലൂടെ ആഴം സൃഷ്ടിക്കുന്നു. ഓരോ എലമെന്റും ഒതുക്കമുള്ള സാന്ദ്രതയുള്ള 4px ഗ്രിഡിലാണ് നിർമ്മിച്ചിരിക്കുന്നത്, അതിന്റെ ഫലമായി ഒരു എഞ്ചിനീയറുടെ നോട്ട്ബുക്കിനെ അനുസ്മരിപ്പിക്കുന്ന ഒരു ഇന്റർഫേസ് ലഭിക്കുന്നു - കൃത്യവും, പ്രവർത്തനപരവും, വെളുത്ത സ്ഥലത്തെ ഭയപ്പെടാത്തതും.
കണ്ടെയ്നർ 1280px വീതിയുള്ളതും മധ്യഭാഗത്തുള്ളതും വിശാലമായ തിരശ്ചീന പാഡിംഗുള്ളതുമാണ് (24-48px). പ്രധാന ബ്ലോക്ക് ഒരു അസമമായ മൂന്ന്-സോൺ കോമ്പോസിഷൻ ഉപയോഗിക്കുന്നു: ഇടതുവശത്ത് ഒരു വലിയ തലക്കെട്ട്, മധ്യഭാഗത്ത് ഒരു ബ്രാൻഡ് ഗ്ലിഫ്, വലതുവശത്ത് ഒരു "പുരികം" ബ്ലോക്ക്. പ്രധാന ബ്ലോക്കിന് താഴെ, ഉള്ളടക്കം ഒന്നിടവിട്ട വരകളായി ക്രമീകരിച്ചിരിക്കുന്നു: ക്ലയന്റിന്റെ ലോഗോയുള്ള ഒരു പൂർണ്ണ വീതിയുള്ള വര, തുടർന്ന് ഇടതുവശത്ത് തലക്കെട്ടും വലതുവശത്ത് ഒരു ഉൽപ്പന്ന ലേഔട്ടും ഉള്ള രണ്ട്-കോളം "ഏജന്റ് ക്രിയേറ്റേഴ്സ്" വിഭാഗം, തുടർന്ന് സവിശേഷതകളുള്ള മൂന്ന് കാർഡുകളുടെ ഒരു ഗ്രിഡ്. വിഭാഗങ്ങളെ ഡിവൈഡറുകളോ പശ്ചാത്തല ഓഫ്സെറ്റുകളോ ഇല്ലാതെ 96-128px ന്റെ ലംബ ഗട്ടറുകൾ ഉപയോഗിച്ച് വേർതിരിക്കുന്നു. മങ്ങിയ പശ്ചാത്തലമുള്ള ഒരു ഒറ്റ ഫിക്സഡ് 64px പാനലാണ് നാവിഗേഷൻ. കാർഡ് ഗ്രിഡുകൾ സ്ഥിരമായി 16-24px ഗട്ടറുകളുള്ള രണ്ടോ മൂന്നോ കോളം ലേഔട്ട് ഉപയോഗിക്കുന്നു. മൊത്തത്തിലുള്ള സാന്ദ്രത ഒതുക്കമുള്ളതാണ് - വാചകം വായിക്കാൻ എളുപ്പമാണ്, ധാരാളം വെളുത്ത ഇടമുണ്ട്, പക്ഷേ ഫോണ്ട് വലുപ്പവും ഘടക വലുപ്പങ്ങളും പേജ് വായുസഞ്ചാരമുള്ളതായി തോന്നുന്നത് തടയുന്നു.
ചിത്രങ്ങൾ വിരളവും എപ്പോഴും പ്രവർത്തനക്ഷമവുമാണ്. പ്രധാന ദൃശ്യ ഘടകം കറുത്ത ത്രികോണം (▲) ആണ് - "വലിയ" സ്കെയിലിൽ ഒരു ഹോവർ സിലൗറ്റായി ദൃശ്യമാകുന്ന ഒരു ജ്യാമിതീയ ബ്രാൻഡ് മാർക്ക്. പ്രൂഫ്-ഓഫ്-കൺസെപ്റ്റ് സ്ട്രിപ്പിലെ ക്ലയന്റ് ലോഗോകൾ ഗ്രേസ്കെയിലിൽ ഓരോ ബ്രാൻഡിന്റെയും യഥാർത്ഥ വേഡ്മാർക്കുകൾ ഉപയോഗിക്കുന്നു. ഉൽപ്പന്ന മോക്കപ്പുകൾ (നോഷന്റെ ചാറ്റ് ഇന്റർഫേസ്, CLI ടെർമിനൽ ഔട്ട്പുട്ട്, പാസ്പോർട്ട് കാർഡ്) ഫ്രെയിം ചെയ്ത കാർഡുകൾക്കുള്ളിൽ ലൈറ്റ്-മോഡ് സ്ക്രീൻഷോട്ടുകളായി ഉൾച്ചേർത്തിരിക്കുന്നു. ഫോട്ടോഗ്രാഫുകളോ ചിത്രീകരണങ്ങളോ 3D ഘടകങ്ങളോ ഇല്ല - സിസ്റ്റം ശുദ്ധമായ ടൈപ്പോഗ്രാഫിയും വെള്ള പേപ്പറിൽ ജ്യാമിതീയ രൂപങ്ങളുമാണ്.
പാലറ്റ്
നിഷ്പക്ഷം
- Obsidian
#171717— പ്രധാന തലക്കെട്ടുകൾ, നാവിഗേഷൻ ബോർഡറുകൾ, ഡാർക്ക് ബട്ടൺ ഫിൽ, ലിസ്റ്റ് മാർക്കറുകൾ എന്നിവയെല്ലാം ഏതാണ്ട് കറുത്ത നിറത്തിലാണ്, കാഠിന്യവും ഗാരിഷ് സാച്ചുറേഷനും ഒഴിവാക്കുന്നു. - Paper White
#fafafa— പേജ് ക്യാൻവാസ്, കാർഡ് പ്രതലങ്ങൾ, ബട്ടണുകളുടെ പ്രകാശം - മറ്റെല്ലാം സ്ഥിതിചെയ്യുന്ന സ്റ്റാൻഡേർഡ് പശ്ചാത്തലമാണിത്. - Pure White
#ffffff— ഉയർത്തിയ കാർഡ് പ്രതലങ്ങൾ, ഉൾപ്പെടുത്തലുകൾ, ഇൻപുട്ട് ഫീൽഡുകൾ. - Hairline
#ebebeb— ബട്ടണുകൾ, ലിങ്കുകൾ, കാർഡുകൾ എന്നിവയിലെ 1px ബോർഡറുകൾ ഉയർന്ന സൂം ലെവലുകളിൽ ദൃശ്യമാകും, പക്ഷേ കുറഞ്ഞ സൂം ലെവലുകളിൽ അദൃശ്യമായിരിക്കും. - Ash
#c9c9c9— ക്ലയന്റ് ലോഗോകളിൽ പ്രവർത്തനരഹിതമാക്കിയ വാചകം, നിശബ്ദമാക്കിയ ലേബലുകൾ, ബ്രാൻഡ് നാമ വാട്ടർമാർക്കുകൾ. - Smoke
#a8a8a8— ദ്വിതീയ വാചകം, പ്ലെയ്സ്ഹോൾഡർ വാചകം, സൂക്ഷ്മമായ ഐക്കൺ ഫിൽ.
ടൈപ്പോഗ്രാഫി
11 മുതൽ 64px വരെ · 6 ചുവടുകൾ
- Geist Sans — മാറ്റിസ്ഥാപിക്കൽ: Inter · രൂപരേഖകൾ 400, 450, 500 · ഇന്റർഫേസിനും ഹെഡിംഗുകൾക്കുമുള്ള പ്രാഥമിക ഫോണ്ട് വെർസലിൽ നിന്നുള്ള ഇഷ്ടാനുസരണം രൂപകൽപ്പന ചെയ്ത ജ്യാമിതീയ സാൻസ്-സെരിഫ് ആണ്, വലിയ വലുപ്പങ്ങളിൽ ഇടുങ്ങിയ അക്ഷര വിടവുകൾ (-0.06em at 56-64px, -0.05em at 30px). പേജിന്റെ മുകളിലുള്ള ഹെഡിംഗുകൾക്കായി, 450 വെയ്റ്റ് തിരഞ്ഞെടുത്തു: ലൈറ്റിനേക്കാൾ കട്ടിയുള്ളതും സെമി-ബോൾഡിനേക്കാൾ ഭാരം കുറഞ്ഞതും, ആത്മവിശ്വാസമുള്ളതും എന്നാൽ അമിതമായി സ്വാധീനിക്കാത്തതുമായ ഒരു ടോൺ സൃഷ്ടിക്കുന്നു.
- Geist Mono — മാറ്റിസ്ഥാപിക്കൽ: JetBrains Mono · രൂപരേഖകൾ 400, 500, 600 · അടിക്കുറിപ്പുകൾ, കോഡ് ബ്ലോക്കുകൾ, CLI ഔട്ട്പുട്ട് പാനലുകൾ, മെറ്റാഡാറ്റ, വലിയക്ഷര വാചകം എന്നിവയ്ക്കായി ഒരു മോണോസ്പേസ്ഡ് സെക്കൻഡറി ഫോണ്ട്. 8px/600px/അപ്പർകേസ് കോമ്പിനേഷൻ ചെറിയ വേഡ്മാർക്കുകളുടെ കൃത്യമായ സ്ഥാനം അനുവദിക്കുന്നു. മോണോസ്പേസ്ഡ് പതിപ്പിലെ വിശാലമായ അക്ഷര സ്പെയ്സിംഗ് (0.071em) വലിയക്ഷര വാചകത്തിന് മതിയായ ഇടം നൽകുന്നു.
ഇടവേളകളും രൂപവും
| ഉദ്ദേശ്യം | അർത്ഥം |
|---|---|
| സാന്ദ്രത | ഇടതൂർന്ന |
| അടിസ്ഥാന ഘട്ടം | 12px |
| ബട്ടൺ ആരം | 6px |
| കാർഡ് ആരം | 6px |
| ഷാഡോകൾ | ഷാഡോകൾക്ക് പകരം ബോർഡറുകൾ ഇല്ല |
| വിഭാഗങ്ങൾക്കിടയിൽ | 96-128px |
| പേജ് വീതി | 1280px |
AI നിങ്ങളുടെ വെബ്സൈറ്റ് Vercel ശൈലിയിൽ നിർമ്മിച്ച് അത് പൂരിപ്പിക്കും.
- Instagram, TikTok, Facebook ലിങ്കുകൾ വഴി ഉൽപ്പന്നങ്ങളും പോസ്റ്റുകളും പൂരിപ്പിക്കുക.
- നിങ്ങളുടെ പഴയ സൈറ്റിൽ നിന്ന് ഉള്ളടക്കം കൈമാറുക—വിലാസം മാത്രം വ്യക്തമാക്കുക.
- മികച്ച എഞ്ചിനിൽ ആധുനിക ഡിസൈൻ: സെർവർ റെൻഡറിംഗും SEO ഒപ്റ്റിമൈസേഷനും ഉള്ള React ( Next.js).
- തിരയൽ ഫലങ്ങൾക്കും ന്യൂറൽ നെറ്റ്വർക്ക് ശുപാർശകൾക്കുമായി പൂർണ്ണമായും ഓട്ടോമേറ്റഡ് SEO ഒപ്റ്റിമൈസേഷൻ.
സമാനമായ ശൈലികൾ
- Headspace — ചൂടുള്ള കടലാസിൽ ഒരു സണ്ണി വെൽനസ് കോർണർ
- WHOOP — അർദ്ധരാത്രിയിലെ പ്രകടന ലാബ് - കറുത്ത നാടക ശൂന്യതയ്ക്ക് കീഴിൽ വെളുത്ത ക്ലിനിക്കൽ ലാബ് ടേബിളുകൾ, പർപ്പിൾ നിറത്തിലുള്ള വൈദ്യുതി സ്പന്ദനം.
- Together AI — ഗ്ലേഷ്യൽ പേപ്പറിലെ ഗവേഷണ കൺസോൾ
- v0 by Vercel — ലെയ്ത്ത് ഡ്രോയിംഗ്. കൃത്യതയും പ്രവർത്തനക്ഷമതയും പരമപ്രധാനമാണ്, ഓരോ ഘടകവും വൃത്തിയുള്ളതും സാങ്കേതികമായി പൂർണ്ണവുമായ ഒരു പ്രതലത്തിൽ വ്യക്തമായ ഉദ്ദേശ്യം നിറവേറ്റുന്നു.
- Dovetail — കറുത്ത ചന്ദ്രനു കീഴെ ഒരു ബ്ലൂപ്രിന്റ് - കഷ്ടിച്ച് മാത്രം കാണാവുന്ന ഗ്രാഫ് ലൈനുകൾ, വെളുത്ത ഫോണ്ട്, ഒരു പർപ്പിൾ തിളക്കം
- Glideapps — ഒരു ഇലക്ട്രിക് ടർക്കോയ്സ് സ്പാർക്കിളുള്ള മോണോക്രോം ഡ്രാഫ്റ്റിംഗ് ടേബിൾ
- Timescale — ചൂടുള്ള ഗ്രാഫ് പേപ്പറിൽ എഞ്ചിനീയറിംഗ് ഡ്രോയിംഗ്
- UGLYCASH — ക്രീം നിറമുള്ള പേപ്പറിൽ സ്റ്റിക്കർ പതിച്ച ഒരു നോട്ട്ബുക്ക്, അതിന്റെ കുഴപ്പങ്ങൾ അഭിമാനത്തോടെ പ്രദർശിപ്പിക്കുന്ന ഒരു ധീരവും പരമാവധിയുമായ ഫിൻടെക്കിന്റെ അന്തരീക്ഷം പ്രസരിപ്പിക്കുന്നു.
- Sprout Social — കറുത്ത സ്ലേറ്റിൽ ഒരു പച്ച മുള. കർശനമായ മോണോക്രോം ക്യാൻവാസിൽ ഒരു തിളക്കമുള്ള ആക്സന്റ്, അതിന്റെ നിറം പ്രവർത്തനത്തിന് മാത്രം ഉപയോഗിക്കുന്നു, ആത്മവിശ്വാസമുള്ള ജ്യാമിതീയ ഫോണ്ട് സൂചനാബോർഡുകളായി പ്രവർത്തിക്കുന്നു.
- Krea — അർദ്ധരാത്രിയിലെ നോയർ ഗാലറി
- Evergreen — ലിനൻ പേപ്പറിൽ സോളാർ ഹരിതഗൃഹം
- Factory — അർദ്ധരാത്രിയിലെ "യുദ്ധമുറി" ടെർമിനൽ. "ഫാക്ടറി" എന്നത് കറുത്ത നിറത്തിലുള്ള ഒരു നിയന്ത്രണ പാനലാണ്, അവിടെ ഒരു വെളുത്ത കാർഡ് ഫ്ലാഷ്ലൈറ്റ് കത്തിച്ച ഡിസ്പാച്ച് പോലെ ലാൻഡ് ചെയ്യുന്നു - മുറിയിലെ ഒരേയൊരു കാര്യം ജോലി തന്നെയാണ്.