Organize/components/board/hand-drawn-check.tsx

26 lines
776 B
TypeScript

/**
* A deliberately imperfect checkmark: two uneven bezier strokes instead of
* crisp straight lines, so it reads as drawn rather than rendered. The
* upstroke's tip ends above y=0 in the viewBox on purpose -- rendered with
* `overflow-visible` at roughly the checkbox's own size, only that tip
* pokes out the top of the box, while the rest stays flush inside it.
*/
export function HandDrawnCheck({ className }: { className?: string }) {
return (
<svg
viewBox="0 0 24 24"
fill="none"
className={className}
aria-hidden="true"
>
<path
d="M4 12.3 Q6.3 15 9.5 19 Q15 10.3 21 -3"
stroke="currentColor"
strokeWidth="3.6"
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
);
}