# ⁦CSS⁩ اکائی کنورٹر (⁦px⁩ سے ⁦rem⁩، ⁦em⁩، ⁦pt⁩)

> روٹ عنصر کے فونٹ سائز، پیرنٹ عنصر کے فونٹ سائز اور ⁦DPI⁩ سے ⁦px⁩ کو ⁦rem⁩، ⁦em⁩، ⁦pt⁩، پائیکا، انچ اور ⁦mm⁩ میں بدلیں۔ ⁦CSS⁩ میں ⁦1 in = 96 px = 72 pt⁩ مقرر ہے۔

انٹرایکٹو صورت: https://www.calcopenly.com/ur/conversion/css-unit-converter
موضوع: اکائیوں کے مبدل

CSS converts every length through pixels. The absolute units are fixed to each other: 1 in = 2.54 cm = 96 px = 72 pt = 6 pc, and 1 Q is a quarter of a millimetre. The font-relative units depend on the page: 1 rem is the root element's font size, and when you set font-size, 1 em (or 100%) is the parent's font size. The converter turns the value into pixels, then divides by the pixels in one target unit.

Front-end developers use it to turn a design's pixel sizes into rem, so text follows the reader's browser font setting: with the default 16 px root, 24 px is 1.5 rem. Print designers use the pixels-per-inch field instead; at 300 DPI a 10 mm logo needs about 118 pixels.

On screens a CSS inch is not a measured inch. Browsers anchor 96 px to a reference pixel of about 0.0213° of visual angle, so physical units match a ruler only in print.

## اندراجات

- **قدر**
- **سے** (اختیارات: Pixels (px), Points (pt), Picas (pc), انچ (⁨in⁩), سینٹی میٹر (⁨cm⁩), ملی میٹر (⁨mm⁩), Quarter-millimetres (Q), em (parent font size), rem (root font size), Percent of parent font size (%))
- **میں** (اختیارات: Pixels (px), Points (pt), Picas (pc), انچ (⁨in⁩), سینٹی میٹر (⁨cm⁩), ملی میٹر (⁨mm⁩), Quarter-millimetres (Q), em (parent font size), rem (root font size), Percent of parent font size (%))
- **Root font size (for rem)**
- **Parent font size (for em and %)**
- **Pixels per inch**: CSS fixes 1 in = 96 px. Enter a screen or printer density (e.g. 300) to count physical pixels instead.

## نتائج

- تبدیل شدہ قدر — بنیادی نتیجہ
- As CSS
- In pixels (px)

## فارمولا

$$
\begin{gathered} \text{to} = \text{value} \times \frac{\text{px per from-unit}}{\text{px per to-unit}} \\ 1\,\text{in} = 96\,\text{px} = 72\,\text{pt} = 2.54\,\text{cm} \end{gathered}
$$

## حل شدہ مثالیں

### 24 px in rem

- قدر: 24
- سے: Pixels (px)
- میں: rem (root font size)
- Root font size (for rem): 16 px
- **تبدیل شدہ قدر: 1.5 rem**
- **As CSS: 1.5rem**
- **In pixels: 24 px**
- جانچ کا ماخذ: ⁨CSS Values 3 §6.1: 1rem = root font size (16 px browser default); 24 / 16 = 1.5⁩

### 12 pt in px

- قدر: 12
- سے: Points (pt)
- میں: Pixels (px)
- Root font size (for rem): 16 px
- **تبدیل شدہ قدر: 16 px**
- **As CSS: 16px**
- جانچ کا ماخذ: ⁨CSS Values 3 §6.2: 1pt = 1/72 in, 1in = 96px; 12 × 96/72 = 16⁩

### 1 inch in CSS pixels

- قدر: 1
- سے: انچ (⁨in⁩)
- میں: Pixels (px)
- Root font size (for rem): 16 px
- **تبدیل شدہ قدر: 96 px**
- جانچ کا ماخذ: ⁨CSS Values 3 §6.2: 1in = 96px⁩

### 1.5 rem in px

