বিনামূল্যের CSS ও ডিজাইন টুল

আধুনিক CSS আপনাকে সম্পূর্ণ নিয়ন্ত্রণ দেয়, কিন্তু box-shadow সিনট্যাক্স, গ্রেডিয়েন্ট স্টপ ও cubic-bezier ইজিং হাতে লেখা কষ্টকর। ভিজ্যুয়াল জেনারেটর আপনাকে স্লাইডার টেনে নিয়ে, ফলাফল রিয়েল-টাইমে আপডেট হতে দেখে, তারপর সঠিক CSS কপি করতে দেয়। এগুলি CSS জ্ঞানের বিকল্প নয়, তবে মান নিয়ে পুনরাবৃত্তির ঝামেলা দূর করে। প্রোটোটাইপ করতে এগুলি ব্যবহার করুন এবং তারপর আউটপুট আপনার কোডে নিয়ে যান।

ফ্লুইড টাইপোগ্রাফির জন্য clamp() (ফন্ট আকারের জন্য প্রতি ব্রেকপয়েন্টে আর মিডিয়া কোয়েরি নয়)। রেসপন্সিভ ভিডিও ও ইমেজ কন্টেইনারের জন্য aspect-ratio। দ্বিমাত্রিক লেআউটের জন্য grid (একমাত্রিকের জন্য flexbox ব্যবহার করুন)। প্যারেন্টের সাথে সারিবদ্ধ নেস্টেড গ্রিডের জন্য subgrid। প্যারেন্ট-ভিত্তিক স্টাইলের জন্য :has() সিলেক্টর। রানটাইমে রঙ মেশানোর জন্য color-mix()। সবকিছুই যেকোনো আধুনিক ব্রাউজারে উপলব্ধ। এই পৃষ্ঠার CSS Clamp Generator আপনার min/max মান থেকে সঠিকভাবে গঠিত clamp() এক্সপ্রেশন তৈরি করে।

মনোক্রোম্যাটিক প্যালেট (একটি হিউ, ভিন্ন উজ্জ্বলতা) সবচেয়ে নিরাপদ পেশাদার বিকল্প। অ্যানালগাস (সংলগ্ন হিউ) ঐক্য ও প্রশান্তি প্রকাশ করে। কমপ্লিমেন্টারি কনট্রাস্ট তৈরি করে, কল-টু-অ্যাকশনের জন্য নিখুঁত। ট্রায়াডিক প্রাণবন্ত কিন্তু ভারসাম্য রক্ষা করা কঠিন। Color Palette Generator আপনার বেছে নেওয়া যেকোনো বেস রঙ থেকে এই সবগুলি গণনা করে। অ্যাক্সেসিবিলিটির জন্য, কনট্রাস্ট অনুপাতও যাচাই করুন: WCAG AA বডি টেক্সটের জন্য ৪.৫:১ এবং বড় টেক্সটের জন্য ৩:১ দাবি করে।