diff --git a/src/components/ui/UIButton.vue b/src/components/ui/UIButton.vue
index f625708..c2f061c 100644
--- a/src/components/ui/UIButton.vue
+++ b/src/components/ui/UIButton.vue
@@ -14,9 +14,12 @@ const props = withDefaults(defineProps<Props>(), {
 })
 
 const styleClass = computed(() => {
+  const colorVariants: { [key: string]: string } = {
+    primary: 'btn-primary'
+  }
   const sizeClass = `btn-${props.size}`
   const variantClass = props.variant !== 'regular' ? `btn-${props.variant}` : ''
-  const colorClass = props.color !== 'regular' ? `btn-${props.color}` : ''
+  const colorClass = props.color !== 'regular' ? colorVariants[props.color] : ''
   return [sizeClass, variantClass, colorClass]
 })
 </script>