ডিজাইন

CSS গ্রিড জেনারেটর

ভিজুয়ালি CSS গ্রিড লেআউট তৈরি করুন।

লেআউট প্রিসেট (10)

আয়তক্ষেত্র রং করতে সেলগুলোর ওপর টেনে নিন, অথবা একবারে একটি সেলে ক্লিক করুন। প্রতিটি নামযুক্ত এলাকা আয়তাকার থাকতে হবে।

লাইভ প্রিভিউ

নামকৃত এরিয়া সহ একটি CSS গ্রিড তৈরি করুন

টেমপ্লেট-এরিয়ার জন্য অক্ষর গ্রিড আঁকুন, অথবা একটি প্রিসেট বেছে নিন। প্রিভিউতে প্রতিটি এলাকা আলাদা রঙে দেখা যাবে।

প্রশ্নোত্তর (FAQ)

grid-template-areas কী?

Layout-এর অঞ্চলগুলোকে (header, sidebar, main…) নাম দেওয়া এবং line number-এর বদলে নাম দিয়ে item বসানোর উপায়। এলাকার অক্ষর বসাতে নিচের cell-এ ক্লিক করুন — CSS সঙ্গে সঙ্গে আপডেট হবে।

আমি কি কোনো preset দিয়ে শুরু করতে পারি?

হ্যাঁ — Holy grail, dashboard, magazine ও app shell-সহ দশটি layout preset এক ক্লিকে named area load করে।

কিছু আপলোড করা হয়?

না। CSS সম্পূর্ণভাবে আপনার browser-এই তৈরি হয়।

সর্বশেষ আপডেট: