CSS Unit Converter
CSS लंबाई इकाइयाँ — px, rem, em, pt और % — आपके ब्राउज़र में लाइव बदलें। एक रूट फ़ॉन्ट आकार सेट करें और हर इकाई तुरंत अपडेट हो जाती है।
हर रूपांतरण आपके ब्राउज़र में लोकल रूप से गणना किया जाता है; आपके टाइप किए गए मान कभी अपलोड नहीं होते।
CSS रंगों के साथ काम कर रहे हैं? CSS Color Converter आज़माएँ।
CSS Unit Converter के बारे में
यह CSS unit converter एक इकाई में टाइप की गई लंबाई को एक साथ हर दूसरी CSS इकाई में बदलता है — px, rem, em, pt और %। किसी भी फ़ील्ड में एक मान दर्ज करें और बाकी लाइव अपडेट होते हैं, इसलिए आप px से rem या pt से px का परिणाम हाथ से गणित किए बिना पढ़ सकते हैं। एक रूट फ़ॉन्ट आकार इनपुट (डिफ़ॉल्ट 16px) rem, em और % संबंध चलाता है, जो उस तरीके को दर्शाता है जिससे ब्राउज़र पेज के फ़ॉन्ट आकार के विरुद्ध सापेक्ष इकाइयाँ हल करते हैं। एक बिल्ट-इन त्वरित संदर्भ सामान्य px-से-rem मान दिखाता है जिन्हें डिज़ाइनर दोबारा उपयोग करते हैं — 12, 14, 16, 24, 32 और अधिक — आपके चुने हुए आधार पर। हर परिणाम में एक कॉपी बटन है ताकि आप उसे सीधे एक स्टाइलशीट में डाल सकें। सब कुछ आपके ब्राउज़र में चलता है, इसलिए आपके टाइप किए गए मान आपके डिवाइस पर ही रहते हैं।
विशेषताएँ
- जैसे ही आप किसी फ़ील्ड में टाइप करते हैं px, rem, em, pt और % के बीच बदलता है
- एक कॉन्फ़िगरेबल रूट फ़ॉन्ट आकार rem, em और % चलाता है ताकि परिणाम आपकी CSS से मेल खाएँ
- CSS 96/72 फ़ैक्टर का उपयोग करके सटीक pt रूपांतरण (1pt = 1.3333px)
- % को रूट फ़ॉन्ट आकार के एक अंश के रूप में मानता है, ठीक फ़ॉन्ट-सापेक्ष CSS की तरह
- आपके आधार पर सामान्य px-से-rem मानों (12, 14, 16, 24, 32) की त्वरित संदर्भ तालिका
- परिणामों को एक समझदार परिशुद्धता पर काटता है और साफ़ मानों के लिए ट्रेलिंग शून्य हटाता है
- हर इकाई पर एक-क्लिक कॉपी, इकाई प्रत्यय सहित
- विज़िट के बीच आपका अंतिम मान और आधार फ़ॉन्ट आकार याद रखता है
CSS Unit Converter का उपयोग कैसे करें
- यदि रूट फ़ॉन्ट आकार 16px ब्राउज़र डिफ़ॉल्ट से भिन्न है तो उसे सेट करें।
- किसी भी इकाई फ़ील्ड — px, rem, em, pt या % — में एक मान टाइप करें।
- हर दूसरी इकाई में समकक्ष मान पढ़ें जैसे-जैसे वह लाइव अपडेट होता है।
- मान को उसके प्रत्यय सहित पाने के लिए किसी इकाई के बगल में कॉपी बटन पर क्लिक करें।
- अपने आधार पर सामान्य px-से-rem जोड़ों के लिए त्वरित संदर्भ तालिका का उपयोग करें।
उदाहरण
इनपुट
/* root font-size: 16px */
.card { padding: 24px; }
आउटपुट
.card { padding: 1.5rem; }
/* 24px = 1.5rem = 18pt = 150% at base 16px */
16px आधार पर, 24px 1.5rem के बराबर है — एक लेआउट को rem में बदलने के लिए उपयोगी।
सामान्य त्रुटियाँ और समस्या निवारण
- आपके rem और % परिणाम गलत दिखते हैं भले ही px सही हो। — रूट फ़ॉन्ट आकार जाँचें। rem, em और % उस आधार के विरुद्ध हल होते हैं, इसलिए उसे अपने :root या html तत्व पर font-size से मेल खाने के लिए सेट करें।
- pt किसी डिज़ाइन टूल में जो आप देखते हैं उससे मेल नहीं खाता। — यह कन्वर्टर CSS परिभाषा का उपयोग करता है जहाँ 1pt = 96/72 px (1.3333px)। प्रिंट या DTP टूल 72dpi मान सकते हैं, जो इसके बजाय 1pt = 1px देता है।
- em और rem समान संख्या दिखाते हैं, पर आपने उन्हें भिन्न होने की अपेक्षा की थी। — कन्वर्टर चीज़ों को सरल रखने के लिए दोनों के लिए एक ही आधार उपयोग करता है। असली CSS में, em तत्व के अपने फ़ॉन्ट आकार के सापेक्ष होता है जबकि rem रूट के सापेक्ष, इसलिए वे केवल तब भिन्न होते हैं जब कोई पैरेंट font-size बदलता है।
- जब आप रूट फ़ॉन्ट आकार खाली छोड़ते हैं तो फ़ील्ड साफ़ हो जाते हैं। — एक खाली या शून्य आधार को अमान्य माना जाता है; कन्वर्टर 16px पर वापस आ जाता है। rem, em और % को स्वयं चलाने के लिए एक धनात्मक संख्या टाइप करें।
अक्सर पूछे जाने वाले प्रश्न
- मैं px को rem में कैसे बदलूँ?
- पिक्सेल मान को px फ़ील्ड में टाइप करें और rem फ़ील्ड पढ़ें। rem मान को रूट फ़ॉन्ट आकार से भाग देने पर आता है, इसलिए डिफ़ॉल्ट 16px आधार पर, 16px 1rem है और 24px 1.5rem है।
- मैं rem को px में कैसे बदलूँ?
- मान को rem फ़ील्ड में टाइप करें और px पढ़ें। rem से px मान को रूट फ़ॉन्ट आकार से गुणा करने पर आता है, इसलिए 16px आधार पर 2rem 32px है।
- कन्वर्टर कौन सा आधार फ़ॉन्ट आकार उपयोग करता है?
- यह 16px पर डिफ़ॉल्ट होता है, मानक ब्राउज़र रूट फ़ॉन्ट आकार, और आप इसे Root font size फ़ील्ड में बदल सकते हैं। वह आधार हर rem, em और % परिणाम चलाता है ताकि वे आपकी स्टाइलशीट से मेल खाएँ।
- यहाँ 1pt 1.3333px के बराबर क्यों है?
- CSS 1pt को 1/72 इंच और 1px को 1/96 इंच परिभाषित करता है, इसलिए 1pt = 96/72 px = 1.3333px। यही कारण है कि 12pt ठीक 16px में बदलता है, सामान्य बॉडी-टेक्स्ट आकार।
- em और rem में क्या अंतर है?
- rem रूट फ़ॉन्ट आकार के सापेक्ष होता है, जबकि em तत्व के अपने फ़ॉन्ट आकार के सापेक्ष। यह टूल सरलता के लिए दोनों के लिए एक आधार उपयोग करता है, इसलिए वे समान पढ़ते हैं; rem पक्ष को मॉडल करने के लिए रूट फ़ॉन्ट आकार सेट करें।
- क्या रूपांतरण किसी सर्वर पर होता है?
- नहीं। CSS इकाई रूपांतरण पूरी तरह आपके ब्राउज़र में सरल अंकगणित के साथ चलता है, इसलिए आपके दर्ज किए गए मान आपके डिवाइस पर ही रहते हैं।
संबंधित टूल
- CSS कलर कन्वर्टर — लाइव स्वैच के साथ HEX, RGB और HSL के बीच कन्वर्ट करें।
- CSS / SCSS फ़ॉर्मेटर — CSS/SCSS/LESS को सुंदर या छोटा बनाएँ, प्रॉपर्टी क्रमबद्ध करें और डुप्लिकेट हटाएँ।
- कंट्रास्ट चेकर — दो रंगों के बीच WCAG कंट्रास्ट अनुपात और AA/AAA पास होना जाँचें।
- HTML फ़ॉर्मेटर — HTML को सुंदर या छोटा बनाएँ, इनलाइन CSS/JS फ़ॉर्मेट करें और परिणाम का पूर्वावलोकन करें।
- JS / TS फ़ॉर्मेटर — Prettier विकल्पों के साथ JavaScript, TypeScript और JSX/TSX को सुंदर या छोटा बनाएँ।
सभी ArrayKit टूल