@andreibratila/tailwind-utopia/config/spacing-config.js

A Tailwindcss v4 library for fluid typography and spacing with Utopia

export default {
  margin: {
    m: ["margin"],
    mt: ["margin-top"],
    mr: ["margin-right"],
    mb: ["margin-bottom"],
    ml: ["margin-left"],
    mx: ["margin-left", "margin-right"],
    my: ["margin-top", "margin-bottom"],
    ms: ["margin-inline-start"],
    me: ["margin-inline-end"],
    "-m": ["margin"],
    "-mt": ["margin-top"],
    "-mr": ["margin-right"],
    "-mb": ["margin-bottom"],
    "-ml": ["margin-left"],
    "-mx": ["margin-left", "margin-right"],
    "-my": ["margin-top", "margin-bottom"],
    "-ms": ["margin-inline-start"],
    "-me": ["margin-inline-end"],
  },
  padding: {
    p: ["padding"],
    pt: ["padding-top"],
    pr: ["padding-right"],
    pb: ["padding-bottom"],
    pl: ["padding-left"],
    px: ["padding-left", "padding-right"],
    py: ["padding-top", "padding-bottom"],
    ps: ["padding-inline-start"],
    pe: ["padding-inline-end"],
  },
  space: {
    "space-x": ["margin-left", "margin-right"],
    "space-y": ["margin-top", "margin-bottom"],
    "-space-x": ["margin-left", "margin-right"],
    "-space-y": ["margin-top", "margin-bottom"],
  },
  border: {
    "border-spacing": [],
  },
  gap: {
    gap: ["gap"],
    "gap-x": ["column-gap"],
    "gap-y": ["row-gap"],
  },
  width: {
    w: ["width"],
    "min-w": ["min-width"],
    "max-w": ["max-width"],
  },
  height: {
    h: ["height"],
    "max-h": ["max-height"],
    "min-h": ["min-height"],
  },
  size: {
    size: ["width", "height"],
  },
  flex: {
    basis: ["flex-basis"],
  },

  position: {
    indent: ["text-indent"],
    "-indent": ["text-indent"],
    inset: ["top", "right", "bottom", "left"],
    "inset-x": ["left", "right"],
    "inset-y": ["top", "bottom"],
    "-inset": ["top", "right", "bottom", "left"],
    "-inset-x": ["left", "right"],
    "-inset-y": ["top", "bottom"],
    top: ["top"],
    right: ["right"],
    bottom: ["bottom"],
    left: ["left"],
    end: ["inset-inline-end"],
    start: ["inset-inline-start"],
    "-top": ["top"],
    "-right": ["right"],
    "-bottom": ["bottom"],
    "-left": ["left"],
    "-end": ["inset-inline-end"],
    "-start": ["inset-inline-start"],
  },
  scroll: {
    "scroll-m": ["scroll-margin"],
    "scroll-mx": ["scroll-margin-left", "scroll-margin-right"],
    "scroll-my": ["scroll-margin-top", "scroll-margin-bottom"],
    "scroll-mt": ["scroll-margin-top"],
    "scroll-mr": ["scroll-margin-right"],
    "scroll-mb": ["scroll-margin-bottom"],
    "scroll-ml": ["scroll-margin-left"],
    "scroll-ms": ["scroll-margin-inline-start"],
    "scroll-me": ["scroll-margin-inline-end"],
    "-scroll-m": ["scroll-margin"],
    "-scroll-mx": ["scroll-margin-left", "scroll-margin-right"],
    "-scroll-my": ["scroll-margin-top", "scroll-margin-bottom"],
    "-scroll-mt": ["scroll-margin-top"],
    "-scroll-mr": ["scroll-margin-right"],
    "-scroll-mb": ["scroll-margin-bottom"],
    "-scroll-ml": ["scroll-margin-left"],
    "-scroll-ms": ["scroll-margin-inline-start"],
    "-scroll-me": ["scroll-margin-inline-end"],
    "scroll-p": ["scroll-padding"],
    "scroll-px": ["scroll-padding-left", "scroll-padding-right"],
    "scroll-py": ["scroll-padding-top", "scroll-padding-bottom"],
    "scroll-pt": ["scroll-padding-top"],
    "scroll-pr": ["scroll-padding-right"],
    "scroll-pb": ["scroll-padding-bottom"],
    "scroll-pl": ["scroll-padding-left"],
    "scroll-ps": ["scroll-padding-inline-start"],
    "scroll-pe": ["scroll-padding-inline-end"],
  },
};