লেটার স্পেসিং প্রিভিউয়ার
px, em বা rem এককে লেটার-স্পেসিং, ফন্ট, ওজন ও টেক্সট-ট্রান্সফর্ম নিয়ন্ত্রণ করে প্রিভিউ করুন, তারপর সঠিক CSS কপি করুন। সম্পূর্ণভাবে আপনার ব্রাউজারে চলে।
এই টুলটি সম্পূর্ণভাবে আপনার ব্রাউজারে চলে। আপনার ফাইল কখনও সার্ভারে আপলোড করা হয় না।
লেটার স্পেসিং প্রিভিউয়ার যেভাবে কাজ করে
- আপনার প্রিভিউ টেক্সট লিখুন এবং লেটার স্পেসিং, ফন্ট সাইজ, ওজন, ফন্ট ফ্যামিলি ও টেক্সট ট্রান্সফর্ম সমন্বয় করুন।
- আপনার প্রজেক্টের স্টাইলশিট যেভাবে লেখা হয় তার সাথে মিলিয়ে স্পেসিং এককটি em, px এবং rem-এর মধ্যে পরিবর্তন করুন।
- স্পেসিং স্লাইডার টেনে ধরার সাথে সাথে লাইভ প্রিভিউ আপডেট হতে দেখুন।
- ফলাফলের CSS ঘোষণাগুলো আপনার স্টাইলশিটে কপি করুন, অথবা আবার শুরু করতে রিসেট চাপুন।
প্রায়শই জিজ্ঞাসিত প্রশ্ন
letter-spacing কী কাজে ব্যবহার হয়?
পাঠযোগ্যতা বাড়াতে, হেডলাইনে জোর দিতে, অথবা প্রশস্ত স্পেসিং সহ অল-ক্যাপস লেবেলের মতো নির্দিষ্ট টাইপোগ্রাফিক স্টাইল অর্জনে অক্ষরগুলোর মধ্যে স্থান (ট্র্যাকিং) সমন্বয় করা।
সাধারণ letter-spacing রেঞ্জ কত?
ছোট ঋণাত্মক মান (যেমন -0.02em) বড় ডিসপ্লে টেক্সটকে টাইট করে, আর ধনাত্মক মান (0.05em থেকে 0.2em) আপারকেস লেবেল ও ব্যাজের জন্য সাধারণ। খুব প্রশস্ত স্পেসিং (0.3em+) স্টাইলিস্টিক জোর দিতে ব্যবহৃত হয়।
ফন্ট ওজন কি letter-spacing-এর চেহারায় প্রভাব ফেলে?
হ্যাঁ - মোটা ওজনের অক্ষরের আকৃতি স্বাভাবিকভাবেই চওড়া হয়, তাই একই letter-spacing মান আপনার বেছে নেওয়া ওজন ও সাইজ অনুযায়ী টাইট বা লুজ দেখাতে পারে।
আমি কি CSS সরাসরি আমার প্রজেক্টে কপি করতে পারি?
হ্যাঁ - জেনারেট করা letter-spacing, font-size, font-weight, font-family, এবং text-transform ঘোষণাগুলো আপনার স্টাইলশিটে পেস্ট করার জন্য প্রস্তুত।
letter-spacing কি px, em, নাকি rem-এ হওয়া উচিত?
em সবচেয়ে সাধারণ পছন্দ কারণ এটি এলিমেন্টের নিজস্ব font-size অনুযায়ী স্কেল হয়, তাই টেক্সট রিসাইজ হলেও ট্র্যাকিং সমানুপাতিক থাকে। rem রুট font-size অনুযায়ী স্কেল হয়, যা বিভিন্ন সাইজে একই স্পেসিং রাখতে কাজে আসে। px সবচেয়ে অনুমানযোগ্য কিন্তু একেবারেই স্কেল হয় না। এই টুলটি তিনটিই প্রিভিউ ও কপি করতে দেয়।
আপারকেস টেক্সটের জন্য কোন letter-spacing ভালো কাজ করে?
আপারকেস লেবেল ও বাটন সাধারণত একটু প্রশস্ত ট্র্যাকিং (প্রায় 0.05em থেকে 0.15em) দিয়ে ভালো পড়া যায়, যা ক্যাপিটাল অক্ষরগুলোর ঘনিষ্ঠতা পূরণ করে। মান বেছে নেওয়ার আগে text-transform নিয়ন্ত্রণ দিয়ে আপারকেসে প্রিভিউ করুন।
আমরা কীভাবে তুলনায় এগিয়ে
| Feature | Online Tool Store | লেটার-স্পেসিং ক্যালকুলেটর | ইউনিট কনভার্টার টুল |
|---|---|---|---|
| লাইভ স্লাইডার প্রিভিউ | ✓ | ✓ | ✗ |
| সঠিক রূপান্তরসহ em / px / rem একক পরিবর্তন | ✓ | ✗ | ✓ |
| লাইভ প্রিভিউতে ফন্ট ফ্যামিলি পিকার | ✓ | ✗ | ✗ |
| টেক্সট-ট্রান্সফর্ম প্রিভিউ (uppercase/lowercase/capitalize) | ✓ | ✗ | ✗ |
| তাৎক্ষণিক কপিযোগ্য CSS | ✓ | ✓ | ✓ |
হেডলাইন বা বাটন লেবেলের জন্য CSS-এ লেখার আগে সঠিক ট্র্যাকিং মান ঠিক করতে কাজে আসে।