GitHunt
KR

kristerkari/css-viewport-units-transform

Transform CSS viewport units of a Javascript style object to pixels based on window dimensions

css-viewport-units-transform

Build Status
Coverage Status
Size
contributions welcome

Transform CSS viewport units of a Javascript style object to pixels based on window dimensions.

Supports vw, vh, vmin and vmax units.

import { transform } from "css-viewport-units-transform";
// or const transform = require("css-viewport-units-transform").transform;

transform(
  {
    fontSize: "10vw"
  },
  {
    width: 480,
    height: 100
  }
);

↓ ↓ ↓ ↓ ↓ ↓

{
  fontSize: 48;
}

or

transform(
  {
    myClass: {
      fontSize: "10vh"
    }
  },
  {
    width: 480,
    height: 100
  }
);

↓ ↓ ↓ ↓ ↓ ↓

{
  myClass: {
    fontSize: 10,
  }
}

Dependencies

  • None

Languages

JavaScript100.0%

Contributors

MIT License
Created May 31, 2018
Updated May 27, 2025
kristerkari/css-viewport-units-transform | GitHunt