# UnitShift — CSS Unit Converter

> Convert px, rem, and em units with one click inside Firefox DevTools. Select any element and apply conversions live.

Canonical page: [https://chrome-stats.com/d/unitshift-css-unit-converter](https://chrome-stats.com/d/unitshift-css-unit-converter)

## Overview

- **ID:** `unitshift-css-unit-converter`
- **Platform:** Firefox
- **Type:** Firefox add-on
- **Status:** Available
- **Publisher:** Dixie Raiz Pacheco
- **Category:** web-development
- **Daily users:** 1
- **Rating:** 5.00 / 5 (2 ratings)
- **Version:** 1.0.0
- **Last updated:** 2026-02-14
- **First published:** 2026-02-11
- **Size:** 668 KB
- **Data as of:** 2026-09-15
- **Store listing:** [Firefox Add-ons Store](https://addons.mozilla.org/firefox/addon/unitshift-css-unit-converter/)
- **Website:** [https://dixieraizpacheco.com/](https://dixieraizpacheco.com/)

## Description

UnitShift is a DevTools sidebar that converts CSS units (px, rem, em) with one click — right where you're already inspecting elements.

The problem: AI-generated code and Figma-to-code workflows output everything in px. Converting to rem or em means mental math, calculators, or separate tools outside your workflow. Letter-spacing is especially tricky — its em value is relative to the element's own font-size, not the parent's.

How it works:

Open DevTools → Inspector panel
Select any element
UnitShift reads all computed CSS properties with unit values
Click a convert button to switch between px, rem, and em
The value is applied as an inline style instantly — same as editing in the Rules pane
Features:

Context-aware em conversion — knows that letter-spacing, word-spacing, and line-height use the element's own font-size, while padding, margin, and other box model properties use the parent's
Properties grouped by category: Typography, Spacing, Sizing, Position, Border
Bulk "Convert All" to switch every value at once
Configurable base font-size (default 16px)
Zero configuration needed — works out of the box
No permissions beyond DevTools access
Pure HTML/CSS/JS, no frameworks, no external requests
Who it's for: Front-end developers who work in DevTools daily, build from Figma designs, and need responsive, accessible CSS.

Built by Dixie Raiz Pacheco — <a href="https://prod.outgoing.prod.webservices.mozgcp.net/v1/057680d45fad1e2401934ef087b760ce11f251ff0e0b047230baac81029b4635/http%3A//dixieraizpacheco.com" rel="nofollow">dixieraizpacheco.com</a>

## Rankings

- #74,365 — Overall
- #143 — shift
- #247 — figma

## Permissions and access

### Permissions

- `storage`

## Safety

- **Risk impact:** Low risk impact
- **Risk likelihood:** Moderate risk likelihood

### Analysis details

- Access to developer tools, typically low risk unless it's used to inspect or manipulate data improperly.
- This extension has low user count. Unpopular extensions may not be stable or safe.

> Some risk analysis details are omitted from this free response. [Upgrade to view the full analysis](https://chrome-stats.com/pricing).

## Similar extensions and apps

- [CSS Unit Converter](https://chrome-stats.com/d/css-unit-converter) — 4 users, 5.00 / 5
- [CSS Units](https://chrome-stats.com/d/css-units) — 5 users
- [PX to REM Converter](https://chrome-stats.com/d/px-to-rem-instant) — 1 users
- [CSS Size converter](https://chrome-stats.com/d/css-size-converter)
- [PX to REM](https://chrome-stats.com/d/px-to-rem) — 27 users, 5.00 / 5
- [Unit Converter](https://chrome-stats.com/d/unit-converter4) — 5 users, 5.00 / 5
- [Px/Rem](https://chrome-stats.com/d/px-rem) — 1 users
- [Ruler Grid](https://chrome-stats.com/d/ruler-grid) — 40 users
- [Metric Glance](https://chrome-stats.com/d/metric-glance) — 7 users
- [Unit Conv](https://chrome-stats.com/d/unit-conv) — 5 users
- [Pixel measurement](https://chrome-stats.com/d/pixel-measurement) — 47 users
- [UnitSwift](https://chrome-stats.com/d/unitswift)

---

Source: [Chrome-Stats](https://chrome-stats.com/d/unitshift-css-unit-converter)