- قدر: 1.5
- سے: rem (root font size)
- میں: Pixels (px)
- Root font size (for rem): 16 px
- **تبدیل شدہ قدر: 24 px**
- جانچ کا ماخذ: ⁨1 rem = root font size (16 px); 1.5 × 16⁩

### 10 mm at 300 DPI

- قدر: 10
- سے: ملی میٹر (⁨mm⁩)
- میں: Pixels (px)
- Root font size (for rem): 16 px
- Pixels per inch: 300 DPI
- **تبدیل شدہ قدر: 118.1102362 px**
- جانچ کا ماخذ: ⁨10 / 25.4 in × 300 px/in = 118.110236220… (Python fractions)⁩

### 100% is 1 em

- قدر: 100
- سے: Percent of parent font size (%)
- میں: em (parent font size)
- Root font size (for rem): 16 px
- **تبدیل شدہ قدر: 1 em**
- جانچ کا ماخذ: ⁨CSS: percentage font sizes and em both refer to the parent font size⁩

## سوالات

### How many pixels is 1 rem?

16 pixels by default. One rem equals the font size of the root html element, and the major browsers set that to 16 px unless the reader changes the default font size or the stylesheet sets html { font-size }. Setting html { font-size: 62.5% } makes 1 rem = 10 px. The W3C CSS Values and Units specification defines rem; the 16 px figure is the browser default, not part of the specification.

### How do I convert px to pt?

Multiply pixels by 0.75; to go from points to pixels, multiply by 4/3 (about 1.333). Both factors follow from the W3C CSS rule 1 in = 96 px = 72 pt, so 1 px = 72/96 pt. Body text at 16 px is 12 pt, and 11 pt text from a word processor is about 14.67 px.

### What is the difference between em and rem?

rem always refers to the root element's font size; em refers to the current element's font size, or to the parent's when used on font-size itself. So em compounds when nested: a list set to 1.2em inside another list set to 1.2em has text 1.44 times the outer size, while 1.2rem stays at 19.2 px with a 16 px root however deep it sits.

### Should I use px or rem for font sizes?

Use rem if text should follow the reader's browser font-size setting. Page zoom enlarges px and rem alike, but the default font-size preference changes only rem, em and percentage sizes. WCAG 2.1 success criterion 1.4.4 (level AA) requires text that can be resized to 200% without loss of content or function; browser zoom can meet it with px, and rem also honours the font-size preference.

### Is a CSS inch the same as a real inch?

Only in print. CSS defines 1 in as exactly 96 px, and on screens browsers anchor the pixel to the W3C reference pixel: one pixel of a 96 DPI screen seen from 28 in away, a visual angle of about 0.0213°. Phones are held closer and use smaller pixels, so a 96 px box measures well under an inch on most phones. Printers anchor to physical units, so 1 in prints as 25.4 mm.

### “⁨⁦CSS⁩ اکائی کنورٹر (⁦px⁩ سے ⁦rem⁩، ⁦em⁩، ⁦pt⁩)⁩” کتنا درست ہے؟

درستی آپ کی درج کردہ قدروں اور طریقے کے مفروضوں پر منحصر ہے۔ اعشاری حساب 50 بامعنی ہندسے استعمال کرتا ہے، مگر تخمینے، عددی طریقے اور ماخذ کا ڈیٹا کم درست ہو سکتے ہیں؛ دکھائی گئی قدروں کو راؤنڈ کرنے سے یہ حدود ختم نہیں ہوتیں۔ آزاد ذرائع کی حل شدہ مثالوں سے جانچ: 7۔ مثلاً، “⁨24 px in rem⁩” کو ⁨CSS Values 3 §6.1: 1rem = root font size (16 px browser default); 24 / 16 = 1.5⁩ سے جانچا جاتا ہے۔

### اس طریقے کا ماخذ کیا ہے؟

W3C — CSS Values and Units Module Level 3, §6.2 absolute lengths and §6.1 font-relative lengths.

## ماخذ

- [W3C — CSS Values and Units Module Level 3, §6.2 absolute lengths and §6.1 font-relative lengths](https://www.w3.org/TR/css-values-3/#absolute-lengths)