Modal
ഇരുണ്ട സെർവർ മുറിയിലെ ഒരു ഫോസ്ഫോറസെന്റ് ടെർമിനൽ - ഒരേയൊരു പ്രകാശ സ്രോതസ്സ് തിളക്കമുള്ള പച്ച നിറമാണ്.
ഇരുണ്ട സെർവർ മുറിയിലെ ഒരു ഫോസ്ഫോറസെന്റ് ടെർമിനൽ പോലെയാണ് മോഡൽ പ്രവർത്തിക്കുന്നത്: ഏതാണ്ട് കറുത്ത ക്യാൻവാസ്, ഇളം പച്ച തരം, എൽഇഡി സ്റ്റാറ്റസ് സൂചകമായി പ്രവർത്തിക്കുന്ന ഒറ്റ തിളക്കമുള്ള ലൈം-ഗ്രീൻ ആക്സന്റ്. ഡിസൈൻ ഭാഷ ഡെവലപ്പർ-കേന്ദ്രീകൃതമാണ്—ട്രാഫിക് ലൈറ്റ് ഡോട്ടുകളുള്ള മോണോസ്പേസ്ഡ് കോഡ് വിൻഡോകൾ, സിഗ്നേച്ചർ പച്ചയിൽ ഐസോമെട്രിക് 3D ഐക്കണുകൾ, ധാരാളം വെളുത്ത ഇടം, ഓരോ വിഭാഗത്തിലും ഒരു എലമെന്റ് തിളങ്ങാൻ അനുവദിക്കുന്നു. ടൈപ്പോഗ്രാഫി തലക്കെട്ടുകൾക്കായി ഒരു ഇച്ഛാനുസൃത ഫോണ്ടും (ഗോഗ) എല്ലാ UI ഘടകങ്ങൾക്കുമായി ഒരു വേരിയബിൾ ഫോണ്ടും (ഇന്റർ) ആയി തിരിച്ചിരിക്കുന്നു, രണ്ടും ഇടുങ്ങിയ നെഗറ്റീവ് ട്രാക്കിംഗ് ഉപയോഗിച്ച് സജ്ജീകരിച്ചിരിക്കുന്നു. നിറങ്ങൾ തുല്യമായി വിതരണം ചെയ്യുന്നു: മിക്ക സ്ക്രീനുകളും അക്രോമാറ്റിക് ആണ്, കൂടാതെ തിളക്കമുള്ള ലൈം-ഗ്രീൻ നിറം പ്രധാന പ്രവർത്തനങ്ങൾ, ലോഗോ, 3D ചിത്രീകരണങ്ങൾ, ഊന്നൽ നൽകുന്ന നിമിഷങ്ങൾ എന്നിവയിൽ മാത്രമേ ദൃശ്യമാകൂ. ഘടകങ്ങൾ പരന്നതും ഫ്രെയിംലെസ്സുമാണ്, നിഴലുകളേക്കാൾ സൂക്ഷ്മമായ പച്ച ബോർഡറുകളിലൂടെയും പശ്ചാത്തല മങ്ങലിലൂടെയും ആഴം സൃഷ്ടിക്കപ്പെടുന്നു.
ഉള്ളടക്കം ഉൾക്കൊള്ളുന്നതിനായി മോഡൽ പരമാവധി 1280px വീതിയുള്ള ഒരു പൂർണ്ണ വീതിയുള്ള ഇരുണ്ട ലേഔട്ട് ഉപയോഗിക്കുന്നു. ഹീറോ വിൻഡോ മധ്യഭാഗത്താണ്: ശീർഷകം (ആദ്യ വാചകം നാരങ്ങ പച്ച നിറത്തിൽ), ഒരു ഉപതലക്കെട്ട്, രണ്ട് കോൾ ടു ആക്ഷൻ, ഒരു വിഷ്വൽ ആങ്കറായി ഒരു 3D ഒബ്ജക്റ്റ് - സൈഡ്ബാറിൽ നിന്ന് ലേഔട്ട് വേർതിരിക്കാതെ. ഉള്ളടക്ക വിഭാഗങ്ങൾ ഒരു ഏകീകൃത താളം പിന്തുടരുന്നു: പുരിക ടാഗ് (വലിയ അക്ഷരങ്ങൾ, മോസ് 70) → ഗോഗ ശീർഷകം → മ്യൂട്ടുചെയ്ത ബോഡി ടെക്സ്റ്റ്, തുടർന്ന് സവിശേഷത വിവരണമുള്ള രണ്ട്-കോളം ലേഔട്ട് (ടെക്സ്റ്റ് + കോഡ്/വിഷ്വൽ കാർഡ്) അല്ലെങ്കിൽ മൂന്ന്-കോളം കാർഡുകളുടെ ഗ്രിഡ്. വിഭാഗങ്ങൾക്കിടയിലുള്ള ഗട്ടറുകൾ ഉദാരമാണ് - 80px. പേജ് ആഴത്തിലുള്ള ശൂന്യമായ (#000000) വരകൾക്കും അല്പം ഭാരം കുറഞ്ഞ പശ്ചാത്തല (#181818) വരകൾക്കും ഇടയിൽ മാറിമാറി വരുന്നു, ഒരു ലൈറ്റ് സെക്ഷൻ (#def0dd) പേജിന്റെ മധ്യത്തിൽ ഒരു വിഷ്വൽ ബ്രീത്തറായി ദൃശ്യമാകുന്നു. നാവിഗേഷനിൽ മങ്ങിയ പശ്ചാത്തലമുള്ള ഒരൊറ്റ, സ്ഥിരമായ മുകളിലെ ബാർ അടങ്ങിയിരിക്കുന്നു - സൈഡ്ബാറോ മെഗാ-മെനുവോ ഇല്ല. അടിക്കുറിപ്പ് ഒതുക്കമുള്ളതും ഇരുണ്ടതുമാണ്, മ്യൂട്ടുചെയ്ത പച്ച ലിങ്ക് നിരകളുമുണ്ട്. വാചക സാന്ദ്രത സുഖകരമാണ്: ഓരോ വിഭാഗത്തിനും മതിയായ ഇടം നൽകിയിട്ടുണ്ട്, കൂടാതെ കാർഡ് ഗ്രിഡുകൾ മൂന്ന് നിരകളിൽ കൂടുതൽ ഉപയോഗിക്കരുത്.
മോഡലിന്റെ ദൃശ്യഭാഷയെ രണ്ട് മോഡുകളായി തിരിച്ചിരിക്കുന്നു: 3D ഗ്ലോയിംഗ് പ്രോഡക്റ്റ് റെൻഡറുകൾ, ഡാർക്ക് കോഡ് വിൻഡോ മോക്കപ്പുകൾ. ബ്രാൻഡിന്റെ സിഗ്നേച്ചർ വിഷ്വൽ ശൈലിയായ പച്ച വെളിച്ചത്തിൽ ശൂന്യമായ ഇടം കുളിപ്പിക്കുന്ന ഒരു റേഡിയൽ ഗ്രേഡിയന്റ് ഹാലോയിൽ സജ്ജീകരിച്ചിരിക്കുന്ന മാർക്കറ്റിംഗ് ഗ്രേഡിയന്റ് (നാരങ്ങ പച്ച മുതൽ മരതകം വരെ) ഉപയോഗിച്ച് റെൻഡർ ചെയ്ത ഒരൊറ്റ 3D ക്യൂബാണ് ഫോക്കൽ പോയിന്റ്. ഇരുണ്ട പശ്ചാത്തലത്തിൽ ഒരേ നാരങ്ങ പച്ചയിൽ റെൻഡർ ചെയ്തിരിക്കുന്ന ഐസോമെട്രിക് 3D ഐക്കണുകൾ (ഒരു വയർഫ്രെയിം ക്യൂബ്, ഒരു സോളിഡ് സ്റ്റെയർകേസ്, ലെയറുകൾ) വർക്ക്ലോഡ് കാർഡുകളിൽ അടങ്ങിയിരിക്കുന്നു. ട്രാഫിക് ലൈറ്റ് ഡോട്ടുകൾ, ഫോസ്ഫോറസെന്റ് പാലറ്റിൽ മോണോസ്പേസ്ഡ് സിന്റാക്സ് ഹൈലൈറ്റിംഗ്, ഒരു മ്യൂട്ട് ചെയ്ത പച്ച ബോർഡർ എന്നിവയുള്ള ടെർമിനൽ വിൻഡോ കാർഡുകളായി കോഡും ബെഞ്ച്മാർക്ക് ഫലങ്ങളും അവതരിപ്പിക്കുന്നു - അവ ഒരു യഥാർത്ഥ കമാൻഡ്-ലൈൻ ഇന്റർഫേസിന്റെ സ്ക്രീൻഷോട്ടുകളോട് സാമ്യമുള്ളതാണ്. ക്ലയന്റ് ലോഗോകൾ ഒരൊറ്റ, കുറഞ്ഞ-കോൺട്രാസ്റ്റ് വരിയിൽ ഡീസാച്ചുറേറ്റഡ് പച്ച-ചാരനിറത്തിലുള്ള ലേബലുകളായി പ്രദർശിപ്പിക്കുന്നു, ഇത് ദൃശ്യ മത്സരമില്ലാതെ വിശ്വാസത്തെ സൂചിപ്പിക്കുന്നു. മൊത്തത്തിലുള്ള സാന്ദ്രത കുറവാണ്—മിക്ക പേജുകളിലും പ്രധാനമായും വാചകം അടങ്ങിയിരിക്കുന്നു, കൂടാതെ ചിത്രങ്ങൾ ഫോട്ടോഗ്രാഫുകളുടെ ഗ്രിഡുകളേക്കാൾ വ്യക്തിഗത ഫോക്കൽ പോയിന്റുകളായി അവതരിപ്പിക്കുന്നു. ഫോട്ടോഗ്രാഫുകളൊന്നുമില്ല; മുഴുവൻ വിഷ്വൽ സിസ്റ്റവും റെൻഡർ ചെയ്തിരിക്കുന്നു, ജ്യാമിതീയവും റേഡിയന്റുമാണ്.
പാലറ്റ്
ബ്രാൻഡ്
- Lime Pulse
#7fee64— കോർപ്പറേറ്റ് ഐഡന്റിറ്റിയുടെ പ്രധാന ഘടകങ്ങൾ ലോഗോ, മെയിൻ കോൾ ടു ആക്ഷൻ (CTA), ടാഗ് ഫില്ലിംഗ്, ആക്റ്റീവ് സ്റ്റേറ്റുകൾ, ചിത്രീകരണത്തിന്റെ അടിസ്ഥാന നിറം എന്നിവയാണ്.
നിഷ്പക്ഷം
- Phosphor White
#ddffdc— പ്രധാന വാചകം, ശീർഷക നിറം, ഐക്കൺ രൂപരേഖ, പൂരിപ്പിച്ച ബട്ടൺ വാചകം എന്നിവയാണ് പ്രധാന വായിക്കാവുന്ന ഉപരിതലം. - Void Black
#000000— പേജ് ക്യാൻവാസ്, ഏറ്റവും ആഴമേറിയ പശ്ചാത്തല പാളി - Ground Iron
#181818— പ്രധാന ബട്ടൺ ഫിൽ, ഇരുണ്ട ഭാഗങ്ങളിൽ കാർഡ് പ്രതലങ്ങൾ, ഉപയോക്തൃ ഇന്റർഫേസിന്റെ അടിസ്ഥാന പ്രതലം. - Carbon Veil
#212525— ഉയർന്ന പ്രതലങ്ങൾ, നാവിഗേഷൻ പശ്ചാത്തലം, നിലത്തേക്കാൾ അല്പം ഭാരം. - Circuit Border
#485346— പ്രധാന ഇന്ററാക്ടീവ് നേർത്ത വരയായ ഔട്ട്ലൈൻ/ഗോസ്റ്റ് ആക്ഷൻ ഫ്രെയിം, നിശബ്ദമാക്കിയ പച്ചകലർന്ന ചാരനിറത്തിലുള്ള ഷേഡാണ്. - Phosphor Blue-Black
#1f2a33— ഇരുണ്ട വരകൾക്കിടയിൽ സ്ട്രോക്കുകളെ വിഭജിക്കുന്ന ദ്വിതീയ നേർത്ത അടയാളപ്പെടുത്തൽ വരകൾ.
ടൈപ്പോഗ്രാഫി
12 മുതൽ 64px വരെ · 8 ചുവടുകൾ
- Goga — മാറ്റിസ്ഥാപിക്കൽ: Inter Tight or Space Grotesk · രൂപരേഖകൾ 400, 500 · ഹെഡിംഗ്, സബ്ഹെഡിംഗ് ഫോണ്ട് – എല്ലാ H1–H4 ഹെഡിംഗുകൾക്കും കാർഡുകൾക്കും ഉപയോഗിക്കുന്നു. ഇടുങ്ങിയ അപ്പേർച്ചറുകളും ചെറുതായി ചതുരാകൃതിയിലുള്ള ടെർമിനലുകളുമുള്ള ഒരു ഇഷ്ടാനുസൃത ജ്യാമിതീയ സാൻസ്-സെരിഫ് ഫോണ്ടാണ് ഗോഗ. കാർഡ്-ലെവൽ ഹെഡിംഗുകൾ ഹൈലൈറ്റ് ചെയ്യുന്നതിന് മീഡിയം വെയ്റ്റ് (500) നീക്കിവച്ചിരിക്കുന്നു; ഹീറോ, സെക്ഷൻ ഹെഡിംഗുകൾക്കായി സാധാരണ വെയ്റ്റ് (400) ഉപയോഗിക്കുന്നു. മോഡലിന്റെ ഐഡന്റിറ്റി നിർവചിക്കുന്ന ഇതര ഗ്ലിഫ് ആകൃതികൾ ആക്സസ് ചെയ്യുന്നതിന്, അതിന്റെ 'ss01' സ്റ്റൈലിസ്റ്റിക് സെറ്റ് പ്രവർത്തനക്ഷമമാക്കണം. നെഗറ്റീവ് ലെറ്റർ സ്പെയ്സിംഗ് ക്രമേണ 48px-ൽ -0.007em-ൽ നിന്ന് 21px-ൽ -0.017em-ലേക്ക് കുറയുന്നു.
- Inter Variable — മാറ്റിസ്ഥാപിക്കൽ: Inter · രൂപരേഖകൾ 400, 500 · ഉപയോക്തൃ ഇന്റർഫേസും ബോഡി കോപ്പിയും - നാവിഗേഷൻ, ബട്ടണുകൾ, ബോഡി കോപ്പി, ലേബലുകൾ, ഫൂട്ടർ. ഇന്ററാക്ടീവ് ഘടകങ്ങൾക്കും നാവിഗേഷനും സ്ഥിരസ്ഥിതിയായി മീഡിയം വെയ്റ്റ് (500) ഉപയോഗിക്കുന്നു; ഖണ്ഡികകൾക്ക് സാധാരണ (400) ഉപയോഗിക്കുന്നു. ചെറിയ വലുപ്പങ്ങളിൽ പോലും (-0.026em at 14px, -0.022em at 16px) അക്ഷരങ്ങളുടെ അകലം ഗണ്യമായി കുറയുന്നു, ഇത് ഇന്റർഫേസിന് ഒരു സംയോജിത, ടെർമിനൽ സാന്ദ്രത നൽകുന്നു. ഇതര ചിഹ്നനത്തിനായി, 'cv11' പ്രതീക വേരിയന്റ് ഉൾപ്പെടുത്തണം. ബോഡി കോപ്പി ഡെൻസിറ്റിയെ സമതുലിതമാക്കാൻ 12px ലെ ഓൾ-ക്യാപ്സ് ലേബലുകൾ +0.05em അക്ഷരങ്ങളുടെ അകലം ഉപയോഗിക്കുന്നു.
ഇടവേളകളും രൂപവും
| ഉദ്ദേശ്യം | അർത്ഥം |
|---|---|
| സാന്ദ്രത | ശരാശരി |
| അടിസ്ഥാന ഘട്ടം | 20px |
| ബട്ടൺ ആരം | 12px |
| കാർഡ് ആരം | 8px |
| ഷാഡോകൾ | ഷാഡോകൾക്ക് പകരം ബോർഡറുകൾ ഇല്ല |
| വിഭാഗങ്ങൾക്കിടയിൽ | 80px |
| പേജ് വീതി | 1280px |
AI നിങ്ങളുടെ വെബ്സൈറ്റ് Modal ശൈലിയിൽ നിർമ്മിച്ച് അത് പൂരിപ്പിക്കും.
- Instagram, TikTok, Facebook ലിങ്കുകൾ വഴി ഉൽപ്പന്നങ്ങളും പോസ്റ്റുകളും പൂരിപ്പിക്കുക.
- നിങ്ങളുടെ പഴയ സൈറ്റിൽ നിന്ന് ഉള്ളടക്കം കൈമാറുക—വിലാസം മാത്രം വ്യക്തമാക്കുക.
- മികച്ച എഞ്ചിനിൽ ആധുനിക ഡിസൈൻ: സെർവർ റെൻഡറിംഗും SEO ഒപ്റ്റിമൈസേഷനും ഉള്ള React ( Next.js).
- തിരയൽ ഫലങ്ങൾക്കും ന്യൂറൽ നെറ്റ്വർക്ക് ശുപാർശകൾക്കുമായി പൂർണ്ണമായും ഓട്ടോമേറ്റഡ് SEO ഒപ്റ്റിമൈസേഷൻ.
സമാനമായ ശൈലികൾ
- Slash — സ്വർണ്ണം പൂശിയ ലെഡ്ജറുകളുള്ള അർദ്ധരാത്രി നിലവറ
- AgentQL — രാത്രിയിൽ ടെർമിനലിന് മുകളിലുള്ള വടക്കൻ വിളക്കുകൾ
- GitHub — ബയോലുമിനെസെന്റ് കൺട്രോൾ പോയിന്റുകളുള്ള ഒരു സ്പേസ് കമാൻഡ് പാനൽ - ഒരു ഇരുണ്ട, അന്തരീക്ഷ വർക്ക്സ്പെയ്സ്, അവിടെ ഒരു പച്ച തിളക്കം മുന്നോട്ടുള്ള വഴി ചൂണ്ടിക്കാണിക്കുന്നു.
- Doppler — അർദ്ധരാത്രിയിൽ നിലവറയുടെ പർപ്പിൾ നിറത്തിലുള്ള വെളിച്ചം. ഏതാണ്ട് കറുത്ത നിറത്തിലുള്ള ക്യാൻവാസ് ഒരു ലാവെൻഡർ സിഗ്നലോടെയും പച്ച നിറത്തിലുള്ള ഒരു സ്ഥിരീകരണ ലൈറ്റോടെയും തിളങ്ങുന്നു, ഓരോ പ്രതലവും ഗ്രഹിക്കാൻ കഴിയുന്നത്ര വളഞ്ഞിരിക്കുന്നു.
- Basedash — മാറ്റ് ഫോണ്ടുള്ള ഒരു അർദ്ധരാത്രി ഡാറ്റ ടെർമിനൽ. പർപ്പിൾ, പച്ച നിറങ്ങളിൽ മെട്രിക്സ് തിളങ്ങുന്ന, സെരിഫ് തലക്കെട്ടുകൾ ശബ്ദത്തിന് മുകളിൽ പൊങ്ങിക്കിടക്കുന്ന, വെളുത്ത ഗുളിക ആകൃതിയിലുള്ള ബട്ടണുകൾ മാത്രമുള്ള ഒരു ഇരുണ്ട നിരീക്ഷണാലയം, മൃദുവായ കറുത്ത പ്രതലങ്ങളുള്ള ഒരു മുറിയിൽ തിളക്കമുള്ള വസ്തുക്കൾ.
- Superwhisper — അർദ്ധരാത്രി ഗ്ലാസിന് മുകളിൽ വടക്കൻ വിളക്കുകൾ അലിഞ്ഞു ചേരുന്നു
- Better Stack — അർദ്ധരാത്രി SRE കൺസോൾ
- Langbase — മിഡ്നൈറ്റ് നോർത്തേൺ ലൈറ്റ്സ് കൺസോൾ
- Astro — ഒരു നെബുലയിൽ നിന്നുള്ള ഒറ്റ പർപ്പിൾ തിളക്കത്തോടെയുള്ള ഡീപ് സ്പേസ് മിഷൻ കൺട്രോൾ
- Wayfinder — ഒരു കറുത്ത മൂവി സ്ക്രീൻ, ഒരു ലൈവ് ചിത്രീകരണത്തിന് മുകളിൽ കഷ്ടിച്ച് കേൾക്കാവുന്ന തലക്കെട്ട്. ഇന്റർഫേസ് ഒരു കൺട്രോൾ പാനലല്ല, മറിച്ച് ഒരു ബ്രൈറ്റ്നെസ് സ്ലൈഡറാണ്.
- HashiCorp — പർപ്പിൾ നിയോൺ പ്രകാശിപ്പിക്കുന്ന അർദ്ധരാത്രിയിലെ കൺട്രോൾ റൂം ഇരുണ്ട സാങ്കേതിക പ്രതലമാണ്, അവിടെ തിളങ്ങുന്ന ഷഡ്ഭുജാകൃതിയിലുള്ള ഒരു ക്യൂബ് മാത്രമാണ് വർണ്ണ റഫറൻസായി പ്രവർത്തിക്കുന്നത്.
- Umbrel — രാത്രി സെർവർ മുറിയിലെ ഒരു സുഖകരമായ ഫയർ പിറ്റ് - യഥാർത്ഥത്തിൽ പ്രധാനപ്പെട്ടതെന്താണെന്ന് എടുത്തുകാണിക്കുന്ന ഒരു പീച്ച് തിളക്കമുള്ള ഇരുണ്ട മുറി.