tailwindcss-retina

    1.0.1 • Public • Published

    Tailwind CSS Retina plugin

    Enable variants for high pixel density displays

    Install the plugin from npm:

    $ npm install tailwindcss-retina
    

    Then add the plugin to your tailwind.config.js file:

    // tailwind.config.js
    module.exports = {
      // ...
      variants: {
        // ...
        fontWeight: ['retina'],
        // ...
      },
      plugins: [
        // ...
        require('tailwindcss-retina'),
        // ...
      ],
    };

    This plugin will generate following CSS:

    /* ... */
    .font-thin {
      font-weight: 100;
    }
    /* ... */
    @media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi) {
      .retina\:font-thin {
        font-weight: 100;
      }
      /* ... */
    }
    /* ... */

    License

    Tailwindcss Retina is licensed under the MIT License.

    Credits

    Created with create-tailwind-plugin.

    Install

    npm i tailwindcss-retina

    DownloadsWeekly Downloads

    4

    Version

    1.0.1

    License

    MIT

    Unpacked Size

    22.9 kB

    Total Files

    11

    Last publish

    Collaborators

    • avatar