const e = (o) => {
  const { color: n, spacing: t } = o;
  return {
    ".avatar": {
      position: "relative",
      display: "inline-block"
    },
    ".avatar-icon": {
      color: n("content.inverse.strong"),
      backgroundColor: n("interaction.default"),
      fontWeight: "600",
      width: t(10),
      height: t(10),
      borderRadius: "50%",
      display: "flex",
      alignItems: "center",
      justifyContent: "center"
    },
    ".avatar-icon-sm": {
      width: t(8),
      height: t(8)
    }
  };
}, i = {
  getComponents: e
};
export {
  i as TailwindAvatar
};
