
Modal
একটি অন্ধকার সার্ভার রুমে থাকা ফসফোরেসেন্ট টার্মিনাল — যার একমাত্র আলোর উৎস হলো উজ্জ্বল সবুজ রঙ।
একটি অন্ধকার সার্ভার রুমের ফসফোরেসেন্ট টার্মিনালের মতো মোডাল কাজ করে: একটি প্রায় কালো ক্যানভাস, ফ্যাকাশে সবুজ টাইপ এবং একটিমাত্র উজ্জ্বল লাইম-সবুজ অ্যাকসেন্ট যা একটি LED স্ট্যাটাস ইন্ডিকেটর হিসেবে কাজ করে। এর ডিজাইন ল্যাঙ্গুয়েজটি ডেভেলপার-কেন্দ্রিক—ট্র্যাফিক লাইট ডটসহ মনোস্পেসড কোড উইন্ডো, সিগনেচার সবুজ রঙের আইসোমেট্রিক 3D আইকন এবং প্রচুর সাদা জায়গা, যা প্রতিটি সেকশনের একটি এলিমেন্টকে উজ্জ্বল হতে দেয়। টাইপোগ্রাফি হেডিংয়ের জন্য একটি কাস্টম ফন্ট (Goga) এবং সমস্ত UI এলিমেন্টের জন্য একটি ভ্যারিয়েবল ফন্ট (Inter)-এর মধ্যে বিভক্ত, উভয়ই ন্যারো নেগেটিভ ট্র্যাকিং সহ সেট করা। রঙগুলো সমানভাবে বণ্টিত: বেশিরভাগ স্ক্রিনই অ্যাক্রোম্যাটিক, এবং উজ্জ্বল লাইম-সবুজ রঙটি শুধুমাত্র মূল অ্যাকশন, লোগো, 3D ইলাস্ট্রেশন এবং বিশেষ মুহূর্তগুলোতে দেখা যায়। কম্পোনেন্টগুলো ফ্ল্যাট এবং ফ্রেমবিহীন, এবং শ্যাডোর পরিবর্তে সূক্ষ্ম সবুজ বর্ডার ও ব্যাকগ্রাউন্ড ব্লারের মাধ্যমে গভীরতা তৈরি করা হয়েছে।
কন্টেন্ট ধারণ করার জন্য মোডালটি একটি সম্পূর্ণ-প্রস্থের ডার্ক লেআউট ব্যবহার করে, যার সর্বোচ্চ প্রস্থ ১২৮০ পিক্সেল। হিরো উইন্ডোটি কেন্দ্রে অবস্থিত: শিরোনাম (লাইম গ্রিন রঙের প্রথম বাক্য), একটি উপ-শিরোনাম, দুটি কল টু অ্যাকশন, এবং একটি ভিজ্যুয়াল অ্যাঙ্কর হিসেবে একটিমাত্র ৩ডি অবজেক্ট—লেআউটটিকে সাইডবার থেকে আলাদা না করেই। কন্টেন্ট সেকশনগুলো একটি অভিন্ন ছন্দ অনুসরণ করে: আইব্রো ট্যাগ (বড় হাতের অক্ষর, মস ৭০) → গোগা শিরোনাম → হালকা রঙের মূল লেখা, তারপর হয় একটি ফিচার বর্ণনাসহ দুই-কলামের লেআউট (টেক্সট + কোড/ভিজ্যুয়াল কার্ড) অথবা কার্ডের একটি তিন-কলামের গ্রিড। সেকশনগুলোর মাঝের ফাঁকা জায়গাগুলো যথেষ্ট প্রশস্ত—৮০ পিক্সেল। পেজটিতে গভীর খালি (#000000) এবং সামান্য হালকা ব্যাকগ্রাউন্ডের (#181818) স্ট্রাইপ পর্যায়ক্রমে ব্যবহৃত হয়েছে, এবং পেজের মাঝখানে একটি হালকা সেকশন (#def0dd) ভিজ্যুয়াল বিরতি হিসেবে দেখা যায়। নেভিগেশনে একটিমাত্র, স্থির টপ বার রয়েছে যার ব্যাকগ্রাউন্ড ব্লার করা—কোনো সাইডবার বা মেগা-মেনু নেই। ফুটারটি সংক্ষিপ্ত ও গাঢ় রঙের, এবং এতে হালকা সবুজ রঙের লিঙ্ক কলাম রয়েছে। লেখার ঘনত্ব আরামদায়ক: প্রতিটি বিভাগকে পর্যাপ্ত জায়গা দেওয়া হয়েছে, এবং কার্ড গ্রিডগুলোতে তিনটির বেশি কলাম ব্যবহার করা হয়নি।
মোডালের ভিজ্যুয়াল ল্যাঙ্গুয়েজ দুটি মোডে বিভক্ত: ৩ডি উজ্জ্বল প্রোডাক্ট রেন্ডার এবং ডার্ক কোড উইন্ডো মকআপ। এর কেন্দ্রবিন্দুতে রয়েছে একটি একক ৩ডি কিউব, যা একটি মার্কেটিং গ্রেডিয়েন্ট (লাইম গ্রিন থেকে এমারাল্ড) ব্যবহার করে রেন্ডার করা হয়েছে। এটি একটি রেডিয়াল গ্রেডিয়েন্ট হ্যালোর মধ্যে স্থাপন করা হয়েছে, যা খালি জায়গাটিকে সবুজ আলোয় উদ্ভাসিত করে—এটি ব্র্যান্ডটির সিগনেচার ভিজ্যুয়াল স্টাইল। ওয়ার্কলোড কার্ডগুলিতে আইসোমেট্রিক ৩ডি আইকন (একটি ওয়্যারফ্রেম কিউব, একটি সলিড সিঁড়ি, লেয়ার) রয়েছে, যা একটি ডার্ক ব্যাকগ্রাউন্ডের বিপরীতে একই লাইম গ্রিন রঙে রেন্ডার করা হয়েছে। কোড এবং বেঞ্চমার্কের ফলাফল টার্মিনাল উইন্ডো কার্ড হিসাবে উপস্থাপন করা হয়, যেখানে ট্র্যাফিক লাইট ডট, ফসফোরেসেন্ট প্যালেটে মনোস্পেসড সিনট্যাক্স হাইলাইটিং এবং একটি হালকা সবুজ বর্ডার থাকে—এগুলো একটি আসল কমান্ড-লাইন ইন্টারফেসের স্ক্রিনশটের মতো দেখতে। ক্লায়েন্টের লোগোগুলি একটি একক, লো-কনট্রাস্ট সারিতে ডিস্যাচুরেটেড সবুজ-ধূসর লেবেল হিসাবে প্রদর্শিত হয়, যা কোনো ভিজ্যুয়াল প্রতিযোগিতা ছাড়াই বিশ্বাসযোগ্যতার ইঙ্গিত দেয়। সামগ্রিক ঘনত্ব কম—বেশিরভাগ পৃষ্ঠায় প্রধানত টেক্সট থাকে এবং ছবিগুলিকে ফটোগ্রাফের গ্রিডের পরিবর্তে স্বতন্ত্র কেন্দ্রবিন্দু হিসাবে উপস্থাপন করা হয়। এখানে কোনো ফটোগ্রাফ নেই; সম্পূর্ণ ভিজ্যুয়াল সিস্টেমটি রেন্ডার করা, জ্যামিতিক এবং উজ্জ্বল।
প্যালেট
ব্র্যান্ড
- Lime Pulse
#7fee64— কর্পোরেট পরিচিতির প্রধান উপাদানগুলো হলো লোগো, মূল কল টু অ্যাকশন (CTA), ট্যাগ ফিলিং, সক্রিয় অবস্থা এবং ইলাস্ট্রেশনের মৌলিক রঙ।
নিরপেক্ষ
- Phosphor White
#ddffdc— মূল লেখা, শিরোনামের রঙ, আইকনের রূপরেখা এবং বাটনের ভরাট লেখাই হলো প্রধান পাঠযোগ্য পৃষ্ঠ। - Void Black
#000000— পৃষ্ঠা ক্যানভাস, গভীরতম পটভূমি স্তর - Ground Iron
#181818— প্রধান বাটনের ফিল, অন্ধকার অংশে থাকা কার্ডের পৃষ্ঠতল, ইউজার ইন্টারফেসের মূল পৃষ্ঠতল। - Carbon Veil
#212525— উঁচু পৃষ্ঠতল, দিকনির্দেশনার পটভূমি, যা ভূমির চেয়ে সামান্য হালকা। - Circuit Border
#485346— রূপরেখা/অস্পষ্ট অ্যাকশন ফ্রেমটি, যা মূল ইন্টারেক্টিভ পাতলা রেখা, একটি অনুজ্জ্বল সবুজাভ-ধূসর আভার। - Phosphor Blue-Black
#1f2a33— গাঢ় ডোরাগুলোর মাঝে বিভাজক গৌণ পাতলা রেখা।
টাইপোগ্রাফি
১২ থেকে ৬৪ পিক্সেল · ৮টি ধাপ
- Goga — প্রতিস্থাপন: Inter Tight or Space Grotesk · রূপরেখা 400, 500 · হেডিং এবং সাবহেডিং ফন্ট – সমস্ত H1–H4 হেডিং এবং কার্ডের জন্য ব্যবহৃত হয়। গোগা একটি কাস্টম জ্যামিতিক স্যান্স-সেরিফ ফন্ট, যার অ্যাপারচার সরু এবং টার্মিনালগুলো সামান্য বর্গাকার। এর মিডিয়াম ওয়েট (500) কার্ড-স্তরের হেডিং হাইলাইট করার জন্য সংরক্ষিত; নরমাল ওয়েট (400) হিরো এবং সেকশন হেডিংয়ের জন্য ব্যবহৃত হয়। Modal-এর পরিচয় নির্ধারণকারী বিকল্প গ্লিফ শেপগুলো অ্যাক্সেস করার জন্য, এর 'ss01' স্টাইলিস্টিক সেটটি সক্রিয় করতে হবে। নেগেটিভ লেটার স্পেসিং 48px-এ -0.007em থেকে 21px-এ -0.017em পর্যন্ত ক্রমান্বয়ে হ্রাস পায়।
- Inter Variable — প্রতিস্থাপন: Inter · রূপরেখা 400, 500 · ইউজার ইন্টারফেস এবং মূল লেখা – নেভিগেশন, বাটন, মূল লেখা, লেবেল, ফুটার। ইন্টারেক্টিভ এলিমেন্ট এবং নেভিগেশনের জন্য ডিফল্টভাবে মিডিয়াম ওয়েট (৫০০) ব্যবহার করা হয়; প্যারাগ্রাফের জন্য নরমাল (৪০০) ব্যবহার করা হয়। ছোট সাইজেও লেটার স্পেসিং লক্ষণীয়ভাবে কমানো হয়েছে (-১৪ পিক্সেলে ০.০২৬em, -১৬ পিক্সেলে ০.০২২em), যা ইন্টারফেসটিকে একটি ঘনীভূত, টার্মিনাল ঘনত্ব প্রদান করে। বিকল্প বিরামচিহ্নের জন্য, 'cv11' ক্যারেক্টার ভ্যারিয়েন্টটি অন্তর্ভুক্ত করা উচিত। মূল লেখার ঘনত্বের ভারসাম্য রক্ষার জন্য ১২ পিক্সেলের অল-ক্যাপস লেবেলগুলোতে +০.০৫em লেটার স্পেসিং ব্যবহার করা হয়।
ব্যবধান এবং ফর্ম
| উদ্দেশ্য | অর্থ |
|---|---|
| ঘনত্ব | গড় |
| প্রাথমিক পদক্ষেপ | 20px |
| বোতামের ব্যাসার্ধ | 12px |
| কার্ডের ব্যাসার্ধ | 8px |
| ছায়া | না - ছায়ার পরিবর্তে সীমানা |
| বিভাগগুলির মধ্যে | 80px |
| পৃষ্ঠার প্রস্থ | 1280px |
এআই আপনার ওয়েবসাইটটি Modal স্টাইলে তৈরি করবে এবং তাতে তথ্য যোগ করবে।
- Instagram, TikTok, Facebook লিঙ্কের মাধ্যমে পণ্য এবং পোস্ট দিয়ে পূরণ করুন।
- আপনার পুরোনো সাইট থেকে কন্টেন্ট স্থানান্তর করুন—শুধু ঠিকানাটি উল্লেখ করুন।
- সেরা ইঞ্জিন React ( Next.js)-এ তৈরি আধুনিক ডিজাইন, সাথে রয়েছে সার্ভার রেন্ডারিং এবং এসইও অপটিমাইজেশন।
- সার্চ রেজাল্ট এবং নিউরাল নেটওয়ার্ক সুপারিশের জন্য সম্পূর্ণ স্বয়ংক্রিয় এসইও অপ্টিমাইজেশন।
একই রকম শৈলী
- Slash — সোনালি খাতা সহ মধ্যরাতের ভল্ট
- AgentQL — রাতে টার্মিনালের উপর উত্তর আলো
- GitHub — জৈব-আলোকীয় নিয়ন্ত্রণ বিন্দুসহ একটি মহাকাশ কমান্ড প্যানেল—একটি অন্ধকার, রহস্যময় কর্মক্ষেত্র যেখানে একটিমাত্র সবুজ আভা সামনের পথ নির্দেশ করে।
- Doppler — মধ্যরাতে ভল্টের বেগুনি আলো। প্রায় কালো ক্যানভাসটি একটিমাত্র ল্যাভেন্ডার সংকেত ও একটি সবুজ নিশ্চিতকরণ বাতির আলোয় উদ্ভাসিত, এর প্রতিটি পৃষ্ঠতল এতটাই বাঁকানো যে তা আঁকড়ে ধরা যায়।
- Basedash — ম্যাট ফন্টের একটি মধ্যরাতের ডেটা টার্মিনাল। একটি অন্ধকার পর্যবেক্ষণাগার, যেখানে মেট্রিকগুলো বেগুনি ও সবুজ রঙে জ্বলজ্বল করছে, সেরিফ শিরোনামগুলো কোলাহলের উপরে ভেসে বেড়াচ্ছে, এবং নরম কালো পৃষ্ঠতলে মোড়া ঘরটিতে সাদা বড়ি-আকৃতির বোতামগুলোই একমাত্র উজ্জ্বল বস্তু।
- Superwhisper — মধ্যরাতের কাঁচের উপর উত্তরের আলো মিলিয়ে যায়।
- Better Stack — মধ্যরাতের SRE কনসোল
- Langbase — মধ্যরাতের উত্তর আলো কনসোল
- Astro — ডিপ স্পেস মিশন কন্ট্রোল, যেখানে একটি নীহারিকা থেকে একটিমাত্র বেগুনি আভা নির্গত হচ্ছে।
- Wayfinder — একটি কালো সিনেমার পর্দা, যার উপরে একটি জীবন্ত চিত্রের ওপর প্রায় অস্পষ্ট একটি শিরোনাম ভেসে আছে। ইন্টারফেসটি কোনো কন্ট্রোল প্যানেল নয়, বরং একটি উজ্জ্বলতা কমানোর স্লাইডার।
- HashiCorp — মধ্যরাতে বেগুনি নিয়ন আলোয় আলোকিত কন্ট্রোল রুমটি একটি অন্ধকার প্রযুক্তিগত পৃষ্ঠ, যেখানে একটি উজ্জ্বল ষড়ভুজাকার ঘনকই রঙের একমাত্র নির্দেশক হিসেবে কাজ করে।
- Umbrel — নাইট সার্ভার রুমে একটি আরামদায়ক অগ্নিকুণ্ড—একটি অন্ধকার ঘর, যেখানে একটিমাত্র পীচ রঙের আভা সত্যিকারের গুরুত্বপূর্ণ বিষয়গুলোকে তুলে ধরে।