react-design-tools

0.0.8 • Public • Published

react-design-tools

Tools for making pixel-perfect designs with React

Demo

Edit 6vr85vjq1k

screenshot

Using

PaletteLookup

 
const colors = {
  primary: "#336699",
  secondary: "#cccccc",
  skyBlue: "#3399cc"
}
 
<PaletteLookup palette={colors} />

See this gist for a way to parse SCSS variables into ES modules.

DiffTool

import designImgUrl from "./design.png"
 
// dimensions, currently required (may be able to extract them in a future release)
const w = 500;
const h = 250;
 
<DiffTool imgUrl={designImgUrl} imgHeight={h} imgWidth={w}>
  <MyComponent />
</Difftool>

License

MIT

Readme

Keywords

none

Package Sidebar

Install

npm i react-design-tools

Weekly Downloads

0

Version

0.0.8

License

MIT

Unpacked Size

36.9 kB

Total Files

18

Last publish

Collaborators

  • alexkrolick