LibraTool logoLibraTool

ಉಚಿತ ಪಿಕ್ಸೆಲ್‌ನಿಂದ REM ಪರಿವರ್ತಕ

ಕಾನ್ಫಿಗರ್ ಮಾಡಬಹುದಾದ ಮೂಲ ಫಾಂಟ್ ಗಾತ್ರದೊಂದಿಗೆ px, rem, em, pt, vw, vh, ಮತ್ತು % ನಡುವೆ ಪರಿವರ್ತಿಸಿ. ಸಾಮಾನ್ಯ ಪಿಕ್ಸೆಲ್ ಗಾತ್ರಗಳಿಗೆ ಉಲ್ಲೇಖ ಟೇಬಲ್ ಒಳಗೊಂಡಿದೆ.

ಒಮ್ಮೆ ಲೋಡ್ ಆದ ನಂತರ ಆಫ್‌ಲೈನ್‌ನಲ್ಲಿ ಕೆಲಸ ಮಾಡುತ್ತದೆ
1rem

ಸಂದರ್ಭ (rem/em/vw/vh/% ಮೇಲೆ ಪರಿಣಾಮ ಬೀರುತ್ತದೆ)

16 px ಗಾಗಿ ಎಲ್ಲಾ ಪರಿವರ್ತನೆಗಳು

ಹತ್ತಿರದ Tailwind ಟೋಕನ್‌ಗಳು (16px ರೂಟ್‌ನಲ್ಲಿ)

ಸಾಮಾನ್ಯ ಪಿಕ್ಸೆಲ್ ಗಾತ್ರಗಳು → rem (16px ಆಧಾರದಲ್ಲಿ)

ಅಂಟಿಸಿದ CSS ಪರಿವರ್ತಿಸಿ

ಇದು ಹೇಗೆ ಕೆಲಸ ಮಾಡುತ್ತದೆ

