Animation Presets

Reference

shilp.config.jscopy to clipboard
/** @type {import('shilpcss/types').ShilpConfig} */
const shilpConfig = {
  source: "react",

  properties: {
    animate: {
      preset: {
        property: "animation: <v><i>;",
        values: {
          // animation: name [duration] [flow] [delay] [loop] [path] [mode] [state];
          none: "none",
          spin: "spin 1s linear infinite",
          ping: `ping 1s theme(flow-ease-out) infinite`,
          pulse: `pulse 2s theme(flow-pulse) infinite`,
          bounce: "bounce 1s infinite",
          wiggle: "wiggle 1s theme(flow-ease-in-out) infinite",
        },
      },
    },
  },
};

export default shilpConfig;