To address the issue, I applied the p-0 class to the CheckboxPrimitive.Root component, which effectively removed all padding. This adjustment improved the checkbox rendering, aligning the SVG icon correctly.

However, I’m not entirely confident that this fully resolves the problem. It’s possible that padding from a button or other surrounding elements is also affecting the checkbox alignment. Further investigation into how the button’s padding influences the checkbox might be needed to ensure a complete fix. enter image description here

I hope this resolves your issue!enter code here