components/halves/Tag.tsx

import type { ReactNode } from "react";

export function Tag({
  children,
  tone = "ink",
}: {
  children: ReactNode;
  tone?: "ink" | "red" | "white" | "rose" | "sparkling";
}) {
  return (
    <span className={`tag tag--${tone}`}>
      <i aria-hidden="true" />
      {children}
    </span>
  );
}

export function Stamp({ children }: { children: ReactNode }) {
  return <span className="stamp">{children}</span>;
}