properties
changelog

Gradient Color Mask

Apply gradient as a mask to elements.

Usage:

  • @mask gradient-*;
  • @mask gradient-linear-*;
  • @mask gradient-radial-*;
  • @mask gradient-conic-*;

Reference

shilp.config.js
const shilpConfig = {
	source: "react",

	properties: {
		mask: {
			gradient: {
				DEFAULT: {
					property: "mask-image: <v><i>;",
					values: {},
				},

				linear: {
					property: "mask-image: linear-gradient(<v>)<i>;",
					values: {},
				},

				radial: {
					property: "mask-image: radial-gradient(<v>)<i>;",
					values: {},
				},

				conic: {
					property: "mask-image: conic-gradient(<v>)<i>;",
					values: {},
				},
			},
		},
	},
};

export default shilpConfig;