tailwindcss/src/plugins/mixBlendMode.js
Adam Wathan 1cb060d34e
Add mix-blend-mode and background-blend-mode utilities (#3920)
* Add mix-blend-mode utilities

* Rename mix-blend-mode utilities to `mix-blend-*`

Co-Authored-By: Peter Neupauer <peter@neupauer.sk>

* Add `background-blend-mode` utilities

Co-Authored-By: Peter Neupauer <peter@neupauer.sk>

Co-authored-by: Peter Neupauer <peter@neupauer.sk>
2021-04-04 06:50:05 -04:00

25 lines
1.2 KiB
JavaScript

export default function () {
return function ({ addUtilities, variants }) {
addUtilities(
{
'.mix-blend-normal': { 'mix-blend-mode': 'normal' },
'.mix-blend-multiply': { 'mix-blend-mode': 'multiply' },
'.mix-blend-screen': { 'mix-blend-mode': 'screen' },
'.mix-blend-overlay': { 'mix-blend-mode': 'overlay' },
'.mix-blend-darken': { 'mix-blend-mode': 'darken' },
'.mix-blend-lighten': { 'mix-blend-mode': 'lighten' },
'.mix-blend-color-dodge': { 'mix-blend-mode': 'color-dodge' },
'.mix-blend-color-burn': { 'mix-blend-mode': 'color-burn' },
'.mix-blend-hard-light': { 'mix-blend-mode': 'hard-light' },
'.mix-blend-soft-light': { 'mix-blend-mode': 'soft-light' },
'.mix-blend-difference': { 'mix-blend-mode': 'difference' },
'.mix-blend-exclusion': { 'mix-blend-mode': 'exclusion' },
'.mix-blend-hue': { 'mix-blend-mode': 'hue' },
'.mix-blend-saturation': { 'mix-blend-mode': 'saturation' },
'.mix-blend-color': { 'mix-blend-mode': 'color' },
'.mix-blend-luminosity': { 'mix-blend-mode': 'luminosity' },
},
variants('mixBlendMode')
)
}
}