# evrone/postcss-px-to-viewport

A plugin for PostCSS that generates viewport units (vw, vh, vmin, vmax) from pixel units. The best choice to create a scalable interface on different displays by one design size.

Repository: https://github.com/evrone/postcss-px-to-viewport
Canonical: https://ross.abutalabs.com/products/postcss-px-to-viewport
Homepage: https://evrone.com/postcss-px-viewport
Language: JavaScript
License: MIT
License Family: permissive
Topics: postcss, pixel-units, viewport-units, vw, vh, css-scale, mobile-design, media-queries, rem-units, taro
Last push: 2024-06-18T10:27:27+00:00

## Health v2 (maintenance only)
Score: 23/100 (v2, computed 2026-09-02T17:46:02.011165+00:00)
- activity 0, release rhythm 8, longevity 100
- inputs: {"age_days": 3880, "days_push": 806, "days_rel": null, "gap_med": null, "n_releases_24m": 0}
- flags: none
- formula: round(0.45*activity + 0.35*rhythm + 0.20*longevity); archived -> min(score, 10)

## Adoption (not part of the score)
Stars 3153, forks 407 (observed 2026-08-28T04:07:46.234907+00:00)

## What it is
A PostCSS plugin that automatically converts pixel (px) units in CSS into viewport units (vw, vh, vmin, vmax). It enables building scalable interfaces from a single design size, especially for mobile-first responsive layouts.

## Use cases
- convert px to vw units in css
- make mobile design scale across screen sizes
- responsive layout from one fixed-width design
- postcss plugin for viewport units
- scale css for different displays automatically
- convert pixel units to vw for taro project

## When to choose
- You have a fixed-width design (e.g., 320px or 750px) and want the whole interface to scale fluidly
- You are building mobile web apps or mini-programs (e.g., with Taro) that need viewport-based sizing
- You want automatic, configurable conversion with ignore comments, selector blacklists, and landscape support

## When to avoid
- You use fluid layouts already written in rem/em or native responsive units
- You need pixel-perfect rendering at fixed breakpoints rather than proportional scaling
- Your project does not use a PostCSS-based build pipeline

## Facets
- artifact type: plugin
- maturity: stable
- function: css-framework, build-tool, developer-tools
- domain: frontend, web-development, mobile-development
- platform: cross-platform
- tags: postcss-plugin, viewport-units, responsive-design, mobile-first, css-units, px-to-vw, nodejs

## Member repositories
- evrone/postcss-px-to-viewport (main) score 23

## Provenance
- Observed fields: from GitHub, fetched 2026-08-28T04:07:46.234907+00:00.
- Health v2: computed from the inputs above; adoption is never an input.
- Inferred fields (summary, facets, guidance): AI-extracted, prompt v1, taxonomy v1, on 2026-08-30T07:25:40.819938+00:00, confidence not recorded.
  - readme: https://github.com/evrone/postcss-px-to-viewport (fetched 2026-08-28T04:07:46.234907+00:00, sha 4b7609aa872f)
  - registry_npm: https://registry.npmjs.org/postcss-px-to-viewport (fetched 2026-08-29T09:40:25.474117+00:00, sha 6998dcbdde04)
- Data as of 2026-08-30T08:39:29.467469+00:00.
