style-genie
    TypeScript icon, indicating that this package has built-in type declarations

    0.4.1 • Public • Published

    Style-genie 🧞‍♂️🧞‍♀️

    A collection of style utilities for css-in-js frameworks.

    Made with typescript and well documented with support for in-editor insights and tooltips.

    Documentation

    Badges

    types included latest version code quality license known vulnerabilities

    Why?

    The idea behind this project is to collect and improve on commonly used and often wanted style utilities. It is heavily influenced by the utilities material-ui have in their theme object, but without all the burden that comes with it.

    Style-genie's modularized architecture allows you to pick only the functionalities you want and shape them however you like in your app.

    It is also meant to have as few dependencies as possible, currently we depend on 0 external non-dev dependencies.

    Getting started

    npm install style-genie
    import {
      generateBreakpoint,
      generateColor,
      generateSpacing,
      generateTransform,
      generateTransition
    } from 'style-genie'

    Utilities

    The currently offered utilities are:

    • Breakpoint: Media query strings generated based on customizable values.
    • Color: Gives easy access to custom colors and the ability to manipulate them.
    • Spacing: Maintain a coherent spacing calculation throughout the app.
    • Transform: Generate multiple transform function strings easily without the need of template strings.
    • Transition: Generate transition strings without repetitive typing.

    Install

    npm i style-genie

    DownloadsWeekly Downloads

    19

    Version

    0.4.1

    License

    MIT

    Unpacked Size

    191 kB

    Total Files

    79

    Last publish

    Collaborators

    • avatar