--tab-size-* is a reference to a variable that you need to define yourself in @theme. Only after that should you write the animation, using not the variable itself but a specific value, for example tab-4 or any other value you’ve defined. Right now you’re trying to do it directly inside @theme.

@theme is only needed for defining variables or other reusable properties, such as @keyframes.

@theme {  
--tab-size-2: 2;  
--tab-size-4: 4;  
--tab-size-github: 8;
}
@utility tab-* {  
tab-size: --value(--tab-size-*);
}

P.S. If I understood you correctly