properties
changelog

Skew Transform

Apply skew transforms to distort elements along axes.

Usage:

  • @adjust skew-*;
  • @adjust skew-x-*;
  • @adjust skew-y-*;

Reference

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

	properties: {
		adjust: {
			skew: {
				DEFAULT: {
					property: "--skw: skew(<n><v>, <n><v>)<i>;",
					themeKey: "angles",
					values: {},
				},

				x: {
					property: "--skw-x: skewX(<n><v>)<i>;",
					themeKey: "angles",
					values: {},
				},

				y: {
					property: "--skw-y: skewY(<n><v>)<i>;",
					themeKey: "angles",
					values: {},
				},
			},
		},
	},
};

export default shilpConfig;