ಎಲ್ಲಾ ಪರಿವರ್ತನೆಗಳು ಶೂನ್ಯ ಅವಲಂಬನೆಗಳೊಂದಿಗೆ ಕೈಬರಹದ ಗಣಿತ ಎಂಜಿನ್ ಬಳಸಿ ಸಂಪೂರ್ಣವಾಗಿ ನಿಮ್ಮ ಬ್ರೌಸರ್‌ನಲ್ಲಿ ಚಾಲನೆಯಾಗುತ್ತವೆ. ಟೂಲ್ ಏಳು CSS ಘಟಕಗಳ ನಡುವೆ (px, rem, em, pt, vw, vh, ಮತ್ತು %) ಪ್ರತಿ ಗಣನೆಯನ್ನು ಸಾಮಾನ್ಯ ಆಧಾರವಾಗಿ ಪಿಕ್ಸೆಲ್‌ಗಳ ಮೂಲಕ ಮಾರ್ಗನಿರ್ದೇಶಿಸಿ, ನಿಮ್ಮ ಕಾನ್ಫಿಗರ್ ಮಾಡಿದ ರೂಟ್ ಫಾಂಟ್ ಗಾತ್ರ, ಪೋಷಕ ಫಾಂಟ್ ಗಾತ್ರ, ಅಥವಾ ವ್ಯೂಪೋರ್ಟ್ ಆಯಾಮಗಳ ವಿರುದ್ಧ ಸರಳ ಭಾಗಾಕಾರ ಅಥವಾ ಗುಣಾಕಾರ ಅನ್ವಯಿಸುತ್ತದೆ.

  1. 1
    ನಿಮ್ಮ ಸಂದರ್ಭ ಮೌಲ್ಯಗಳನ್ನು ಹೊಂದಿಸಿ
    ಪರಿವರ್ತಿಸುವ ಮೊದಲು, ಸಂಬಂಧಿತ CSS ಘಟಕಗಳನ್ನು ಅರ್ಥಪೂರ್ಣಗೊಳಿಸುವ ನಾಲ್ಕು ಸಂಖ್ಯೆಗಳನ್ನು ನೀವು ಕಾನ್ಫಿಗರ್ ಮಾಡುತ್ತೀರಿ: ರೂಟ್ ಫಾಂಟ್ ಗಾತ್ರ (ಡೀಫಾಲ್ಟ್ 16px, ಬ್ರೌಸರ್ ಡೀಫಾಲ್ಟ್), ಪೋಷಕ ಎಲಿಮೆಂಟ್ ಫಾಂಟ್ ಗಾತ್ರ (em ಮತ್ತು % ಪರಿವರ್ತನೆಗಳಿಗೆ), ಮತ್ತು ವ್ಯೂಪೋರ್ಟ್ ಅಗಲ ಮತ್ತು ಎತ್ತರ (vw ಮತ್ತು vh ಗೆ). ರನ್‌ಟೈಮ್‌ನಲ್ಲಿ CSS ಪರಿಹರಿಸುವಾಗ ನಿಮ್ಮ ಬ್ರೌಸರ್ ಬಳಸುವ ಅದೇ ಮೌಲ್ಯಗಳು ಇವು.
  2. 2
    ಸಾರ್ವತ್ರಿಕ ಮಧ್ಯಂತರವಾಗಿ ಪಿಕ್ಸೆಲ್
    ಪರಿವರ್ತಕ ಮೊದಲು ನಿಮ್ಮ ಇನ್‌ಪುಟ್ ಅನ್ನು ಕಚ್ಚಾ ಪಿಕ್ಸೆಲ್ ಎಣಿಕೆಗೆ ಸಾಮಾನ್ಯಗೊಳಿಸಲು toPixels() ಅನ್ನು ಕರೆಯುತ್ತದೆ — ಉದಾಹರಣೆಗೆ, 1.5rem 1.5 × baseFontPx ಆಗುತ್ತದೆ, ಮತ್ತು 50vw 0.5 × vpWidth ಆಗುತ್ತದೆ. ನಂತರ fromPixels() ಆ ಪಿಕ್ಸೆಲ್ ಎಣಿಕೆಯನ್ನು ಗುರಿ ಘಟಕದ ಸೂಕ್ತ ಅಂಶದಿಂದ ಭಾಗಿಸುತ್ತದೆ. ಎಲ್ಲಾ ಏಳು ಘಟಕಗಳನ್ನು ಪರಿವರ್ತನೆ ಟೇಬಲ್‌ನಲ್ಲಿ ಏಕಕಾಲದಲ್ಲಿ ತೋರಿಸಲಾಗುತ್ತದೆ.
  3. 3
    ಹತ್ತಿರದ Tailwind ಟೋಕನ್ ಲುಕಪ್
    ಪರಿವರ್ತಿಸಿದ ನಂತರ, ಟೂಲ್ rem ಮೌಲ್ಯವನ್ನು ಗಣಿಸಿ ಎರಡು ಹಾರ್ಡ್‌ಕೋಡ್ ಮಾಡಿದ ಲುಕಪ್ ಟೇಬಲ್‌ಗಳನ್ನು ಸ್ಕ್ಯಾನ್ ಮಾಡುತ್ತದೆ — Tailwind ನ ಹದಿಮೂರು ಫಾಂಟ್-ಗಾತ್ರ ಟೋಕನ್‌ಗಳು (text-xs ರಿಂದ text-9xl) ಮತ್ತು ಅದರ ಅಂತರ ಪ್ರಮಾಣ — ಸಂಪೂರ್ಣ ದೂರದಿಂದ ಹತ್ತಿರದ ಹೊಂದಾಣಿಕೆ ಕಂಡುಹಿಡಿಯುತ್ತದೆ. = ಚಿಹ್ನೆ ಎಂದರೆ ಮೌಲ್ಯ ನಿಖರ ಟೋಕನ್; ≈ ಎಂದರೆ ಇದು ಹತ್ತಿರದ ಅಂದಾಜು.
  4. 4
    regex ಮೂಲಕ ಬ್ಯಾಚ್ CSS ಮರುಬರೆಯುವಿಕೆ
    ಅಂಟಿಸಿ-CSS ಪ್ಯಾನೆಲ್ ಕಚ್ಚಾ CSS ಪಠ್ಯವನ್ನು ಸ್ವೀಕರಿಸಿ regex ಬದಲಿ ಅನ್ವಯಿಸುತ್ತದೆ: px→rem ಮೋಡ್‌ನಲ್ಲಿ ಇದು ಪ್ರತಿ px ಟೋಕನ್ ಅನ್ನು ಹೊಂದಿಸಿ ಸಂಖ್ಯಾ ಭಾಗವನ್ನು value/baseFontPx + rem ಆಗಿ ಬದಲಾಯಿಸುತ್ತದೆ; rem→px ಮೋಡ್‌ನಲ್ಲಿ ಇದು ಹಿಮ್ಮುಖ ಮಾಡುತ್ತದೆ. ಎಷ್ಟು ಮೌಲ್ಯಗಳನ್ನು ಮರುಬರೆಯಲಾಗಿದೆ ಎಂದು ನೀವು ಪರಿಶೀಲಿಸಲು ಬದಲಿ ಎಣಿಕೆ ತೋರಿಸಲಾಗುತ್ತದೆ.

