diff --git a/crates/leptos/src/button.rs b/crates/leptos/src/button.rs
index ea85b0e..d1a1c00 100644
--- a/crates/leptos/src/button.rs
+++ b/crates/leptos/src/button.rs
@@ -1,7 +1,7 @@
 use components_core::{BASE_CLASS, concat};
 use leptos::{ev::MouseEvent, prelude::*};
 
-#[derive(Default, Debug, PartialEq)]
+#[derive(Default, Debug, PartialEq, Clone, Copy)]
 pub enum Variant {
     #[default]
     Primary,
@@ -13,17 +13,12 @@ pub enum Variant {
 #[component]
 pub fn Button(
     #[prop(into, optional)] variant: Variant,
-    #[prop(into, optional)] class: String,
+    #[prop(into, optional)] class: Option<String>,
     on_click: impl FnMut(MouseEvent) + 'static,
     #[prop(into, optional)] icon: Option<AnyView>,
     #[prop(into, optional)] label: Option<String>,
 ) -> impl IntoView {
-    let var = format!(
-        "{}{}",
-        concat!(BASE_CLASS, "-button", "--"),
-        format!("{variant:?}").to_lowercase()
-    );
-    let class = crate::tw!("text-button", var, concat!(BASE_CLASS, "-button"), class);
+    let class = button_class(variant, class);
 
     view! {
         <button class=class on:click=on_click>
@@ -32,3 +27,13 @@ pub fn Button(
         </button>
     }
 }
+
+pub fn button_class(variant: Variant, class: Option<String>) -> String {
+    let var = format!(
+        "{}{}",
+        concat!(BASE_CLASS, "-button", "--"),
+        format!("{variant:?}").to_lowercase()
+    );
+
+    crate::tw!("text-button", var, concat!(BASE_CLASS, "-button"), class)
+}