$ pnpm add @b1nd/dodam-design-system/shapes

import styled from "@emotion/styled";
import { shapes } from "@b1nd/dodam-design-system/shapes";

const Card = () => (
  <Div>
    Content
  </Div>
);

const Div = styled.div`
  border-radius: ${shapes.large};
`;

/* globals.css */
@import "@b1nd/dodam-design-system/shapes/tokens.tailwind.css";

// 사용 예시
<div className="rounded-medium">Content</div>

import { shapes } from "@b1nd/dodam-design-system/shapes";

const Card = ({ children }) => (
  <div 
    style={{ 
      borderRadius: shapes.large,
      padding: "20px",
      backgroundColor: colors.background.surface,
    }}
  >
    {children}
  </div>
);

import { shapes } from "@b1nd/dodam-design-system/shapes";

const Button = ({ children }) => (
  <button 
    style={{ 
      borderRadius: shapes.small,
      padding: "8px 16px"
    }}
  >
    {children}
  </button>
);

import { shapes } from "@b1nd/dodam-design-system/shapes";

const Chip = ({ children }) => (
  <span 
    style={{ 
      borderRadius: shapes.extraLarge,
      padding: "4px 12px"
    }}
  >
    {children}
  </span>
);