ಸಂಬಂಧಿತ ಪರಿಕರಗಳು

📏

ಘಟಕ ಪರಿವರ್ತಕ

ಉದ್ದ, ತೂಕ, ತಾಪಮಾನ, ಪ್ರದೇಶ, ಪರಿಮಾಣ ಮತ್ತು ಹೆಚ್ಚಿನ ಘಟಕಗಳ ನಡುವೆ ಪರಿವರ್ತಿಸಿ.

ಇದನ್ನು ಪ್ರಯತ್ನಿಸಿ
📐

CSS clamp() ಜನರೇಟರ್

ರೆಸ್ಪಾನ್ಸಿವ್ ಟೈಪೋಗ್ರಫಿ ಮತ್ತು ಸ್ಪೇಸಿಂಗ್‌ಗಾಗಿ ಫ್ಲುಯಿಡ್ CSS clamp() ಮೌಲ್ಯ ರಚಿಸಿ. ಕನಿಷ್ಠ/ಗರಿಷ್ಠ ಗಾತ್ರ ಮತ್ತು ವ್ಯೂಪೋರ್ಟ್ ವ್ಯಾಪ್ತಿ ಹೊಂದಿಸಿ, ಲೈವ್ ಪೂರ್ವವೀಕ್ಷಣೆ ನೋಡಿ, ಮತ್ತು ಒಂದು-ಸಾಲಿನ CSS ನಕಲಿಸಿ.

ಇದನ್ನು ಪ್ರಯತ್ನಿಸಿ
🟦

CSS ಗ್ರಿಡ್ ಜನರೇಟರ್

CSS ಗ್ರಿಡ್ ಅನ್ನು ದೃಷ್ಯವಾಗಿ ವಿನ್ಯಾಸಗೊಳಿಸಿ — ಟ್ರ್ಯಾಕ್‌ಗಳು, ಯುನಿಟ್‌ಗಳು ಮತ್ತು ಗ್ಯಾಪ್‌ಗಳು — ಮತ್ತು ಜನರೇಟ್ ಆದ CSS ಹಾಗೂ HTML ಅನ್ನು ಕಾಪಿ ಮಾಡಿ.

ಇದನ್ನು ಪ್ರಯತ್ನಿಸಿ

ಪದೇ ಪದೇ ಕೇಳಲಾಗುವ ಪ್ರಶ್ನೆಗಳು