diff --git a/docs/components_page/__init__.py b/docs/components_page/__init__.py
index 80f80d9a9..c72fcedac 100644
--- a/docs/components_page/__init__.py
+++ b/docs/components_page/__init__.py
@@ -3,42 +3,9 @@
 
 import dash
 import dash_bootstrap_components as dbc
-from dash import dcc, html
+from dash import html
 from jinja2 import Environment, FileSystemLoader
 
-
-# TODO: delete once Dash 2.0 is released
-def class_name_shim(fn):
-    def new_init(self, *args, **kwargs):
-        kwargs["className"] = kwargs.get("class_name", kwargs.get("className"))
-        return fn(
-            self,
-            *args,
-            **{k: v for k, v in kwargs.items() if k != "class_name"},
-        )
-
-    return new_init
-
-
-for component in [
-    dcc.Markdown,
-    html.A,
-    html.Blockquote,
-    html.Div,
-    html.H1,
-    html.H2,
-    html.H3,
-    html.H4,
-    html.H5,
-    html.H6,
-    html.Hr,
-    html.I,
-    html.P,
-    html.Small,
-]:
-    component.__init__ = class_name_shim(component.__init__)
-
-
 from .components.table.simple import table_body, table_header  # noqa
 from .components.tabs.simple import tab1_content, tab2_content  # noqa
 from .markdown_parser import parse  # noqa
@@ -195,11 +162,11 @@ def register_apps():
 
         if slug == "layout":
             app.layout = html.Div(
-                parse(app, **kwargs), class_name="layout-demo"
+                parse(app, **kwargs), className="layout-demo"
             )
         elif slug == "button_group":
             app.layout = html.Div(
-                parse(app, **kwargs), class_name="button-group-demo"
+                parse(app, **kwargs), className="button-group-demo"
             )
         else:
             app.layout = parse(app, **kwargs)
diff --git a/docs/components_page/components/__tests__/helpers.py b/docs/components_page/components/__tests__/helpers.py
index 87c08350c..d201da06f 100644
--- a/docs/components_page/components/__tests__/helpers.py
+++ b/docs/components_page/components/__tests__/helpers.py
@@ -8,13 +8,7 @@ def py_source_to_app(py_source, env):
     Create a Dash app from a string defining the app.
     """
     env = env or {}
-    # TODO: remove class_name modifiers
-    exec(
-        py_source.replace("class_name", "className").replace(
-            "_className", "_class_name"
-        ),
-        env,
-    )
+    exec(py_source, env)
     return env["app"]
 
 
@@ -61,27 +55,19 @@ def load_r_app(path, component_name, extra_args=""):
     snippet = path.read_text()
     if extra_args:
         snippet = f"{extra_args}\n{snippet}"
-    return (
-        R_WRAPPER.format(
-            snippet=snippet,
-            components=component_name,
-            port=8050,
-        )
-        .replace("class_name", "className")
-        .replace("_className", "_class_name")
-    )  # TODO: remove this in future
+    return R_WRAPPER.format(
+        snippet=snippet,
+        components=component_name,
+        port=8050,
+    )
 
 
 def load_jl_app(path, component_name, extra_args=""):
     snippet = path.read_text()
     if extra_args:
         snippet = f"{extra_args}\n{snippet}"
-    return (
-        JL_WRAPPER.format(
-            snippet=snippet,
-            components=component_name,
-            port=8050,
-        )
-        .replace("class_name", "className")
-        .replace("_className", "_class_name")
-    )  # TODO: remove this in future
+    return JL_WRAPPER.format(
+        snippet=snippet,
+        components=component_name,
+        port=8050,
+    )
diff --git a/docs/components_page/components/__tests__/test_snippets.py b/docs/components_page/components/__tests__/test_snippets.py
index 24a8ec81b..a5e8249e0 100644
--- a/docs/components_page/components/__tests__/test_snippets.py
+++ b/docs/components_page/components/__tests__/test_snippets.py
@@ -141,8 +141,6 @@ def assert_layouts_equal(
             components=", ".join(x[2] for x in compare),
             port=port,
         )
-        .replace("class_name", "className")
-        .replace("_className", "_class_name")  # TODO: remove
     )
     layout = requests.get(f"{runner.url}/_dash-layout").json()
 
diff --git a/docs/components_page/components/__tests__/test_tabs.py b/docs/components_page/components/__tests__/test_tabs.py
index 876cd404f..ff786cf70 100644
--- a/docs/components_page/components/__tests__/test_tabs.py
+++ b/docs/components_page/components/__tests__/test_tabs.py
@@ -23,7 +23,6 @@ def test_jl_tabs_card(dashjl):
 
 
 def check_tabs_card_callbacks(runner):
-
     tab_links = runner.find_elements("#card-tabs > div.nav-item > a.nav-link")
     wait.until(lambda: tab_links[1].text == "Tab 2", timeout=4)
 
@@ -43,45 +42,44 @@ def check_tabs_card_callbacks(runner):
 tab1_content <- dbcCard(
     dbcCardBody(
         list(
-            htmlP("This is tab 1!", class_name = "card-text"),
+            htmlP("This is tab 1!", className = "card-text"),
             dbcButton("Click here", color = "success")
         )
     ),
-    class_name = "mt-3"
+    className = "mt-3"
 )
 
 tab2_content <- dbcCard(
     dbcCardBody(
         list(
-            htmlP("This is tab 2!", class_name = "card-text"),
+            htmlP("This is tab 2!", className = "card-text"),
             dbcButton("Don't click here", color = "danger")
         )
     ),
-    class_name = "mt-3",
+    className = "mt-3",
 )
 """
 
 active_tab_content_jl = """
 tab1_content = dbc_card(
     dbc_cardbody([
-        html_p("This is tab 1!", class_name="card-text"),
+        html_p("This is tab 1!", className="card-text"),
         dbc_button("Click here", color="success"),
     ]),
-    class_name="mt-3",
+    className="mt-3",
 );
 
 tab2_content = dbc_card(
     dbc_cardbody([
-        html_p("This is tab 2!", class_name="card-text"),
+        html_p("This is tab 2!", className="card-text"),
         dbc_button("Don't click here", color="danger"),
     ]),
-    class_name="mt-3",
+    className="mt-3",
 );
 """
 
 
 def test_r_tabs_active_tab(dashr):
-
     r_app = load_r_app(
         (HERE.parent / "tabs" / "active_tab.R"),
         "tabs",
@@ -92,7 +90,6 @@ def test_r_tabs_active_tab(dashr):
 
 
 def test_jl_tabs_active_tab(dashjl):
-
     jl_app = load_jl_app(
         (HERE.parent / "tabs" / "active_tab.jl"),
         "tabs",
@@ -103,7 +100,6 @@ def test_jl_tabs_active_tab(dashjl):
 
 
 def check_tabs_active_tab_callbacks(runner):
-
     # Get julia to wait until it's loaded
     wait.until(lambda: len(runner.find_elements(".card")) > 0, timeout=4)
 
diff --git a/docs/components_page/components/accordion/callback.R b/docs/components_page/components/accordion/callback.R
index d4ca52786..f14be924c 100644
--- a/docs/components_page/components/accordion/callback.R
+++ b/docs/components_page/components/accordion/callback.R
@@ -25,7 +25,7 @@ accordion <- htmlDiv(
       id = "accordion",
       active_item = "item-1"
     ),
-    htmlDiv(id = "accordion-contents", class_name = "mt-3")
+    htmlDiv(id = "accordion-contents", className = "mt-3")
   )
 )
 
diff --git a/docs/components_page/components/accordion/callback.jl b/docs/components_page/components/accordion/callback.jl
index a66c293d8..9925c472a 100644
--- a/docs/components_page/components/accordion/callback.jl
+++ b/docs/components_page/components/accordion/callback.jl
@@ -22,7 +22,7 @@ accordion = html_div([
         id = "accordion",
         active_item = "item-1",
     ),
-    html_div(id = "accordion-contents", class_name = "mt-3"),
+    html_div(id = "accordion-contents", className = "mt-3"),
 ])
 
 
diff --git a/docs/components_page/components/accordion/callback.py b/docs/components_page/components/accordion/callback.py
index cea2f8084..d5c8bf749 100644
--- a/docs/components_page/components/accordion/callback.py
+++ b/docs/components_page/components/accordion/callback.py
@@ -24,7 +24,7 @@
             id="accordion",
             active_item="item-1",
         ),
-        html.Div(id="accordion-contents", class_name="mt-3"),
+        html.Div(id="accordion-contents", className="mt-3"),
     ]
 )
 
diff --git a/docs/components_page/components/alert/auto_dismiss.R b/docs/components_page/components/alert/auto_dismiss.R
index e897925ee..7fa5ac00f 100644
--- a/docs/components_page/components/alert/auto_dismiss.R
+++ b/docs/components_page/components/alert/auto_dismiss.R
@@ -4,7 +4,7 @@ library(dashHtmlComponents)
 alert <- htmlDiv(
   list(
     dbcButton("Toggle",
-      id = "alert-toggle-auto", class_name = "me-1",
+      id = "alert-toggle-auto", className = "me-1",
       n_clicks = 0
     ),
     htmlHr(),
diff --git a/docs/components_page/components/alert/auto_dismiss.jl b/docs/components_page/components/alert/auto_dismiss.jl
index 53f72741a..38f0fd74c 100644
--- a/docs/components_page/components/alert/auto_dismiss.jl
+++ b/docs/components_page/components/alert/auto_dismiss.jl
@@ -1,7 +1,7 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 alert = html_div([
-    dbc_button("Toggle", id = "alert-toggle-auto", class_name = "me-1", n_clicks = 0),
+    dbc_button("Toggle", id = "alert-toggle-auto", className = "me-1", n_clicks = 0),
     html_hr(),
     dbc_alert(
         "Hello! I am an auto-dismissing alert!",
diff --git a/docs/components_page/components/alert/auto_dismiss.py b/docs/components_page/components/alert/auto_dismiss.py
index 90dd9ccd9..a70566f54 100644
--- a/docs/components_page/components/alert/auto_dismiss.py
+++ b/docs/components_page/components/alert/auto_dismiss.py
@@ -4,7 +4,7 @@
 alert = html.Div(
     [
         dbc.Button(
-            "Toggle", id="alert-toggle-auto", class_name="me-1", n_clicks=0
+            "Toggle", id="alert-toggle-auto", className="me-1", n_clicks=0
         ),
         html.Hr(),
         dbc.Alert(
diff --git a/docs/components_page/components/alert/content.R b/docs/components_page/components/alert/content.R
index a64a92b37..11ddb6ca0 100644
--- a/docs/components_page/components/alert/content.R
+++ b/docs/components_page/components/alert/content.R
@@ -3,7 +3,7 @@ library(dashHtmlComponents)
 
 alert <- dbcAlert(
   list(
-    htmlH4("Well done!", class_name = "alert-heading"),
+    htmlH4("Well done!", className = "alert-heading"),
     htmlP(
       paste(
         "This is a success alert with loads of extra text in it. So much",
@@ -14,7 +14,7 @@ alert <- dbcAlert(
     htmlHr(),
     htmlP(
       "Let's put some more text down here, but remove the bottom margin",
-      class_name = "mb-0",
+      className = "mb-0",
     )
   )
 )
diff --git a/docs/components_page/components/alert/content.jl b/docs/components_page/components/alert/content.jl
index 4a152b9f1..d4e5a3176 100644
--- a/docs/components_page/components/alert/content.jl
+++ b/docs/components_page/components/alert/content.jl
@@ -1,7 +1,7 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 alert = dbc_alert([
-    html_h4("Well done!", class_name = "alert-heading"),
+    html_h4("Well done!", className = "alert-heading"),
     html_p(
         "This is a success alert with loads of extra text in it. So much " *
         "that you can see how spacing within an alert works with this " *
@@ -10,6 +10,6 @@ alert = dbc_alert([
     html_hr(),
     html_p(
         "Let's put some more text down here, but remove the bottom margin",
-        class_name = "mb-0",
+        className = "mb-0",
     ),
 ]);
diff --git a/docs/components_page/components/alert/content.py b/docs/components_page/components/alert/content.py
index 2835f3f3b..3f1043df1 100644
--- a/docs/components_page/components/alert/content.py
+++ b/docs/components_page/components/alert/content.py
@@ -3,7 +3,7 @@
 
 alert = dbc.Alert(
     [
-        html.H4("Well done!", class_name="alert-heading"),
+        html.H4("Well done!", className="alert-heading"),
         html.P(
             "This is a success alert with loads of extra text in it. So much "
             "that you can see how spacing within an alert works with this "
@@ -12,7 +12,7 @@
         html.Hr(),
         html.P(
             "Let's put some more text down here, but remove the bottom margin",
-            class_name="mb-0",
+            className="mb-0",
         ),
     ]
 )
diff --git a/docs/components_page/components/alert/dismiss.R b/docs/components_page/components/alert/dismiss.R
index 2ef0fb109..5583c9411 100644
--- a/docs/components_page/components/alert/dismiss.R
+++ b/docs/components_page/components/alert/dismiss.R
@@ -6,7 +6,7 @@ alert <- htmlDiv(
     dbcButton(
       "Toggle alert with fade",
       id = "alert-toggle-fade", n_clicks = 0,
-      class_name = "me-1"
+      className = "me-1"
     ),
     dbcButton("Toggle alert without fade",
       id = "alert-toggle-no-fade",
diff --git a/docs/components_page/components/alert/dismiss.jl b/docs/components_page/components/alert/dismiss.jl
index 385469ff5..9e96da075 100644
--- a/docs/components_page/components/alert/dismiss.jl
+++ b/docs/components_page/components/alert/dismiss.jl
@@ -4,7 +4,7 @@ alert = html_div([
     dbc_button(
         "Toggle alert with fade",
         id = "alert-toggle-fade",
-        class_name = "me-1",
+        className = "me-1",
         n_clicks = 0,
     ),
     dbc_button("Toggle alert without fade", id = "alert-toggle-no-fade", n_clicks = 0),
diff --git a/docs/components_page/components/alert/dismiss.py b/docs/components_page/components/alert/dismiss.py
index 89d68e89f..5dd75f26c 100644
--- a/docs/components_page/components/alert/dismiss.py
+++ b/docs/components_page/components/alert/dismiss.py
@@ -6,7 +6,7 @@
         dbc.Button(
             "Toggle alert with fade",
             id="alert-toggle-fade",
-            class_name="me-1",
+            className="me-1",
             n_clicks=0,
         ),
         dbc.Button(
diff --git a/docs/components_page/components/alert/icon.R b/docs/components_page/components/alert/icon.R
index 5e0c00829..359461940 100644
--- a/docs/components_page/components/alert/icon.R
+++ b/docs/components_page/components/alert/icon.R
@@ -5,35 +5,35 @@ alerts <- htmlDiv(
   list(
     dbcAlert(
       list(
-        htmlI(class_name = "bi bi-info-circle-fill me-2"),
+        htmlI(className = "bi bi-info-circle-fill me-2"),
         "An example info alert with an icon"
       ),
       color = "info",
-      class_name = "d-flex align-items-center"
+      className = "d-flex align-items-center"
     ),
     dbcAlert(
       list(
-        htmlI(class_name = "bi bi-check-circle-fill me-2"),
+        htmlI(className = "bi bi-check-circle-fill me-2"),
         "An example success alert with an icon"
       ),
       color = "success",
-      class_name = "d-flex align-items-center"
+      className = "d-flex align-items-center"
     ),
     dbcAlert(
       list(
-        htmlI(class_name = "bi bi-exclamation-triangle-fill me-2"),
+        htmlI(className = "bi bi-exclamation-triangle-fill me-2"),
         "An example warning alert with an icon"
       ),
       color = "warning",
-      class_name = "d-flex align-items-center"
+      className = "d-flex align-items-center"
     ),
     dbcAlert(
       list(
-        htmlI(class_name = "bi bi-x-octagon-fill me-2"),
+        htmlI(className = "bi bi-x-octagon-fill me-2"),
         "An example danger alert with an icon"
       ),
       color = "danger",
-      class_name = "d-flex align-items-center"
+      className = "d-flex align-items-center"
     )
   )
 )
diff --git a/docs/components_page/components/alert/icon.jl b/docs/components_page/components/alert/icon.jl
index 8c757964c..54f98ce45 100644
--- a/docs/components_page/components/alert/icon.jl
+++ b/docs/components_page/components/alert/icon.jl
@@ -3,34 +3,34 @@ using DashBootstrapComponents, DashHtmlComponents
 alerts = html_div([
     dbc_alert(
         [
-            html_i(class_name = "bi bi-info-circle-fill me-2"),
+            html_i(className = "bi bi-info-circle-fill me-2"),
             "An example info alert with an icon",
         ],
         color = "info",
-        class_name = "d-flex align-items-center",
+        className = "d-flex align-items-center",
     ),
     dbc_alert(
         [
-            html_i(class_name = "bi bi-check-circle-fill me-2"),
+            html_i(className = "bi bi-check-circle-fill me-2"),
             "An example success alert with an icon",
         ],
         color = "success",
-        class_name = "d-flex align-items-center",
+        className = "d-flex align-items-center",
     ),
     dbc_alert(
         [
-            html_i(class_name = "bi bi-exclamation-triangle-fill me-2"),
+            html_i(className = "bi bi-exclamation-triangle-fill me-2"),
             "An example warning alert with an icon",
         ],
         color = "warning",
-        class_name = "d-flex align-items-center",
+        className = "d-flex align-items-center",
     ),
     dbc_alert(
         [
-            html_i(class_name = "bi bi-x-octagon-fill me-2"),
+            html_i(className = "bi bi-x-octagon-fill me-2"),
             "An example danger alert with an icon",
         ],
         color = "danger",
-        class_name = "d-flex align-items-center",
+        className = "d-flex align-items-center",
     ),
 ])
diff --git a/docs/components_page/components/alert/icon.py b/docs/components_page/components/alert/icon.py
index a26e80dcc..b9431096a 100644
--- a/docs/components_page/components/alert/icon.py
+++ b/docs/components_page/components/alert/icon.py
@@ -5,35 +5,35 @@
     [
         dbc.Alert(
             [
-                html.I(class_name="bi bi-info-circle-fill me-2"),
+                html.I(className="bi bi-info-circle-fill me-2"),
                 "An example info alert with an icon",
             ],
             color="info",
-            class_name="d-flex align-items-center",
+            className="d-flex align-items-center",
         ),
         dbc.Alert(
             [
-                html.I(class_name="bi bi-check-circle-fill me-2"),
+                html.I(className="bi bi-check-circle-fill me-2"),
                 "An example success alert with an icon",
             ],
             color="success",
-            class_name="d-flex align-items-center",
+            className="d-flex align-items-center",
         ),
         dbc.Alert(
             [
-                html.I(class_name="bi bi-exclamation-triangle-fill me-2"),
+                html.I(className="bi bi-exclamation-triangle-fill me-2"),
                 "An example warning alert with an icon",
             ],
             color="warning",
-            class_name="d-flex align-items-center",
+            className="d-flex align-items-center",
         ),
         dbc.Alert(
             [
-                html.I(class_name="bi bi-x-octagon-fill me-2"),
+                html.I(className="bi bi-x-octagon-fill me-2"),
                 "An example danger alert with an icon",
             ],
             color="danger",
-            class_name="d-flex align-items-center",
+            className="d-flex align-items-center",
         ),
     ]
 )
diff --git a/docs/components_page/components/alert/link.R b/docs/components_page/components/alert/link.R
index d94d63aec..87a9099c5 100644
--- a/docs/components_page/components/alert/link.R
+++ b/docs/components_page/components/alert/link.R
@@ -6,14 +6,14 @@ alerts <- htmlDiv(
     dbcAlert(
       list(
         "This is a primary alert with an ",
-        htmlA("example link", href = "#", class_name = "alert-link")
+        htmlA("example link", href = "#", className = "alert-link")
       ),
       color = "primary"
     ),
     dbcAlert(
       list(
         "This is a danger alert with an ",
-        htmlA("example link", href = "#", class_name = "alert-link")
+        htmlA("example link", href = "#", className = "alert-link")
       ),
       color = "danger"
     )
diff --git a/docs/components_page/components/alert/link.jl b/docs/components_page/components/alert/link.jl
index e03ae798b..143860ae7 100644
--- a/docs/components_page/components/alert/link.jl
+++ b/docs/components_page/components/alert/link.jl
@@ -4,14 +4,14 @@ alerts = html_div([
     dbc_alert(
         [
             "This is a primary alert with an ",
-            html_a("example link", href = "#", class_name = "alert-link"),
+            html_a("example link", href = "#", className = "alert-link"),
         ],
         color = "primary",
     ),
     dbc_alert(
         [
             "This is a danger alert with an ",
-            html_a("example link", href = "#", class_name = "alert-link"),
+            html_a("example link", href = "#", className = "alert-link"),
         ],
         color = "danger",
     ),
diff --git a/docs/components_page/components/alert/link.py b/docs/components_page/components/alert/link.py
index e43f3cb0c..e87cbdca3 100644
--- a/docs/components_page/components/alert/link.py
+++ b/docs/components_page/components/alert/link.py
@@ -6,14 +6,14 @@
         dbc.Alert(
             [
                 "This is a primary alert with an ",
-                html.A("example link", href="#", class_name="alert-link"),
+                html.A("example link", href="#", className="alert-link"),
             ],
             color="primary",
         ),
         dbc.Alert(
             [
                 "This is a danger alert with an ",
-                html.A("example link", href="#", class_name="alert-link"),
+                html.A("example link", href="#", className="alert-link"),
             ],
             color="danger",
         ),
diff --git a/docs/components_page/components/badge/color.R b/docs/components_page/components/badge/color.R
index 14f16f3b8..8b79a8b04 100644
--- a/docs/components_page/components/badge/color.R
+++ b/docs/components_page/components/badge/color.R
@@ -3,13 +3,13 @@ library(dashHtmlComponents)
 
 badges <- htmlSpan(
   list(
-    dbcBadge("Primary", color = "primary", class_name = "me-1"),
-    dbcBadge("Secondary", color = "secondary", class_name = "me-1"),
-    dbcBadge("Success", color = "success", class_name = "me-1"),
-    dbcBadge("Warning", color = "warning", class_name = "me-1"),
-    dbcBadge("Danger", color = "danger", class_name = "me-1"),
-    dbcBadge("Info", color = "info", class_name = "me-1"),
-    dbcBadge("Light", text_color = "dark", color = "light", class_name = "me-1"),
+    dbcBadge("Primary", color = "primary", className = "me-1"),
+    dbcBadge("Secondary", color = "secondary", className = "me-1"),
+    dbcBadge("Success", color = "success", className = "me-1"),
+    dbcBadge("Warning", color = "warning", className = "me-1"),
+    dbcBadge("Danger", color = "danger", className = "me-1"),
+    dbcBadge("Info", color = "info", className = "me-1"),
+    dbcBadge("Light", text_color = "dark", color = "light", className = "me-1"),
     dbcBadge("Dark", color = "dark")
   )
 )
diff --git a/docs/components_page/components/badge/color.jl b/docs/components_page/components/badge/color.jl
index 5d27b5bab..dce1edcee 100644
--- a/docs/components_page/components/badge/color.jl
+++ b/docs/components_page/components/badge/color.jl
@@ -1,12 +1,12 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 badges = html_span([
-    dbc_badge("Primary", color = "primary", class_name = "me-1"),
-    dbc_badge("Secondary", color = "secondary", class_name = "me-1"),
-    dbc_badge("Success", color = "success", class_name = "me-1"),
-    dbc_badge("Warning", color = "warning", class_name = "me-1"),
-    dbc_badge("Danger", color = "danger", class_name = "me-1"),
-    dbc_badge("Info", color = "info", class_name = "me-1"),
-    dbc_badge("Light", color = "light", text_color = "dark", class_name = "me-1"),
+    dbc_badge("Primary", color = "primary", className = "me-1"),
+    dbc_badge("Secondary", color = "secondary", className = "me-1"),
+    dbc_badge("Success", color = "success", className = "me-1"),
+    dbc_badge("Warning", color = "warning", className = "me-1"),
+    dbc_badge("Danger", color = "danger", className = "me-1"),
+    dbc_badge("Info", color = "info", className = "me-1"),
+    dbc_badge("Light", color = "light", text_color = "dark", className = "me-1"),
     dbc_badge("Dark", color = "dark"),
 ]);
diff --git a/docs/components_page/components/badge/color.py b/docs/components_page/components/badge/color.py
index 3dc8739a6..53cbb2988 100644
--- a/docs/components_page/components/badge/color.py
+++ b/docs/components_page/components/badge/color.py
@@ -3,15 +3,13 @@
 
 badges = html.Span(
     [
-        dbc.Badge("Primary", color="primary", class_name="me-1"),
-        dbc.Badge("Secondary", color="secondary", class_name="me-1"),
-        dbc.Badge("Success", color="success", class_name="me-1"),
-        dbc.Badge("Warning", color="warning", class_name="me-1"),
-        dbc.Badge("Danger", color="danger", class_name="me-1"),
-        dbc.Badge("Info", color="info", class_name="me-1"),
-        dbc.Badge(
-            "Light", text_color="dark", color="light", class_name="me-1"
-        ),
+        dbc.Badge("Primary", color="primary", className="me-1"),
+        dbc.Badge("Secondary", color="secondary", className="me-1"),
+        dbc.Badge("Success", color="success", className="me-1"),
+        dbc.Badge("Warning", color="warning", className="me-1"),
+        dbc.Badge("Danger", color="danger", className="me-1"),
+        dbc.Badge("Info", color="info", className="me-1"),
+        dbc.Badge("Light", text_color="dark", color="light", className="me-1"),
         dbc.Badge("Dark", color="dark"),
     ]
 )
diff --git a/docs/components_page/components/badge/links.R b/docs/components_page/components/badge/links.R
index 9928997a5..0b7aee432 100644
--- a/docs/components_page/components/badge/links.R
+++ b/docs/components_page/components/badge/links.R
@@ -3,13 +3,13 @@ library(dashHtmlComponents)
 
 badges <- htmlSpan(
   list(
-    dbcBadge("Primary", href = "#", color = "primary", class_name = "me-1 text-decoration-none"),
-    dbcBadge("Secondary", href = "#", color = "secondary", class_name = "me-1 text-decoration-none"),
-    dbcBadge("Success", href = "#", color = "success", class_name = "me-1 text-decoration-none"),
-    dbcBadge("Warning", href = "#", color = "warning", class_name = "me-1 text-decoration-none"),
-    dbcBadge("Danger", href = "#", color = "danger", class_name = "me-1 text-decoration-none"),
-    dbcBadge("Info", href = "#", color = "info", class_name = "me-1 text-decoration-none"),
-    dbcBadge("Light", href = "#", color = "light", text_color = "dark", class_name = "me-1 text-decoration-none"),
-    dbcBadge("Dark", href = "#", color = "dark", class_name = "text-decoration-none")
+    dbcBadge("Primary", href = "#", color = "primary", className = "me-1 text-decoration-none"),
+    dbcBadge("Secondary", href = "#", color = "secondary", className = "me-1 text-decoration-none"),
+    dbcBadge("Success", href = "#", color = "success", className = "me-1 text-decoration-none"),
+    dbcBadge("Warning", href = "#", color = "warning", className = "me-1 text-decoration-none"),
+    dbcBadge("Danger", href = "#", color = "danger", className = "me-1 text-decoration-none"),
+    dbcBadge("Info", href = "#", color = "info", className = "me-1 text-decoration-none"),
+    dbcBadge("Light", href = "#", color = "light", text_color = "dark", className = "me-1 text-decoration-none"),
+    dbcBadge("Dark", href = "#", color = "dark", className = "text-decoration-none")
   )
 )
diff --git a/docs/components_page/components/badge/links.jl b/docs/components_page/components/badge/links.jl
index ec6dcaf7e..4dc3db9ae 100644
--- a/docs/components_page/components/badge/links.jl
+++ b/docs/components_page/components/badge/links.jl
@@ -5,39 +5,39 @@ badges = html_span([
         "Primary",
         href = "#",
         color = "primary",
-        class_name = "me-1 text-decoration-none",
+        className = "me-1 text-decoration-none",
     ),
     dbc_badge(
         "Secondary",
         href = "#",
         color = "secondary",
-        class_name = "me-1 text-decoration-none",
+        className = "me-1 text-decoration-none",
     ),
     dbc_badge(
         "Success",
         href = "#",
         color = "success",
-        class_name = "me-1 text-decoration-none",
+        className = "me-1 text-decoration-none",
     ),
     dbc_badge(
         "Warning",
         href = "#",
         color = "warning",
-        class_name = "me-1 text-decoration-none",
+        className = "me-1 text-decoration-none",
     ),
     dbc_badge(
         "Danger",
         href = "#",
         color = "danger",
-        class_name = "me-1 text-decoration-none",
+        className = "me-1 text-decoration-none",
     ),
-    dbc_badge("Info", href = "#", color = "info", class_name = "me-1 text-decoration-none"),
+    dbc_badge("Info", href = "#", color = "info", className = "me-1 text-decoration-none"),
     dbc_badge(
         "Light",
         href = "#",
         color = "light",
         text_color = "dark",
-        class_name = "me-1 text-decoration-none",
+        className = "me-1 text-decoration-none",
     ),
-    dbc_badge("Dark", href = "#", color = "dark", class_name = "text-decoration-none"),
+    dbc_badge("Dark", href = "#", color = "dark", className = "text-decoration-none"),
 ],);
diff --git a/docs/components_page/components/badge/links.py b/docs/components_page/components/badge/links.py
index 3ab197e57..51f0c34be 100644
--- a/docs/components_page/components/badge/links.py
+++ b/docs/components_page/components/badge/links.py
@@ -7,47 +7,47 @@
             "Primary",
             href="#",
             color="primary",
-            class_name="me-1 text-decoration-none",
+            className="me-1 text-decoration-none",
         ),
         dbc.Badge(
             "Secondary",
             href="#",
             color="secondary",
-            class_name="me-1 text-decoration-none",
+            className="me-1 text-decoration-none",
         ),
         dbc.Badge(
             "Success",
             href="#",
             color="success",
-            class_name="me-1 text-decoration-none",
+            className="me-1 text-decoration-none",
         ),
         dbc.Badge(
             "Warning",
             href="#",
             color="warning",
-            class_name="me-1 text-decoration-none",
+            className="me-1 text-decoration-none",
         ),
         dbc.Badge(
             "Danger",
             href="#",
             color="danger",
-            class_name="me-1 text-decoration-none",
+            className="me-1 text-decoration-none",
         ),
         dbc.Badge(
             "Info",
             href="#",
             color="info",
-            class_name="me-1 text-decoration-none",
+            className="me-1 text-decoration-none",
         ),
         dbc.Badge(
             "Light",
             href="#",
             color="light",
             text_color="dark",
-            class_name="me-1 text-decoration-none",
+            className="me-1 text-decoration-none",
         ),
         dbc.Badge(
-            "Dark", href="#", color="dark", class_name="text-decoration-none"
+            "Dark", href="#", color="dark", className="text-decoration-none"
         ),
     ]
 )
diff --git a/docs/components_page/components/badge/pills.R b/docs/components_page/components/badge/pills.R
index a112104f7..8a6631ef5 100644
--- a/docs/components_page/components/badge/pills.R
+++ b/docs/components_page/components/badge/pills.R
@@ -3,13 +3,13 @@ library(dashHtmlComponents)
 
 badges <- htmlSpan(
   list(
-    dbcBadge("Primary", pill = TRUE, color = "primary", class_name = "me-1"),
-    dbcBadge("Secondary", pill = TRUE, color = "secondary", class_name = "me-1"),
-    dbcBadge("Success", pill = TRUE, color = "success", class_name = "me-1"),
-    dbcBadge("Warning", pill = TRUE, color = "warning", class_name = "me-1"),
-    dbcBadge("Danger", pill = TRUE, color = "danger", class_name = "me-1"),
-    dbcBadge("Info", pill = TRUE, color = "info", class_name = "me-1"),
-    dbcBadge("Light", pill = TRUE, color = "light", text_color = "dark", class_name = "me-1"),
+    dbcBadge("Primary", pill = TRUE, color = "primary", className = "me-1"),
+    dbcBadge("Secondary", pill = TRUE, color = "secondary", className = "me-1"),
+    dbcBadge("Success", pill = TRUE, color = "success", className = "me-1"),
+    dbcBadge("Warning", pill = TRUE, color = "warning", className = "me-1"),
+    dbcBadge("Danger", pill = TRUE, color = "danger", className = "me-1"),
+    dbcBadge("Info", pill = TRUE, color = "info", className = "me-1"),
+    dbcBadge("Light", pill = TRUE, color = "light", text_color = "dark", className = "me-1"),
     dbcBadge("Dark", pill = TRUE, color = "dark")
   )
 )
diff --git a/docs/components_page/components/badge/pills.jl b/docs/components_page/components/badge/pills.jl
index dab1a1645..01204ecd7 100644
--- a/docs/components_page/components/badge/pills.jl
+++ b/docs/components_page/components/badge/pills.jl
@@ -1,18 +1,18 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 badges = html_span([
-    dbc_badge("Primary", pill = true, color = "primary", class_name = "me-1"),
-    dbc_badge("Secondary", pill = true, color = "secondary", class_name = "me-1"),
-    dbc_badge("Success", pill = true, color = "success", class_name = "me-1"),
-    dbc_badge("Warning", pill = true, color = "warning", class_name = "me-1"),
-    dbc_badge("Danger", pill = true, color = "danger", class_name = "me-1"),
-    dbc_badge("Info", pill = true, color = "info", class_name = "me-1"),
+    dbc_badge("Primary", pill = true, color = "primary", className = "me-1"),
+    dbc_badge("Secondary", pill = true, color = "secondary", className = "me-1"),
+    dbc_badge("Success", pill = true, color = "success", className = "me-1"),
+    dbc_badge("Warning", pill = true, color = "warning", className = "me-1"),
+    dbc_badge("Danger", pill = true, color = "danger", className = "me-1"),
+    dbc_badge("Info", pill = true, color = "info", className = "me-1"),
     dbc_badge(
         "Light",
         pill = true,
         color = "light",
         text_color = "dark",
-        class_name = "me-1",
+        className = "me-1",
     ),
     dbc_badge("Dark", pill = true, color = "dark"),
 ]);
diff --git a/docs/components_page/components/badge/pills.py b/docs/components_page/components/badge/pills.py
index 57ce6ac4e..7cd60b945 100644
--- a/docs/components_page/components/badge/pills.py
+++ b/docs/components_page/components/badge/pills.py
@@ -3,20 +3,18 @@
 
 badges = html.Span(
     [
-        dbc.Badge("Primary", pill=True, color="primary", class_name="me-1"),
-        dbc.Badge(
-            "Secondary", pill=True, color="secondary", class_name="me-1"
-        ),
-        dbc.Badge("Success", pill=True, color="success", class_name="me-1"),
-        dbc.Badge("Warning", pill=True, color="warning", class_name="me-1"),
-        dbc.Badge("Danger", pill=True, color="danger", class_name="me-1"),
-        dbc.Badge("Info", pill=True, color="info", class_name="me-1"),
+        dbc.Badge("Primary", pill=True, color="primary", className="me-1"),
+        dbc.Badge("Secondary", pill=True, color="secondary", className="me-1"),
+        dbc.Badge("Success", pill=True, color="success", className="me-1"),
+        dbc.Badge("Warning", pill=True, color="warning", className="me-1"),
+        dbc.Badge("Danger", pill=True, color="danger", className="me-1"),
+        dbc.Badge("Info", pill=True, color="info", className="me-1"),
         dbc.Badge(
             "Light",
             pill=True,
             color="light",
             text_color="dark",
-            class_name="me-1",
+            className="me-1",
         ),
         dbc.Badge("Dark", pill=True, color="dark"),
     ]
diff --git a/docs/components_page/components/badge/positioned.R b/docs/components_page/components/badge/positioned.R
index 58031ebf3..8a8248bfb 100644
--- a/docs/components_page/components/badge/positioned.R
+++ b/docs/components_page/components/badge/positioned.R
@@ -8,9 +8,9 @@ badge <- dbcButton(
       color = "danger",
       pill = TRUE,
       text_color = "white",
-      class_name = "position-absolute top-0 start-100 translate-middle"
+      className = "position-absolute top-0 start-100 translate-middle"
     )
   ),
   color = "primary",
-  class_name = "position-relative"
+  className = "position-relative"
 )
diff --git a/docs/components_page/components/badge/positioned.jl b/docs/components_page/components/badge/positioned.jl
index a2195ab7c..e1bd789df 100644
--- a/docs/components_page/components/badge/positioned.jl
+++ b/docs/components_page/components/badge/positioned.jl
@@ -8,9 +8,9 @@ badge = dbc_button(
             color = "danger",
             pill = true,
             text_color = "white",
-            class_name = "position-absolute top-0 start-100 translate-middle",
+            className = "position-absolute top-0 start-100 translate-middle",
         ),
     ],
     color = "primary",
-    class_name = "position-relative",
+    className = "position-relative",
 )
diff --git a/docs/components_page/components/badge/positioned.py b/docs/components_page/components/badge/positioned.py
index 559729c26..18fd405b4 100644
--- a/docs/components_page/components/badge/positioned.py
+++ b/docs/components_page/components/badge/positioned.py
@@ -8,9 +8,9 @@
             color="danger",
             pill=True,
             text_color="white",
-            class_name="position-absolute top-0 start-100 translate-middle",
+            className="position-absolute top-0 start-100 translate-middle",
         ),
     ],
     color="primary",
-    class_name="position-relative",
+    className="position-relative",
 )
diff --git a/docs/components_page/components/badge/simple.R b/docs/components_page/components/badge/simple.R
index 24b00fe4c..acdb2a64c 100644
--- a/docs/components_page/components/badge/simple.R
+++ b/docs/components_page/components/badge/simple.R
@@ -3,7 +3,7 @@ library(dashBootstrapComponents)
 badge <- dbcButton(
   list(
     "Notifications",
-    dbcBadge("4", color = "light", text_color = "primary", class_name = "ms-1")
+    dbcBadge("4", color = "light", text_color = "primary", className = "ms-1")
   ),
   color = "primary",
 )
diff --git a/docs/components_page/components/badge/simple.jl b/docs/components_page/components/badge/simple.jl
index 212f71bc1..e907e9678 100644
--- a/docs/components_page/components/badge/simple.jl
+++ b/docs/components_page/components/badge/simple.jl
@@ -3,7 +3,7 @@ using DashBootstrapComponents
 badge = dbc_button(
     [
         "Notifications",
-        dbc_badge("4", color = "light", text_color = "primary", class_name = "ms-1"),
+        dbc_badge("4", color = "light", text_color = "primary", className = "ms-1"),
     ],
     color = "primary",
 );
diff --git a/docs/components_page/components/badge/simple.py b/docs/components_page/components/badge/simple.py
index 447bcbb48..cea32c39a 100644
--- a/docs/components_page/components/badge/simple.py
+++ b/docs/components_page/components/badge/simple.py
@@ -3,7 +3,7 @@
 badge = dbc.Button(
     [
         "Notifications",
-        dbc.Badge("4", color="light", text_color="primary", class_name="ms-1"),
+        dbc.Badge("4", color="light", text_color="primary", className="ms-1"),
     ],
     color="primary",
 )
diff --git a/docs/components_page/components/badge/size.R b/docs/components_page/components/badge/size.R
index d3a41dba3..66497da68 100644
--- a/docs/components_page/components/badge/size.R
+++ b/docs/components_page/components/badge/size.R
@@ -3,11 +3,11 @@ library(dashHtmlComponents)
 
 badges <- htmlDiv(
   list(
-    htmlH1(list("Example heading", dbcBadge("New", class_name = "ms-1"))),
-    htmlH2(list("Example heading", dbcBadge("New", class_name = "ms-1"))),
-    htmlH3(list("Example heading", dbcBadge("New", class_name = "ms-1"))),
-    htmlH4(list("Example heading", dbcBadge("New", class_name = "ms-1"))),
-    htmlH5(list("Example heading", dbcBadge("New", class_name = "ms-1"))),
-    htmlH6(list("Example heading", dbcBadge("New", class_name = "ms-1")))
+    htmlH1(list("Example heading", dbcBadge("New", className = "ms-1"))),
+    htmlH2(list("Example heading", dbcBadge("New", className = "ms-1"))),
+    htmlH3(list("Example heading", dbcBadge("New", className = "ms-1"))),
+    htmlH4(list("Example heading", dbcBadge("New", className = "ms-1"))),
+    htmlH5(list("Example heading", dbcBadge("New", className = "ms-1"))),
+    htmlH6(list("Example heading", dbcBadge("New", className = "ms-1")))
   )
 )
diff --git a/docs/components_page/components/badge/size.jl b/docs/components_page/components/badge/size.jl
index b9785de6b..3ab50a512 100644
--- a/docs/components_page/components/badge/size.jl
+++ b/docs/components_page/components/badge/size.jl
@@ -1,10 +1,10 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 badges = html_div([
-    html_h1(["Example heading", dbc_badge("New", class_name = "ms-1")]),
-    html_h2(["Example heading", dbc_badge("New", class_name = "ms-1")]),
-    html_h3(["Example heading", dbc_badge("New", class_name = "ms-1")]),
-    html_h4(["Example heading", dbc_badge("New", class_name = "ms-1")]),
-    html_h5(["Example heading", dbc_badge("New", class_name = "ms-1")]),
-    html_h6(["Example heading", dbc_badge("New", class_name = "ms-1")]),
+    html_h1(["Example heading", dbc_badge("New", className = "ms-1")]),
+    html_h2(["Example heading", dbc_badge("New", className = "ms-1")]),
+    html_h3(["Example heading", dbc_badge("New", className = "ms-1")]),
+    html_h4(["Example heading", dbc_badge("New", className = "ms-1")]),
+    html_h5(["Example heading", dbc_badge("New", className = "ms-1")]),
+    html_h6(["Example heading", dbc_badge("New", className = "ms-1")]),
 ]);
diff --git a/docs/components_page/components/badge/size.py b/docs/components_page/components/badge/size.py
index 2b1d7cf7a..25addee14 100644
--- a/docs/components_page/components/badge/size.py
+++ b/docs/components_page/components/badge/size.py
@@ -3,11 +3,11 @@
 
 badges = html.Div(
     [
-        html.H1(["Example heading", dbc.Badge("New", class_name="ms-1")]),
-        html.H2(["Example heading", dbc.Badge("New", class_name="ms-1")]),
-        html.H3(["Example heading", dbc.Badge("New", class_name="ms-1")]),
-        html.H4(["Example heading", dbc.Badge("New", class_name="ms-1")]),
-        html.H5(["Example heading", dbc.Badge("New", class_name="ms-1")]),
-        html.H6(["Example heading", dbc.Badge("New", class_name="ms-1")]),
+        html.H1(["Example heading", dbc.Badge("New", className="ms-1")]),
+        html.H2(["Example heading", dbc.Badge("New", className="ms-1")]),
+        html.H3(["Example heading", dbc.Badge("New", className="ms-1")]),
+        html.H4(["Example heading", dbc.Badge("New", className="ms-1")]),
+        html.H5(["Example heading", dbc.Badge("New", className="ms-1")]),
+        html.H6(["Example heading", dbc.Badge("New", className="ms-1")]),
     ]
 )
diff --git a/docs/components_page/components/badge/text_color.R b/docs/components_page/components/badge/text_color.R
index fe0af876f..d35ac6216 100644
--- a/docs/components_page/components/badge/text_color.R
+++ b/docs/components_page/components/badge/text_color.R
@@ -3,16 +3,16 @@ library(dashHtmlComponents)
 
 badges <- htmlSpan(
   list(
-    dbcBadge("Primary", color = "white", text_color = "primary", class_name = "border me-1"),
-    dbcBadge("Secondary", color = "white", text_color = "secondary", class_name = "border me-1"),
-    dbcBadge("Success", color = "white", text_color = "success", class_name = "border me-1"),
-    dbcBadge("Warning", color = "white", text_color = "warning", class_name = "border me-1"),
-    dbcBadge("Danger", color = "white", text_color = "danger", class_name = "border me-1"),
-    dbcBadge("Info", color = "white", text_color = "info", class_name = "border me-1"),
-    dbcBadge("Dark", color = "white", text_color = "dark", class_name = "border me-1"),
-    dbcBadge("Black", color = "white", text_color = "black", class_name = "border me-1"),
-    dbcBadge("Muted", color = "white", text_color = "muted", class_name = "border me-1"),
-    dbcBadge("Light", color = "secondary", text_color = "light", class_name = "border me-1"),
-    dbcBadge("White", color = "secondary", text_color = "white", class_name = "border")
+    dbcBadge("Primary", color = "white", text_color = "primary", className = "border me-1"),
+    dbcBadge("Secondary", color = "white", text_color = "secondary", className = "border me-1"),
+    dbcBadge("Success", color = "white", text_color = "success", className = "border me-1"),
+    dbcBadge("Warning", color = "white", text_color = "warning", className = "border me-1"),
+    dbcBadge("Danger", color = "white", text_color = "danger", className = "border me-1"),
+    dbcBadge("Info", color = "white", text_color = "info", className = "border me-1"),
+    dbcBadge("Dark", color = "white", text_color = "dark", className = "border me-1"),
+    dbcBadge("Black", color = "white", text_color = "black", className = "border me-1"),
+    dbcBadge("Muted", color = "white", text_color = "muted", className = "border me-1"),
+    dbcBadge("Light", color = "secondary", text_color = "light", className = "border me-1"),
+    dbcBadge("White", color = "secondary", text_color = "white", className = "border")
   )
 )
diff --git a/docs/components_page/components/badge/text_color.jl b/docs/components_page/components/badge/text_color.jl
index 1e05b7127..8844f1d47 100644
--- a/docs/components_page/components/badge/text_color.jl
+++ b/docs/components_page/components/badge/text_color.jl
@@ -5,36 +5,36 @@ badges = html_span([
         "Primary",
         color = "white",
         text_color = "primary",
-        class_name = "border me-1",
+        className = "border me-1",
     ),
     dbc_badge(
         "Secondary",
         color = "white",
         text_color = "secondary",
-        class_name = "border me-1",
+        className = "border me-1",
     ),
     dbc_badge(
         "Success",
         color = "white",
         text_color = "success",
-        class_name = "border me-1",
+        className = "border me-1",
     ),
     dbc_badge(
         "Warning",
         color = "white",
         text_color = "warning",
-        class_name = "border me-1",
+        className = "border me-1",
     ),
-    dbc_badge("Danger", color = "white", text_color = "danger", class_name = "border me-1"),
-    dbc_badge("Info", color = "white", text_color = "info", class_name = "border me-1"),
-    dbc_badge("Dark", color = "white", text_color = "dark", class_name = "border me-1"),
-    dbc_badge("Black", color = "white", text_color = "black", class_name = "border me-1"),
-    dbc_badge("Muted", color = "white", text_color = "muted", class_name = "border me-1"),
+    dbc_badge("Danger", color = "white", text_color = "danger", className = "border me-1"),
+    dbc_badge("Info", color = "white", text_color = "info", className = "border me-1"),
+    dbc_badge("Dark", color = "white", text_color = "dark", className = "border me-1"),
+    dbc_badge("Black", color = "white", text_color = "black", className = "border me-1"),
+    dbc_badge("Muted", color = "white", text_color = "muted", className = "border me-1"),
     dbc_badge(
         "Light",
         color = "secondary",
         text_color = "light",
-        class_name = "border me-1",
+        className = "border me-1",
     ),
-    dbc_badge("White", color = "secondary", text_color = "white", class_name = "border"),
+    dbc_badge("White", color = "secondary", text_color = "white", className = "border"),
 ])
diff --git a/docs/components_page/components/badge/text_color.py b/docs/components_page/components/badge/text_color.py
index 2a31bfb59..40edcfadd 100644
--- a/docs/components_page/components/badge/text_color.py
+++ b/docs/components_page/components/badge/text_color.py
@@ -7,58 +7,58 @@
             "Primary",
             color="white",
             text_color="primary",
-            class_name="border me-1",
+            className="border me-1",
         ),
         dbc.Badge(
             "Secondary",
             color="white",
             text_color="secondary",
-            class_name="border me-1",
+            className="border me-1",
         ),
         dbc.Badge(
             "Success",
             color="white",
             text_color="success",
-            class_name="border me-1",
+            className="border me-1",
         ),
         dbc.Badge(
             "Warning",
             color="white",
             text_color="warning",
-            class_name="border me-1",
+            className="border me-1",
         ),
         dbc.Badge(
             "Danger",
             color="white",
             text_color="danger",
-            class_name="border me-1",
+            className="border me-1",
         ),
         dbc.Badge(
-            "Info", color="white", text_color="info", class_name="border me-1"
+            "Info", color="white", text_color="info", className="border me-1"
         ),
         dbc.Badge(
-            "Dark", color="white", text_color="dark", class_name="border me-1"
+            "Dark", color="white", text_color="dark", className="border me-1"
         ),
         dbc.Badge(
             "Black",
             color="white",
             text_color="black",
-            class_name="border me-1",
+            className="border me-1",
         ),
         dbc.Badge(
             "Muted",
             color="white",
             text_color="muted",
-            class_name="border me-1",
+            className="border me-1",
         ),
         dbc.Badge(
             "Light",
             color="secondary",
             text_color="light",
-            class_name="border me-1",
+            className="border me-1",
         ),
         dbc.Badge(
-            "White", color="secondary", text_color="white", class_name="border"
+            "White", color="secondary", text_color="white", className="border"
         ),
     ]
 )
diff --git a/docs/components_page/components/button/active_disabled.R b/docs/components_page/components/button/active_disabled.R
index 4629ef0d5..8db08a0cc 100644
--- a/docs/components_page/components/button/active_disabled.R
+++ b/docs/components_page/components/button/active_disabled.R
@@ -3,8 +3,8 @@ library(dashHtmlComponents)
 
 buttons <- htmlDiv(
   list(
-    dbcButton("Regular", color = "primary", class_name = "me-1"),
-    dbcButton("Active", color = "primary", active = TRUE, class_name = "me-1"),
+    dbcButton("Regular", color = "primary", className = "me-1"),
+    dbcButton("Active", color = "primary", active = TRUE, className = "me-1"),
     dbcButton("Disabled", color = "primary", disabled = TRUE)
   )
 )
diff --git a/docs/components_page/components/button/active_disabled.jl b/docs/components_page/components/button/active_disabled.jl
index c65b77937..f2e26418b 100644
--- a/docs/components_page/components/button/active_disabled.jl
+++ b/docs/components_page/components/button/active_disabled.jl
@@ -1,7 +1,7 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 buttons = html_div([
-    dbc_button("Regular", color = "primary", class_name = "me-1"),
-    dbc_button("Active", color = "primary", active = true, class_name = "me-1"),
+    dbc_button("Regular", color = "primary", className = "me-1"),
+    dbc_button("Active", color = "primary", active = true, className = "me-1"),
     dbc_button("Disabled", color = "primary", disabled = true),
 ]);
diff --git a/docs/components_page/components/button/active_disabled.py b/docs/components_page/components/button/active_disabled.py
index 34a413efa..595c2f2a1 100644
--- a/docs/components_page/components/button/active_disabled.py
+++ b/docs/components_page/components/button/active_disabled.py
@@ -3,8 +3,8 @@
 
 buttons = html.Div(
     [
-        dbc.Button("Regular", color="primary", class_name="me-1"),
-        dbc.Button("Active", color="primary", active=True, class_name="me-1"),
+        dbc.Button("Regular", color="primary", className="me-1"),
+        dbc.Button("Active", color="primary", active=True, className="me-1"),
         dbc.Button("Disabled", color="primary", disabled=True),
     ]
 )
diff --git a/docs/components_page/components/button/block.R b/docs/components_page/components/button/block.R
index 2d737291c..129d023bb 100644
--- a/docs/components_page/components/button/block.R
+++ b/docs/components_page/components/button/block.R
@@ -6,5 +6,5 @@ button <- htmlDiv(
     dbcButton("Block button", color = "primary"),
     dbcButton("Block button", color = "secondary")
   ),
-  class_name = "d-grid gap-2"
+  className = "d-grid gap-2"
 )
diff --git a/docs/components_page/components/button/block.jl b/docs/components_page/components/button/block.jl
index ef3ffb710..e356761f1 100644
--- a/docs/components_page/components/button/block.jl
+++ b/docs/components_page/components/button/block.jl
@@ -6,5 +6,5 @@ button = html_div(
         dbc_button("Block button", color = "primary"),
         dbc_button("Block button", color = "secondary"),
     ],
-    class_name = "d-grid gap-2",
+    className = "d-grid gap-2",
 );
diff --git a/docs/components_page/components/button/block.py b/docs/components_page/components/button/block.py
index 89a75c886..62c7a29ed 100644
--- a/docs/components_page/components/button/block.py
+++ b/docs/components_page/components/button/block.py
@@ -6,5 +6,5 @@
         dbc.Button("Block button", color="primary"),
         dbc.Button("Block button", color="secondary"),
     ],
-    class_name="d-grid gap-2",
+    className="d-grid gap-2",
 )
diff --git a/docs/components_page/components/button/flex_block.R b/docs/components_page/components/button/flex_block.R
index c916df0b3..9aec2c052 100644
--- a/docs/components_page/components/button/flex_block.R
+++ b/docs/components_page/components/button/flex_block.R
@@ -3,9 +3,9 @@ library(dashHtmlComponents)
 
 button <- htmlDiv(
   list(
-    dbcButton("Button 1", class_name = "me-md-2"),
-    dbcButton("Button 2", class_name = "me-md-2"),
+    dbcButton("Button 1", className = "me-md-2"),
+    dbcButton("Button 2", className = "me-md-2"),
     dbcButton("Button 3")
   ),
-  class_name = "d-grid gap-2 d-md-flex justify-content-md-end"
+  className = "d-grid gap-2 d-md-flex justify-content-md-end"
 )
diff --git a/docs/components_page/components/button/flex_block.jl b/docs/components_page/components/button/flex_block.jl
index 7ec298596..7ae276ec5 100644
--- a/docs/components_page/components/button/flex_block.jl
+++ b/docs/components_page/components/button/flex_block.jl
@@ -3,9 +3,9 @@ using DashHtmlComponents
 
 button = html_div(
     [
-        dbc_button("Button 1", class_name = "me-md-2"),
-        dbc_button("Button 2", class_name = "me-md-2"),
+        dbc_button("Button 1", className = "me-md-2"),
+        dbc_button("Button 2", className = "me-md-2"),
         dbc_button("Button 3"),
     ],
-    class_name = "d-grid gap-2 d-md-flex justify-content-md-end",
+    className = "d-grid gap-2 d-md-flex justify-content-md-end",
 );
diff --git a/docs/components_page/components/button/flex_block.py b/docs/components_page/components/button/flex_block.py
index 7f5aaa219..a5b92e01f 100644
--- a/docs/components_page/components/button/flex_block.py
+++ b/docs/components_page/components/button/flex_block.py
@@ -3,9 +3,9 @@
 
 button = html.Div(
     [
-        dbc.Button("Button 1", class_name="me-md-2"),
-        dbc.Button("Button 2", class_name="me-md-2"),
+        dbc.Button("Button 1", className="me-md-2"),
+        dbc.Button("Button 2", className="me-md-2"),
         dbc.Button("Button 3"),
     ],
-    class_name="d-grid gap-2 d-md-flex justify-content-md-end",
+    className="d-grid gap-2 d-md-flex justify-content-md-end",
 )
diff --git a/docs/components_page/components/button/half_block.R b/docs/components_page/components/button/half_block.R
index 3a02e66f6..604c5b741 100644
--- a/docs/components_page/components/button/half_block.R
+++ b/docs/components_page/components/button/half_block.R
@@ -6,5 +6,5 @@ button <- htmlDiv(
     dbcButton("Block button", color = "primary"),
     dbcButton("Block button", color = "secondary")
   ),
-  class_name = "d-grid gap-2 col-6 mx-auto"
+  className = "d-grid gap-2 col-6 mx-auto"
 )
diff --git a/docs/components_page/components/button/half_block.jl b/docs/components_page/components/button/half_block.jl
index acc0f7ad3..1cce04fbb 100644
--- a/docs/components_page/components/button/half_block.jl
+++ b/docs/components_page/components/button/half_block.jl
@@ -6,5 +6,5 @@ button = html_div(
         dbc_button("Block button", color = "primary"),
         dbc_button("Block button", color = "secondary"),
     ],
-    class_name = "d-grid gap-2 col-6 mx-auto",
+    className = "d-grid gap-2 col-6 mx-auto",
 );
diff --git a/docs/components_page/components/button/half_block.py b/docs/components_page/components/button/half_block.py
index 99822a88e..9ac7708ba 100644
--- a/docs/components_page/components/button/half_block.py
+++ b/docs/components_page/components/button/half_block.py
@@ -6,5 +6,5 @@
         dbc.Button("Block button", color="primary"),
         dbc.Button("Block button", color="secondary"),
     ],
-    class_name="d-grid gap-2 col-6 mx-auto",
+    className="d-grid gap-2 col-6 mx-auto",
 )
diff --git a/docs/components_page/components/button/outline.R b/docs/components_page/components/button/outline.R
index 94420fd83..4a16326bf 100644
--- a/docs/components_page/components/button/outline.R
+++ b/docs/components_page/components/button/outline.R
@@ -3,16 +3,16 @@ library(dashHtmlComponents)
 
 buttons <- htmlDiv(
   list(
-    dbcButton("Primary", outline = TRUE, color = "primary", class_name = "me-1"),
+    dbcButton("Primary", outline = TRUE, color = "primary", className = "me-1"),
     dbcButton(
       "Secondary",
-      outline = TRUE, color = "secondary", class_name = "me-1"
+      outline = TRUE, color = "secondary", className = "me-1"
     ),
-    dbcButton("Success", outline = TRUE, color = "success", class_name = "me-1"),
-    dbcButton("Warning", outline = TRUE, color = "warning", class_name = "me-1"),
-    dbcButton("Danger", outline = TRUE, color = "danger", class_name = "me-1"),
-    dbcButton("Info", outline = TRUE, color = "info", class_name = "me-1"),
-    dbcButton("Light", outline = TRUE, color = "light", class_name = "me-1"),
+    dbcButton("Success", outline = TRUE, color = "success", className = "me-1"),
+    dbcButton("Warning", outline = TRUE, color = "warning", className = "me-1"),
+    dbcButton("Danger", outline = TRUE, color = "danger", className = "me-1"),
+    dbcButton("Info", outline = TRUE, color = "info", className = "me-1"),
+    dbcButton("Light", outline = TRUE, color = "light", className = "me-1"),
     dbcButton("Dark", outline = TRUE, color = "dark")
   )
 )
diff --git a/docs/components_page/components/button/outline.jl b/docs/components_page/components/button/outline.jl
index 1fe972957..5fd999b97 100644
--- a/docs/components_page/components/button/outline.jl
+++ b/docs/components_page/components/button/outline.jl
@@ -1,12 +1,12 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 buttons = html_div([
-    dbc_button("Primary", outline = true, color = "primary", class_name = "me-1"),
-    dbc_button("Secondary", outline = true, color = "secondary", class_name = "me-1"),
-    dbc_button("Success", outline = true, color = "success", class_name = "me-1"),
-    dbc_button("Warning", outline = true, color = "warning", class_name = "me-1"),
-    dbc_button("Danger", outline = true, color = "danger", class_name = "me-1"),
-    dbc_button("Info", outline = true, color = "info", class_name = "me-1"),
-    dbc_button("Light", outline = true, color = "light", class_name = "me-1"),
+    dbc_button("Primary", outline = true, color = "primary", className = "me-1"),
+    dbc_button("Secondary", outline = true, color = "secondary", className = "me-1"),
+    dbc_button("Success", outline = true, color = "success", className = "me-1"),
+    dbc_button("Warning", outline = true, color = "warning", className = "me-1"),
+    dbc_button("Danger", outline = true, color = "danger", className = "me-1"),
+    dbc_button("Info", outline = true, color = "info", className = "me-1"),
+    dbc_button("Light", outline = true, color = "light", className = "me-1"),
     dbc_button("Dark", outline = true, color = "dark"),
 ]);
diff --git a/docs/components_page/components/button/outline.py b/docs/components_page/components/button/outline.py
index 6c9d50fa8..6eafbe3f5 100644
--- a/docs/components_page/components/button/outline.py
+++ b/docs/components_page/components/button/outline.py
@@ -3,21 +3,15 @@
 
 buttons = html.Div(
     [
+        dbc.Button("Primary", outline=True, color="primary", className="me-1"),
         dbc.Button(
-            "Primary", outline=True, color="primary", class_name="me-1"
+            "Secondary", outline=True, color="secondary", className="me-1"
         ),
-        dbc.Button(
-            "Secondary", outline=True, color="secondary", class_name="me-1"
-        ),
-        dbc.Button(
-            "Success", outline=True, color="success", class_name="me-1"
-        ),
-        dbc.Button(
-            "Warning", outline=True, color="warning", class_name="me-1"
-        ),
-        dbc.Button("Danger", outline=True, color="danger", class_name="me-1"),
-        dbc.Button("Info", outline=True, color="info", class_name="me-1"),
-        dbc.Button("Light", outline=True, color="light", class_name="me-1"),
+        dbc.Button("Success", outline=True, color="success", className="me-1"),
+        dbc.Button("Warning", outline=True, color="warning", className="me-1"),
+        dbc.Button("Danger", outline=True, color="danger", className="me-1"),
+        dbc.Button("Info", outline=True, color="info", className="me-1"),
+        dbc.Button("Light", outline=True, color="light", className="me-1"),
         dbc.Button("Dark", outline=True, color="dark"),
     ]
 )
diff --git a/docs/components_page/components/button/responsive_block.R b/docs/components_page/components/button/responsive_block.R
index 98c484c53..c6c83a675 100644
--- a/docs/components_page/components/button/responsive_block.R
+++ b/docs/components_page/components/button/responsive_block.R
@@ -6,5 +6,5 @@ button <- htmlDiv(
     dbcButton("Block button", color = "primary"),
     dbcButton("Block button", color = "secondary")
   ),
-  class_name = "d-grid gap-2 d-md-block"
+  className = "d-grid gap-2 d-md-block"
 )
diff --git a/docs/components_page/components/button/responsive_block.jl b/docs/components_page/components/button/responsive_block.jl
index 56c3d2387..2f220d9fc 100644
--- a/docs/components_page/components/button/responsive_block.jl
+++ b/docs/components_page/components/button/responsive_block.jl
@@ -6,5 +6,5 @@ button = html_div(
         dbc_button("Block button", color = "primary"),
         dbc_button("Block button", color = "secondary"),
     ],
-    class_name = "d-grid gap-2 d-md-block",
+    className = "d-grid gap-2 d-md-block",
 );
diff --git a/docs/components_page/components/button/responsive_block.py b/docs/components_page/components/button/responsive_block.py
index c4d35f045..2f665fc5a 100644
--- a/docs/components_page/components/button/responsive_block.py
+++ b/docs/components_page/components/button/responsive_block.py
@@ -6,5 +6,5 @@
         dbc.Button("Block button", color="primary"),
         dbc.Button("Block button", color="secondary"),
     ],
-    class_name="d-grid gap-2 d-md-block",
+    className="d-grid gap-2 d-md-block",
 )
diff --git a/docs/components_page/components/button/simple.R b/docs/components_page/components/button/simple.R
index 301994257..092a88fcb 100644
--- a/docs/components_page/components/button/simple.R
+++ b/docs/components_page/components/button/simple.R
@@ -3,14 +3,14 @@ library(dashHtmlComponents)
 
 buttons <- htmlDiv(
   list(
-    dbcButton("Primary", color = "primary", class_name = "me-1"),
-    dbcButton("Secondary", color = "secondary", class_name = "me-1"),
-    dbcButton("Success", color = "success", class_name = "me-1"),
-    dbcButton("Warning", color = "warning", class_name = "me-1"),
-    dbcButton("Danger", color = "danger", class_name = "me-1"),
-    dbcButton("Info", color = "info", class_name = "me-1"),
-    dbcButton("Light", color = "light", class_name = "me-1"),
-    dbcButton("Dark", color = "dark", class_name = "me-1"),
+    dbcButton("Primary", color = "primary", className = "me-1"),
+    dbcButton("Secondary", color = "secondary", className = "me-1"),
+    dbcButton("Success", color = "success", className = "me-1"),
+    dbcButton("Warning", color = "warning", className = "me-1"),
+    dbcButton("Danger", color = "danger", className = "me-1"),
+    dbcButton("Info", color = "info", className = "me-1"),
+    dbcButton("Light", color = "light", className = "me-1"),
+    dbcButton("Dark", color = "dark", className = "me-1"),
     dbcButton("Link", color = "link")
   )
 )
diff --git a/docs/components_page/components/button/simple.jl b/docs/components_page/components/button/simple.jl
index ef415dfbc..1a0989840 100644
--- a/docs/components_page/components/button/simple.jl
+++ b/docs/components_page/components/button/simple.jl
@@ -1,13 +1,13 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 buttons = html_div([
-    dbc_button("Primary", color = "primary", class_name = "me-1"),
-    dbc_button("Secondary", color = "secondary", class_name = "me-1"),
-    dbc_button("Success", color = "success", class_name = "me-1"),
-    dbc_button("Warning", color = "warning", class_name = "me-1"),
-    dbc_button("Danger", color = "danger", class_name = "me-1"),
-    dbc_button("Info", color = "info", class_name = "me-1"),
-    dbc_button("Light", color = "light", class_name = "me-1"),
-    dbc_button("Dark", color = "dark", class_name = "me-1"),
+    dbc_button("Primary", color = "primary", className = "me-1"),
+    dbc_button("Secondary", color = "secondary", className = "me-1"),
+    dbc_button("Success", color = "success", className = "me-1"),
+    dbc_button("Warning", color = "warning", className = "me-1"),
+    dbc_button("Danger", color = "danger", className = "me-1"),
+    dbc_button("Info", color = "info", className = "me-1"),
+    dbc_button("Light", color = "light", className = "me-1"),
+    dbc_button("Dark", color = "dark", className = "me-1"),
     dbc_button("Link", color = "link"),
 ]);
diff --git a/docs/components_page/components/button/simple.py b/docs/components_page/components/button/simple.py
index 253c5401c..e8ec136b1 100644
--- a/docs/components_page/components/button/simple.py
+++ b/docs/components_page/components/button/simple.py
@@ -3,14 +3,14 @@
 
 buttons = html.Div(
     [
-        dbc.Button("Primary", color="primary", class_name="me-1"),
-        dbc.Button("Secondary", color="secondary", class_name="me-1"),
-        dbc.Button("Success", color="success", class_name="me-1"),
-        dbc.Button("Warning", color="warning", class_name="me-1"),
-        dbc.Button("Danger", color="danger", class_name="me-1"),
-        dbc.Button("Info", color="info", class_name="me-1"),
-        dbc.Button("Light", color="light", class_name="me-1"),
-        dbc.Button("Dark", color="dark", class_name="me-1"),
+        dbc.Button("Primary", color="primary", className="me-1"),
+        dbc.Button("Secondary", color="secondary", className="me-1"),
+        dbc.Button("Success", color="success", className="me-1"),
+        dbc.Button("Warning", color="warning", className="me-1"),
+        dbc.Button("Danger", color="danger", className="me-1"),
+        dbc.Button("Info", color="info", className="me-1"),
+        dbc.Button("Light", color="light", className="me-1"),
+        dbc.Button("Dark", color="dark", className="me-1"),
         dbc.Button("Link", color="link"),
     ]
 )
diff --git a/docs/components_page/components/button/size.R b/docs/components_page/components/button/size.R
index 1e178004f..9653c13bb 100644
--- a/docs/components_page/components/button/size.R
+++ b/docs/components_page/components/button/size.R
@@ -3,8 +3,8 @@ library(dashHtmlComponents)
 
 buttons <- htmlDiv(
   list(
-    dbcButton("Large button", size = "lg", class_name = "me-1"),
-    dbcButton("Regular button", class_name = "me-1"),
+    dbcButton("Large button", size = "lg", className = "me-1"),
+    dbcButton("Regular button", className = "me-1"),
     dbcButton("Small button", size = "sm")
   )
 )
diff --git a/docs/components_page/components/button/size.jl b/docs/components_page/components/button/size.jl
index f18cfd0fb..f981a042f 100644
--- a/docs/components_page/components/button/size.jl
+++ b/docs/components_page/components/button/size.jl
@@ -1,7 +1,7 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 buttons = html_div([
-    dbc_button("Large button", size = "lg", class_name = "me-1"),
-    dbc_button("Regular button", class_name = "me-1"),
+    dbc_button("Large button", size = "lg", className = "me-1"),
+    dbc_button("Regular button", className = "me-1"),
     dbc_button("Small button", size = "sm"),
 ]);
diff --git a/docs/components_page/components/button/size.py b/docs/components_page/components/button/size.py
index 6ed28856c..db8c995f0 100644
--- a/docs/components_page/components/button/size.py
+++ b/docs/components_page/components/button/size.py
@@ -3,8 +3,8 @@
 
 buttons = html.Div(
     [
-        dbc.Button("Large button", size="lg", class_name="me-1"),
-        dbc.Button("Regular button", class_name="me-1"),
+        dbc.Button("Large button", size="lg", className="me-1"),
+        dbc.Button("Regular button", className="me-1"),
         dbc.Button("Small button", size="sm"),
     ]
 )
diff --git a/docs/components_page/components/button/usage.R b/docs/components_page/components/button/usage.R
index 7cab7e0da..d95c97f42 100644
--- a/docs/components_page/components/button/usage.R
+++ b/docs/components_page/components/button/usage.R
@@ -5,7 +5,7 @@ button <- htmlDiv(
   list(
     dbcButton("Click me",
       id = "example-button", n_clicks = 0,
-      class_name = "me-2"
+      className = "me-2"
     ),
     htmlSpan(id = "example-output", style = list(verticalAlign = "middle"))
   )
diff --git a/docs/components_page/components/button/usage.jl b/docs/components_page/components/button/usage.jl
index f6b38b7b3..f3a4d11a7 100644
--- a/docs/components_page/components/button/usage.jl
+++ b/docs/components_page/components/button/usage.jl
@@ -1,7 +1,7 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 button = html_div([
-    dbc_button("Click me", id = "example-button", class_name = "me-2", n_clicks = 0),
+    dbc_button("Click me", id = "example-button", className = "me-2", n_clicks = 0),
     html_span(id = "example-output", style = Dict("verticalAlign" => "middle")),
 ]);
 
diff --git a/docs/components_page/components/button/usage.py b/docs/components_page/components/button/usage.py
index 80ffaf3c0..51311d988 100644
--- a/docs/components_page/components/button/usage.py
+++ b/docs/components_page/components/button/usage.py
@@ -4,7 +4,7 @@
 button = html.Div(
     [
         dbc.Button(
-            "Click me", id="example-button", class_name="me-2", n_clicks=0
+            "Click me", id="example-button", className="me-2", n_clicks=0
         ),
         html.Span(id="example-output", style={"verticalAlign": "middle"}),
     ]
diff --git a/docs/components_page/components/button_group.md b/docs/components_page/components/button_group.md
index fc7d01e9b..5c126947d 100644
--- a/docs/components_page/components/button_group.md
+++ b/docs/components_page/components/button_group.md
@@ -41,7 +41,7 @@ Stack buttons in the `ButtonGroup` vertically by setting `vertical=True`.
 
 ## RadioItems as ButtonGroup
 
-Sometimes you might like to use a `ButtonGroup` to let the user choose from a set of options, where the currently chosen option is indicated by that button being marked as "active". Since this requires that buttons respond to other buttons in the group being clicked on, it can be a little awkward to achieve when each button is a separate Dash component. Instead it is easier to use `RadioItems` and do some customisation of the styling. Most of the customisation is achieved with the `input_class_name`, `label_class_name` and `label_checked_class_name` props of the `RadioItems` component, though some additional CSS is required (see below).
+Sometimes you might like to use a `ButtonGroup` to let the user choose from a set of options, where the currently chosen option is indicated by that button being marked as "active". Since this requires that buttons respond to other buttons in the group being clicked on, it can be a little awkward to achieve when each button is a separate Dash component. Instead it is easier to use `RadioItems` and do some customisation of the styling. Most of the customisation is achieved with the `inputClassName`, `labelClassName` and `labelCheckedClassName` props of the `RadioItems` component, though some additional CSS is required (see below).
 
 ```css
 /* restyle radio items */
diff --git a/docs/components_page/components/button_group/radios.R b/docs/components_page/components/button_group/radios.R
index bb38526e7..e6772f061 100644
--- a/docs/components_page/components/button_group/radios.R
+++ b/docs/components_page/components/button_group/radios.R
@@ -5,10 +5,10 @@ button_group <- htmlDiv(
   list(
     dbcRadioItems(
       id = "radios",
-      class_name = "btn-group",
-      input_class_name = "btn-check",
-      label_class_name = "btn btn-outline-primary",
-      label_checked_class_name = "active",
+      className = "btn-group",
+      inputClassName = "btn-check",
+      labelClassName = "btn btn-outline-primary",
+      labelCheckedClassName = "active",
       options = list(
         list(label = "Option 1", value = 1),
         list(label = "Option 2", value = 2),
@@ -18,7 +18,7 @@ button_group <- htmlDiv(
     ),
     htmlDiv(id = "output")
   ),
-  class_name = "radio-group",
+  className = "radio-group",
 )
 
 
diff --git a/docs/components_page/components/button_group/radios.jl b/docs/components_page/components/button_group/radios.jl
index 076b38261..345025202 100644
--- a/docs/components_page/components/button_group/radios.jl
+++ b/docs/components_page/components/button_group/radios.jl
@@ -4,10 +4,10 @@ button_group = html_div(
     [
         dbc_radioitems(
             id = "radios",
-            class_name = "btn-group",
-            input_class_name = "btn-check",
-            label_class_name = "btn btn-outline-primary",
-            label_checked_class_name = "active",
+            className = "btn-group",
+            inputClassName = "btn-check",
+            labelClassName = "btn btn-outline-primary",
+            labelCheckedClassName = "active",
             options = [
                 Dict("label" => "Option 1", "value" => 1),
                 Dict("label" => "Option 2", "value" => 2),
@@ -17,7 +17,7 @@ button_group = html_div(
         ),
         html_div(id = "output"),
     ],
-    class_name = "radio-group",
+    className = "radio-group",
 );
 
 callback!(app, Output("output", "children"), Input("radios", "value")) do value
diff --git a/docs/components_page/components/button_group/radios.py b/docs/components_page/components/button_group/radios.py
index 58efcdc91..5f9a24c59 100644
--- a/docs/components_page/components/button_group/radios.py
+++ b/docs/components_page/components/button_group/radios.py
@@ -5,10 +5,10 @@
     [
         dbc.RadioItems(
             id="radios",
-            class_name="btn-group",
-            input_class_name="btn-check",
-            label_class_name="btn btn-outline-primary",
-            label_checked_class_name="active",
+            className="btn-group",
+            inputClassName="btn-check",
+            labelClassName="btn btn-outline-primary",
+            labelCheckedClassName="active",
             options=[
                 {"label": "Option 1", "value": 1},
                 {"label": "Option 2", "value": 2},
@@ -18,7 +18,7 @@
         ),
         html.Div(id="output"),
     ],
-    class_name="radio-group",
+    className="radio-group",
 )
 
 
diff --git a/docs/components_page/components/button_group/size.R b/docs/components_page/components/button_group/size.R
index 4a2b1e624..b630df206 100644
--- a/docs/components_page/components/button_group/size.R
+++ b/docs/components_page/components/button_group/size.R
@@ -10,7 +10,7 @@ button_groups <- htmlDiv(
         dbcButton("Right")
       ),
       size = "lg",
-      class_name = "me-1",
+      className = "me-1",
     ),
     dbcButtonGroup(
       list(
@@ -18,7 +18,7 @@ button_groups <- htmlDiv(
         dbcButton("Right")
       ),
       size = "md",
-      class_name = "me-1",
+      className = "me-1",
     ),
     dbcButtonGroup(
       list(
diff --git a/docs/components_page/components/button_group/size.jl b/docs/components_page/components/button_group/size.jl
index 0d375e7a1..ea4f5af46 100644
--- a/docs/components_page/components/button_group/size.jl
+++ b/docs/components_page/components/button_group/size.jl
@@ -4,12 +4,12 @@ button_groups = html_div([
     dbc_buttongroup(
         [dbc_button("Left"), dbc_button("Middle"), dbc_button("Right")],
         size = "lg",
-        class_name = "me-1",
+        className = "me-1",
     ),
     dbc_buttongroup(
         [dbc_button("Left"), dbc_button("Middle"), dbc_button("Right")],
         size = "md",
-        class_name = "me-1",
+        className = "me-1",
     ),
     dbc_buttongroup(
         [dbc_button("Left"), dbc_button("Middle"), dbc_button("Right")],
diff --git a/docs/components_page/components/button_group/size.py b/docs/components_page/components/button_group/size.py
index a946300a2..8a7f37b0e 100644
--- a/docs/components_page/components/button_group/size.py
+++ b/docs/components_page/components/button_group/size.py
@@ -6,12 +6,12 @@
         dbc.ButtonGroup(
             [dbc.Button("Left"), dbc.Button("Middle"), dbc.Button("Right")],
             size="lg",
-            class_name="me-1",
+            className="me-1",
         ),
         dbc.ButtonGroup(
             [dbc.Button("Left"), dbc.Button("Middle"), dbc.Button("Right")],
             size="md",
-            class_name="me-1",
+            className="me-1",
         ),
         dbc.ButtonGroup(
             [dbc.Button("Left"), dbc.Button("Middle"), dbc.Button("Right")],
diff --git a/docs/components_page/components/card/body.R b/docs/components_page/components/card/body.R
index e13a6451c..a4db81479 100644
--- a/docs/components_page/components/card/body.R
+++ b/docs/components_page/components/card/body.R
@@ -5,7 +5,7 @@ cards <- htmlDiv(
   list(
     dbcCard(
       dbcCardBody("This is some text within a card body"),
-      class_name = "mb-3"
+      className = "mb-3"
     ),
     dbcCard("This is also within a body", body = TRUE)
   )
diff --git a/docs/components_page/components/card/body.jl b/docs/components_page/components/card/body.jl
index 5c52d6315..4cfc1220d 100644
--- a/docs/components_page/components/card/body.jl
+++ b/docs/components_page/components/card/body.jl
@@ -1,6 +1,6 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 cards = html_div([
-    dbc_card(dbc_cardbody("This is some text within a card body"), class_name = "mb-3"),
+    dbc_card(dbc_cardbody("This is some text within a card body"), className = "mb-3"),
     dbc_card("This is also within a body", body = true),
 ]);
diff --git a/docs/components_page/components/card/body.py b/docs/components_page/components/card/body.py
index 758955aed..1e23d1876 100644
--- a/docs/components_page/components/card/body.py
+++ b/docs/components_page/components/card/body.py
@@ -5,7 +5,7 @@
     [
         dbc.Card(
             dbc.CardBody("This is some text within a card body"),
-            class_name="mb-3",
+            className="mb-3",
         ),
         dbc.Card("This is also within a body", body=True),
     ]
diff --git a/docs/components_page/components/card/color.R b/docs/components_page/components/card/color.R
index 387a13720..09ad30974 100644
--- a/docs/components_page/components/card/color.R
+++ b/docs/components_page/components/card/color.R
@@ -5,10 +5,10 @@ card_content <- list(
   dbcCardHeader("Card header"),
   dbcCardBody(
     list(
-      htmlH5("Card title", class_name = "card-title"),
+      htmlH5("Card title", className = "card-title"),
       htmlP(
         "This is some card content that we'll reuse",
-        class_name = "card-text"
+        className = "card-text"
       )
     )
   )
@@ -22,7 +22,7 @@ cards <- htmlDiv(
         dbcCol(dbcCard(card_content, color = "secondary", inverse = TRUE)),
         dbcCol(dbcCard(card_content, color = "info", inverse = TRUE))
       ),
-      class_name = "mb-4"
+      className = "mb-4"
     ),
     dbcRow(
       list(
@@ -30,7 +30,7 @@ cards <- htmlDiv(
         dbcCol(dbcCard(card_content, color = "warning", inverse = TRUE)),
         dbcCol(dbcCard(card_content, color = "danger", inverse = TRUE))
       ),
-      class_name = "mb-4"
+      className = "mb-4"
     ),
     dbcRow(
       list(
diff --git a/docs/components_page/components/card/color.jl b/docs/components_page/components/card/color.jl
index b82ad2337..522c6039a 100644
--- a/docs/components_page/components/card/color.jl
+++ b/docs/components_page/components/card/color.jl
@@ -3,8 +3,8 @@ using DashBootstrapComponents, DashHtmlComponents
 card_content = [
     dbc_cardheader("Card header"),
     dbc_cardbody([
-        html_h5("Card title", class_name = "card-title"),
-        html_p("This is some card content that we'll reuse", class_name = "card-text"),
+        html_h5("Card title", className = "card-title"),
+        html_p("This is some card content that we'll reuse", className = "card-text"),
     ]),
 ];
 
@@ -15,7 +15,7 @@ cards = html_div([
             dbc_col(dbc_card(card_content, color = "secondary", inverse = true)),
             dbc_col(dbc_card(card_content, color = "info", inverse = true)),
         ],
-        class_name = "mb-4",
+        className = "mb-4",
     ),
     dbc_row(
         [
@@ -23,7 +23,7 @@ cards = html_div([
             dbc_col(dbc_card(card_content, color = "warning", inverse = true)),
             dbc_col(dbc_card(card_content, color = "danger", inverse = true)),
         ],
-        class_name = "mb-4",
+        className = "mb-4",
     ),
     dbc_row([
         dbc_col(dbc_card(card_content, color = "light")),
diff --git a/docs/components_page/components/card/color.py b/docs/components_page/components/card/color.py
index e49c4543d..bdb6c8545 100644
--- a/docs/components_page/components/card/color.py
+++ b/docs/components_page/components/card/color.py
@@ -5,10 +5,10 @@
     dbc.CardHeader("Card header"),
     dbc.CardBody(
         [
-            html.H5("Card title", class_name="card-title"),
+            html.H5("Card title", className="card-title"),
             html.P(
                 "This is some card content that we'll reuse",
-                class_name="card-text",
+                className="card-text",
             ),
         ]
     ),
@@ -24,7 +24,7 @@
                 ),
                 dbc.Col(dbc.Card(card_content, color="info", inverse=True)),
             ],
-            class_name="mb-4",
+            className="mb-4",
         ),
         dbc.Row(
             [
@@ -32,7 +32,7 @@
                 dbc.Col(dbc.Card(card_content, color="warning", inverse=True)),
                 dbc.Col(dbc.Card(card_content, color="danger", inverse=True)),
             ],
-            class_name="mb-4",
+            className="mb-4",
         ),
         dbc.Row(
             [
diff --git a/docs/components_page/components/card/header_footer.R b/docs/components_page/components/card/header_footer.R
index 50696785f..572dd94b4 100644
--- a/docs/components_page/components/card/header_footer.R
+++ b/docs/components_page/components/card/header_footer.R
@@ -6,8 +6,8 @@ card <- dbcCard(
     dbcCardHeader("This is the header"),
     dbcCardBody(
       list(
-        htmlH4("Card title", class_name = "card-title"),
-        htmlP("This is some card text", class_name = "card-text")
+        htmlH4("Card title", className = "card-title"),
+        htmlP("This is some card text", className = "card-text")
       )
     ),
     dbcCardFooter("This is the footer")
diff --git a/docs/components_page/components/card/header_footer.jl b/docs/components_page/components/card/header_footer.jl
index 8ecdec36d..8bd27755a 100644
--- a/docs/components_page/components/card/header_footer.jl
+++ b/docs/components_page/components/card/header_footer.jl
@@ -4,8 +4,8 @@ card = dbc_card(
     [
         dbc_cardheader("This is the header"),
         dbc_cardbody([
-            html_h4("Card title", class_name = "card-title"),
-            html_p("This is some card text", class_name = "card-text"),
+            html_h4("Card title", className = "card-title"),
+            html_p("This is some card text", className = "card-text"),
         ]),
         dbc_cardfooter("This is the footer"),
     ],
diff --git a/docs/components_page/components/card/header_footer.py b/docs/components_page/components/card/header_footer.py
index 2318e8fed..ace520a87 100644
--- a/docs/components_page/components/card/header_footer.py
+++ b/docs/components_page/components/card/header_footer.py
@@ -6,8 +6,8 @@
         dbc.CardHeader("This is the header"),
         dbc.CardBody(
             [
-                html.H4("Card title", class_name="card-title"),
-                html.P("This is some card text", class_name="card-text"),
+                html.H4("Card title", className="card-title"),
+                html.P("This is some card text", className="card-text"),
             ]
         ),
         dbc.CardFooter("This is the footer"),
diff --git a/docs/components_page/components/card/image.R b/docs/components_page/components/card/image.R
index f3c005e4e..c018ffd80 100644
--- a/docs/components_page/components/card/image.R
+++ b/docs/components_page/components/card/image.R
@@ -5,7 +5,7 @@ top_card <- dbcCard(
   list(
     dbcCardImg(src = "/static/images/placeholder286x180.png", top = TRUE),
     dbcCardBody(
-      htmlP("This card has an image at the top", class_name = "card-text")
+      htmlP("This card has an image at the top", className = "card-text")
     )
   ),
   style = list(width = "18rem")
@@ -14,7 +14,7 @@ top_card <- dbcCard(
 bottom_card <- dbcCard(
   list(
     dbcCardBody(
-      htmlP("This has a bottom image", class_name = "card-text")
+      htmlP("This has a bottom image", className = "card-text")
     ),
     dbcCardImg(src = "/static/images/placeholder286x180.png", bottom = TRUE)
   ),
diff --git a/docs/components_page/components/card/image.jl b/docs/components_page/components/card/image.jl
index 4d152cd66..ec07fbd96 100644
--- a/docs/components_page/components/card/image.jl
+++ b/docs/components_page/components/card/image.jl
@@ -3,14 +3,14 @@ using DashBootstrapComponents, DashHtmlComponents
 top_card = dbc_card(
     [
         dbc_cardimg(src = "/static/images/placeholder286x180.png", top = true),
-        dbc_cardbody(html_p("This card has an image at the top", class_name = "card-text")),
+        dbc_cardbody(html_p("This card has an image at the top", className = "card-text")),
     ],
     style = Dict("width" => "18rem"),
 );
 
 bottom_card = dbc_card(
     [
-        dbc_cardbody(html_p("This has a bottom image", class_name = "card-text")),
+        dbc_cardbody(html_p("This has a bottom image", className = "card-text")),
         dbc_cardimg(src = "/static/images/placeholder286x180.png", bottom = true),
     ],
     style = Dict("width" => "18rem"),
diff --git a/docs/components_page/components/card/image.py b/docs/components_page/components/card/image.py
index 0617f37fc..92bb71f71 100644
--- a/docs/components_page/components/card/image.py
+++ b/docs/components_page/components/card/image.py
@@ -5,7 +5,7 @@
     [
         dbc.CardImg(src="/static/images/placeholder286x180.png", top=True),
         dbc.CardBody(
-            html.P("This card has an image at the top", class_name="card-text")
+            html.P("This card has an image at the top", className="card-text")
         ),
     ],
     style={"width": "18rem"},
@@ -13,9 +13,7 @@
 
 bottom_card = dbc.Card(
     [
-        dbc.CardBody(
-            html.P("This has a bottom image", class_name="card-text")
-        ),
+        dbc.CardBody(html.P("This has a bottom image", className="card-text")),
         dbc.CardImg(src="/static/images/placeholder286x180.png", bottom=True),
     ],
     style={"width": "18rem"},
diff --git a/docs/components_page/components/card/image_overlay.R b/docs/components_page/components/card/image_overlay.R
index a4150d321..6c51ef497 100644
--- a/docs/components_page/components/card/image_overlay.R
+++ b/docs/components_page/components/card/image_overlay.R
@@ -7,13 +7,13 @@ card <- dbcCard(
     dbcCardImgOverlay(
       dbcCardBody(
         list(
-          htmlH4("Card title", class_name = "card-title"),
+          htmlH4("Card title", className = "card-title"),
           htmlP(
             paste(
               "An example of using an image in the background of",
               "a card."
             ),
-            class_name = "card-text"
+            className = "card-text"
           ),
           dbcButton("Go somewhere", color = "primary")
         )
diff --git a/docs/components_page/components/card/image_overlay.jl b/docs/components_page/components/card/image_overlay.jl
index 2c4ecdce6..6925b2b19 100644
--- a/docs/components_page/components/card/image_overlay.jl
+++ b/docs/components_page/components/card/image_overlay.jl
@@ -5,10 +5,10 @@ card = dbc_card(
         dbc_cardimg(src = "/static/images/placeholder286x180.png", top = true),
         dbc_cardimgoverlay(
             dbc_cardbody([
-                html_h4("Card title", class_name = "card-title"),
+                html_h4("Card title", className = "card-title"),
                 html_p(
                     "An example of using an image in the background of " * "a card.",
-                    class_name = "card-text",
+                    className = "card-text",
                 ),
                 dbc_button("Go somewhere", color = "primary"),
             ],),
diff --git a/docs/components_page/components/card/image_overlay.py b/docs/components_page/components/card/image_overlay.py
index 191d66333..710f9763a 100644
--- a/docs/components_page/components/card/image_overlay.py
+++ b/docs/components_page/components/card/image_overlay.py
@@ -7,11 +7,11 @@
         dbc.CardImgOverlay(
             dbc.CardBody(
                 [
-                    html.H4("Card title", class_name="card-title"),
+                    html.H4("Card title", className="card-title"),
                     html.P(
                         "An example of using an image in the background of "
                         "a card.",
-                        class_name="card-text",
+                        className="card-text",
                     ),
                     dbc.Button("Go somewhere", color="primary"),
                 ],
diff --git a/docs/components_page/components/card/layout/group.R b/docs/components_page/components/card/layout/group.R
index 323b1978a..a0a01c6ba 100644
--- a/docs/components_page/components/card/layout/group.R
+++ b/docs/components_page/components/card/layout/group.R
@@ -6,17 +6,17 @@ cards <- dbcCardGroup(
     dbcCard(
       dbcCardBody(
         list(
-          htmlH5("Card 1", class_name = "card-title"),
+          htmlH5("Card 1", className = "card-title"),
           htmlP(
             paste(
               "This card has some text content, which is a little",
               "bit longer than the second card."
             ),
-            class_name = "card-text",
+            className = "card-text",
           ),
           dbcButton(
             "Click here",
-            color = "success", class_name = "mt-auto"
+            color = "success", className = "mt-auto"
           )
         )
       )
@@ -24,14 +24,14 @@ cards <- dbcCardGroup(
     dbcCard(
       dbcCardBody(
         list(
-          htmlH5("Card 2", class_name = "card-title"),
+          htmlH5("Card 2", className = "card-title"),
           htmlP(
             "This card has some text content.",
-            class_name = "card-text",
+            className = "card-text",
           ),
           dbcButton(
             "Click here",
-            color = "warning", class_name = "mt-auto"
+            color = "warning", className = "mt-auto"
           )
         )
       )
@@ -39,7 +39,7 @@ cards <- dbcCardGroup(
     dbcCard(
       dbcCardBody(
         list(
-          htmlH5("Card 3", class_name = "card-title"),
+          htmlH5("Card 3", className = "card-title"),
           htmlP(
             paste(
               "This card has some text content, which is longer",
@@ -47,11 +47,11 @@ cards <- dbcCardGroup(
               "demonstrate the equal height property of cards in a",
               "card group."
             ),
-            class_name = "card-text",
+            className = "card-text",
           ),
           dbcButton(
             "Click here",
-            color = "danger", class_name = "mt-auto"
+            color = "danger", className = "mt-auto"
           )
         )
       )
diff --git a/docs/components_page/components/card/layout/group.jl b/docs/components_page/components/card/layout/group.jl
index b3fcbc1d0..d76ada7a8 100644
--- a/docs/components_page/components/card/layout/group.jl
+++ b/docs/components_page/components/card/layout/group.jl
@@ -3,33 +3,33 @@ using DashBootstrapComponents, DashHtmlComponents
 cards = dbc_cardgroup([
     dbc_card(
         dbc_cardbody([
-            html_h5("Card 1", class_name = "card-title"),
+            html_h5("Card 1", className = "card-title"),
             html_p(
                 "This card has some text content, which is a little " *
                 "bit longer than the second card.",
-                class_name = "card-text",
+                className = "card-text",
             ),
-            dbc_button("Click here", color = "success", class_name = "mt-auto"),
+            dbc_button("Click here", color = "success", className = "mt-auto"),
         ]),
     ),
     dbc_card(
         dbc_cardbody([
-            html_h5("Card 2", class_name = "card-title"),
-            html_p("This card has some text content.", class_name = "card-text"),
-            dbc_button("Click here", color = "warning", class_name = "mt-auto"),
+            html_h5("Card 2", className = "card-title"),
+            html_p("This card has some text content.", className = "card-text"),
+            dbc_button("Click here", color = "warning", className = "mt-auto"),
         ]),
     ),
     dbc_card(
         dbc_cardbody([
-            html_h5("Card 3", class_name = "card-title"),
+            html_h5("Card 3", className = "card-title"),
             html_p(
                 "This card has some text content, which is longer " *
                 "than both of the other two cards, in order to " *
                 "demonstrate the equal height property of cards in a " *
                 "card group.",
-                class_name = "card-text",
+                className = "card-text",
             ),
-            dbc_button("Click here", color = "danger", class_name = "mt-auto"),
+            dbc_button("Click here", color = "danger", className = "mt-auto"),
         ]),
     ),
 ]);
diff --git a/docs/components_page/components/card/layout/group.py b/docs/components_page/components/card/layout/group.py
index 6e64eb136..85293f700 100644
--- a/docs/components_page/components/card/layout/group.py
+++ b/docs/components_page/components/card/layout/group.py
@@ -6,14 +6,14 @@
         dbc.Card(
             dbc.CardBody(
                 [
-                    html.H5("Card 1", class_name="card-title"),
+                    html.H5("Card 1", className="card-title"),
                     html.P(
                         "This card has some text content, which is a little "
                         "bit longer than the second card.",
-                        class_name="card-text",
+                        className="card-text",
                     ),
                     dbc.Button(
-                        "Click here", color="success", class_name="mt-auto"
+                        "Click here", color="success", className="mt-auto"
                     ),
                 ]
             )
@@ -21,13 +21,13 @@
         dbc.Card(
             dbc.CardBody(
                 [
-                    html.H5("Card 2", class_name="card-title"),
+                    html.H5("Card 2", className="card-title"),
                     html.P(
                         "This card has some text content.",
-                        class_name="card-text",
+                        className="card-text",
                     ),
                     dbc.Button(
-                        "Click here", color="warning", class_name="mt-auto"
+                        "Click here", color="warning", className="mt-auto"
                     ),
                 ]
             )
@@ -35,16 +35,16 @@
         dbc.Card(
             dbc.CardBody(
                 [
-                    html.H5("Card 3", class_name="card-title"),
+                    html.H5("Card 3", className="card-title"),
                     html.P(
                         "This card has some text content, which is longer "
                         "than both of the other two cards, in order to "
                         "demonstrate the equal height property of cards in a "
                         "card group.",
-                        class_name="card-text",
+                        className="card-text",
                     ),
                     dbc.Button(
-                        "Click here", color="danger", class_name="mt-auto"
+                        "Click here", color="danger", className="mt-auto"
                     ),
                 ]
             )
diff --git a/docs/components_page/components/card/outline.R b/docs/components_page/components/card/outline.R
index 938dc2f7a..dc18dcfe3 100644
--- a/docs/components_page/components/card/outline.R
+++ b/docs/components_page/components/card/outline.R
@@ -5,10 +5,10 @@ card_content <- list(
   dbcCardHeader("Card header"),
   dbcCardBody(
     list(
-      htmlH5("Card title", class_name = "card-title"),
+      htmlH5("Card title", className = "card-title"),
       htmlP(
         "This is some card content that we'll reuse",
-        class_name = "card-text"
+        className = "card-text"
       )
     )
   )
@@ -20,7 +20,7 @@ row_1 <- dbcRow(
     dbcCol(dbcCard(card_content, color = "secondary", outline = TRUE)),
     dbcCol(dbcCard(card_content, color = "info", outline = TRUE))
   ),
-  class_name = "mb-4"
+  className = "mb-4"
 )
 
 row_2 <- dbcRow(
@@ -29,7 +29,7 @@ row_2 <- dbcRow(
     dbcCol(dbcCard(card_content, color = "warning", outline = TRUE)),
     dbcCol(dbcCard(card_content, color = "danger", outline = TRUE))
   ),
-  class_name = "mb-4"
+  className = "mb-4"
 )
 
 row_3 <- dbcRow(
diff --git a/docs/components_page/components/card/outline.jl b/docs/components_page/components/card/outline.jl
index f2e29247d..afe5f6156 100644
--- a/docs/components_page/components/card/outline.jl
+++ b/docs/components_page/components/card/outline.jl
@@ -3,8 +3,8 @@ using DashBootstrapComponents, DashHtmlComponents
 card_content = [
     dbc_cardheader("Card header"),
     dbc_cardbody([
-        html_h5("Card title", class_name = "card-title"),
-        html_p("This is some card content that we'll reuse", class_name = "card-text"),
+        html_h5("Card title", className = "card-title"),
+        html_p("This is some card content that we'll reuse", className = "card-text"),
     ]),
 ];
 
@@ -14,7 +14,7 @@ row_1 = dbc_row(
         dbc_col(dbc_card(card_content, color = "secondary", outline = true)),
         dbc_col(dbc_card(card_content, color = "info", outline = true)),
     ],
-    class_name = "mb-4",
+    className = "mb-4",
 );
 
 row_2 = dbc_row(
@@ -23,7 +23,7 @@ row_2 = dbc_row(
         dbc_col(dbc_card(card_content, color = "warning", outline = true)),
         dbc_col(dbc_card(card_content, color = "danger", outline = true)),
     ],
-    class_name = "mb-4",
+    className = "mb-4",
 );
 
 row_3 = dbc_row([
diff --git a/docs/components_page/components/card/outline.py b/docs/components_page/components/card/outline.py
index 012dfc526..13e2badaf 100644
--- a/docs/components_page/components/card/outline.py
+++ b/docs/components_page/components/card/outline.py
@@ -5,10 +5,10 @@
     dbc.CardHeader("Card header"),
     dbc.CardBody(
         [
-            html.H5("Card title", class_name="card-title"),
+            html.H5("Card title", className="card-title"),
             html.P(
                 "This is some card content that we'll reuse",
-                class_name="card-text",
+                className="card-text",
             ),
         ]
     ),
@@ -20,7 +20,7 @@
         dbc.Col(dbc.Card(card_content, color="secondary", outline=True)),
         dbc.Col(dbc.Card(card_content, color="info", outline=True)),
     ],
-    class_name="mb-4",
+    className="mb-4",
 )
 
 row_2 = dbc.Row(
@@ -29,7 +29,7 @@
         dbc.Col(dbc.Card(card_content, color="warning", outline=True)),
         dbc.Col(dbc.Card(card_content, color="danger", outline=True)),
     ],
-    class_name="mb-4",
+    className="mb-4",
 )
 
 row_3 = dbc.Row(
diff --git a/docs/components_page/components/card/simple.R b/docs/components_page/components/card/simple.R
index b96c9dbca..e8c789bfb 100644
--- a/docs/components_page/components/card/simple.R
+++ b/docs/components_page/components/card/simple.R
@@ -6,13 +6,13 @@ card <- dbcCard(
     dbcCardImg(src = "/static/images/placeholder286x180.png", top = TRUE),
     dbcCardBody(
       list(
-        htmlH4("Card title", class_name = "card-title"),
+        htmlH4("Card title", className = "card-title"),
         htmlP(
           paste(
             "Some quick example text to build on the card title and",
             "make up the bulk of the card's content."
           ),
-          class_name = "card-text"
+          className = "card-text"
         ),
         dbcButton("Go somewhere", color = "primary")
       )
diff --git a/docs/components_page/components/card/simple.jl b/docs/components_page/components/card/simple.jl
index 0ac3ad594..17d20997f 100644
--- a/docs/components_page/components/card/simple.jl
+++ b/docs/components_page/components/card/simple.jl
@@ -4,11 +4,11 @@ card = dbc_card(
     [
         dbc_cardimg(src = "/static/images/placeholder286x180.png", top = true),
         dbc_cardbody([
-            html_h4("Card title", class_name = "card-title"),
+            html_h4("Card title", className = "card-title"),
             html_p(
                 "Some quick example text to build on the card title and " *
                 "make up the bulk of the card's content.",
-                class_name = "card-text",
+                className = "card-text",
             ),
             dbc_button("Go somewhere", color = "primary"),
         ]),
diff --git a/docs/components_page/components/card/simple.py b/docs/components_page/components/card/simple.py
index 78d24a964..180efb20b 100644
--- a/docs/components_page/components/card/simple.py
+++ b/docs/components_page/components/card/simple.py
@@ -6,11 +6,11 @@
         dbc.CardImg(src="/static/images/placeholder286x180.png", top=True),
         dbc.CardBody(
             [
-                html.H4("Card title", class_name="card-title"),
+                html.H4("Card title", className="card-title"),
                 html.P(
                     "Some quick example text to build on the card title and "
                     "make up the bulk of the card's content.",
-                    class_name="card-text",
+                    className="card-text",
                 ),
                 dbc.Button("Go somewhere", color="primary"),
             ]
diff --git a/docs/components_page/components/card/sizing/css.R b/docs/components_page/components/card/sizing/css.R
index ca8dafc6a..edf01d2ae 100644
--- a/docs/components_page/components/card/sizing/css.R
+++ b/docs/components_page/components/card/sizing/css.R
@@ -4,7 +4,7 @@ library(dashHtmlComponents)
 cards <- dbcCard(
   dbcCardBody(
     list(
-      htmlH5("Custom CSS", class_name = "card-title"),
+      htmlH5("Custom CSS", className = "card-title"),
       htmlP(
         paste(
           "This card has inline styles applied controlling the width.",
diff --git a/docs/components_page/components/card/sizing/css.jl b/docs/components_page/components/card/sizing/css.jl
index 1e15e0262..240af9d83 100644
--- a/docs/components_page/components/card/sizing/css.jl
+++ b/docs/components_page/components/card/sizing/css.jl
@@ -2,7 +2,7 @@ using DashBootstrapComponents, DashHtmlComponents
 
 cards = dbc_card(
     dbc_cardbody([
-        html_h5("Custom CSS", class_name = "card-title"),
+        html_h5("Custom CSS", className = "card-title"),
         html_p(
             "This card has inline styles applied controlling the width. " *
             "You could also apply the same styles with a custom CSS class.",
diff --git a/docs/components_page/components/card/sizing/css.py b/docs/components_page/components/card/sizing/css.py
index 7b13168a0..ce561e269 100644
--- a/docs/components_page/components/card/sizing/css.py
+++ b/docs/components_page/components/card/sizing/css.py
@@ -4,7 +4,7 @@
 cards = dbc.Card(
     dbc.CardBody(
         [
-            html.H5("Custom CSS", class_name="card-title"),
+            html.H5("Custom CSS", className="card-title"),
             html.P(
                 "This card has inline styles applied controlling the width. "
                 "You could also apply the same styles with a custom CSS class."
diff --git a/docs/components_page/components/card/sizing/grid.R b/docs/components_page/components/card/sizing/grid.R
index 6961b0378..6b467df20 100644
--- a/docs/components_page/components/card/sizing/grid.R
+++ b/docs/components_page/components/card/sizing/grid.R
@@ -4,7 +4,7 @@ library(dashHtmlComponents)
 first_card <- dbcCard(
   dbcCardBody(
     list(
-      htmlH5("Card title", class_name = "card-title"),
+      htmlH5("Card title", className = "card-title"),
       htmlP("This card has some text content, but not much else"),
       dbcButton("Go somewhere", color = "primary")
     )
@@ -14,7 +14,7 @@ first_card <- dbcCard(
 second_card <- dbcCard(
   dbcCardBody(
     list(
-      htmlH5("Card title", class_name = "card-title"),
+      htmlH5("Card title", className = "card-title"),
       htmlP(
         paste(
           "This card also has some text content and not much else, but",
diff --git a/docs/components_page/components/card/sizing/grid.jl b/docs/components_page/components/card/sizing/grid.jl
index 2540bfe21..fd6376a89 100644
--- a/docs/components_page/components/card/sizing/grid.jl
+++ b/docs/components_page/components/card/sizing/grid.jl
@@ -2,7 +2,7 @@ using DashBootstrapComponents, DashHtmlComponents
 
 first_card = dbc_card(
     dbc_cardbody([
-        html_h5("Card title", class_name = "card-title"),
+        html_h5("Card title", className = "card-title"),
         html_p("This card has some text content, but not much else"),
         dbc_button("Go somewhere", color = "primary"),
     ]),
@@ -11,7 +11,7 @@ first_card = dbc_card(
 
 second_card = dbc_card(
     dbc_cardbody([
-        html_h5("Card title", class_name = "card-title"),
+        html_h5("Card title", className = "card-title"),
         html_p(
             "This card also has some text content and not much else, but " *
             "it is twice as wide as the first card.",
diff --git a/docs/components_page/components/card/sizing/grid.py b/docs/components_page/components/card/sizing/grid.py
index 723ddce74..dfc4313f8 100644
--- a/docs/components_page/components/card/sizing/grid.py
+++ b/docs/components_page/components/card/sizing/grid.py
@@ -4,7 +4,7 @@
 first_card = dbc.Card(
     dbc.CardBody(
         [
-            html.H5("Card title", class_name="card-title"),
+            html.H5("Card title", className="card-title"),
             html.P("This card has some text content, but not much else"),
             dbc.Button("Go somewhere", color="primary"),
         ]
@@ -15,7 +15,7 @@
 second_card = dbc.Card(
     dbc.CardBody(
         [
-            html.H5("Card title", class_name="card-title"),
+            html.H5("Card title", className="card-title"),
             html.P(
                 "This card also has some text content and not much else, but "
                 "it is twice as wide as the first card."
diff --git a/docs/components_page/components/card/sizing/horizontal.R b/docs/components_page/components/card/sizing/horizontal.R
index 491adc3bb..871083048 100644
--- a/docs/components_page/components/card/sizing/horizontal.R
+++ b/docs/components_page/components/card/sizing/horizontal.R
@@ -8,34 +8,34 @@ card <- dbcCard(
         dbcCol(
           dbcCardImg(
             src = "/static/images/placeholder286x180.png",
-            class_name = "img-fluid rounded-start"
+            className = "img-fluid rounded-start"
           ),
-          class_name = "col-md-4"
+          className = "col-md-4"
         ),
         dbcCol(
           dbcCardBody(
             list(
-              htmlH4("Card title", class_name = "card-title"),
+              htmlH4("Card title", className = "card-title"),
               htmlP(
                 paste(
                   "This is a wider card with supporting text",
                   "below as a natural lead-in to additional",
                   "content. This content is a bit longer."
                 ),
-                class_name = "card-text"
+                className = "card-text"
               ),
               htmlSmall(
                 "Last updated 3 mins ago",
-                class_name = "card-text text-muted"
+                className = "card-text text-muted"
               )
             )
           ),
-          class_name = "col-md-8"
+          className = "col-md-8"
         )
       ),
-      class_name = "g-0 d-flex align-items-center"
+      className = "g-0 d-flex align-items-center"
     )
   ),
-  class_name = "mb-3",
+  className = "mb-3",
   style = list("maxWidth" = "540px")
 )
diff --git a/docs/components_page/components/card/sizing/horizontal.jl b/docs/components_page/components/card/sizing/horizontal.jl
index 96ddad294..9f5ddb50d 100644
--- a/docs/components_page/components/card/sizing/horizontal.jl
+++ b/docs/components_page/components/card/sizing/horizontal.jl
@@ -7,30 +7,30 @@ card = dbc_card(
                 dbc_col(
                     dbc_cardimg(
                         src = "/static/images/placeholder286x180.png",
-                        class_name = "img-fluid rounded-start",
+                        className = "img-fluid rounded-start",
                     ),
-                    class_name = "col-md-4",
+                    className = "col-md-4",
                 ),
                 dbc_col(
                     dbc_cardbody([
-                        html_h4("Card title", class_name = "card-title"),
+                        html_h4("Card title", className = "card-title"),
                         html_p(
                             "This is a wider card with supporting text " *
                             "below as a natural lead-in to additional " *
                             "content. This content is a bit longer.",
-                            class_name = "card-text",
+                            className = "card-text",
                         ),
                         html_small(
                             "Last updated 3 mins ago",
-                            class_name = "card-text text-muted",
+                            className = "card-text text-muted",
                         ),
                     ]),
-                    class_name = "col-md-8",
+                    className = "col-md-8",
                 ),
             ],
-            class_name = "g-0 d-flex align-items-center",
+            className = "g-0 d-flex align-items-center",
         ),
     ],
-    class_name = "mb-3",
+    className = "mb-3",
     style = Dict("maxWidth" => "540px"),
 )
diff --git a/docs/components_page/components/card/sizing/horizontal.py b/docs/components_page/components/card/sizing/horizontal.py
index 07864c076..0587fef1a 100644
--- a/docs/components_page/components/card/sizing/horizontal.py
+++ b/docs/components_page/components/card/sizing/horizontal.py
@@ -8,32 +8,32 @@
                 dbc.Col(
                     dbc.CardImg(
                         src="/static/images/placeholder286x180.png",
-                        class_name="img-fluid rounded-start",
+                        className="img-fluid rounded-start",
                     ),
-                    class_name="col-md-4",
+                    className="col-md-4",
                 ),
                 dbc.Col(
                     dbc.CardBody(
                         [
-                            html.H4("Card title", class_name="card-title"),
+                            html.H4("Card title", className="card-title"),
                             html.P(
                                 "This is a wider card with supporting text "
                                 "below as a natural lead-in to additional "
                                 "content. This content is a bit longer.",
-                                class_name="card-text",
+                                className="card-text",
                             ),
                             html.Small(
                                 "Last updated 3 mins ago",
-                                class_name="card-text text-muted",
+                                className="card-text text-muted",
                             ),
                         ]
                     ),
-                    class_name="col-md-8",
+                    className="col-md-8",
                 ),
             ],
-            class_name="g-0 d-flex align-items-center",
+            className="g-0 d-flex align-items-center",
         )
     ],
-    class_name="mb-3",
+    className="mb-3",
     style={"maxWidth": "540px"},
 )
diff --git a/docs/components_page/components/card/sizing/utility.R b/docs/components_page/components/card/sizing/utility.R
index 8396fd0b5..a1c4a4592 100644
--- a/docs/components_page/components/card/sizing/utility.R
+++ b/docs/components_page/components/card/sizing/utility.R
@@ -6,34 +6,34 @@ cards <- htmlDiv(
     dbcCard(
       dbcCardBody(
         list(
-          htmlH5("75% width card", class_name = "card-title"),
+          htmlH5("75% width card", className = "card-title"),
           htmlP(
             list(
               "This card uses the ",
               htmlCode("w-75"),
               " class to set the width to 75%"
             ),
-            class_name = "card-text"
+            className = "card-text"
           )
         )
       ),
-      class_name = "w-75 mb-3"
+      className = "w-75 mb-3"
     ),
     dbcCard(
       dbcCardBody(
         list(
-          htmlH5("50% width card", class_name = "card-title"),
+          htmlH5("50% width card", className = "card-title"),
           htmlP(
             list(
               "This card uses the ",
               htmlCode("w-50"),
               " class to set the width to 50%"
             ),
-            class_name = "card-text"
+            className = "card-text"
           )
         )
       ),
-      class_name = "w-50"
+      className = "w-50"
     )
   )
 )
diff --git a/docs/components_page/components/card/sizing/utility.jl b/docs/components_page/components/card/sizing/utility.jl
index 46852947d..4eb9b8468 100644
--- a/docs/components_page/components/card/sizing/utility.jl
+++ b/docs/components_page/components/card/sizing/utility.jl
@@ -3,30 +3,30 @@ using DashBootstrapComponents, DashHtmlComponents
 cards = html_div([
     dbc_card(
         dbc_cardbody([
-            html_h5("75% width card", class_name = "card-title"),
+            html_h5("75% width card", className = "card-title"),
             html_p(
                 [
                     "This card uses the ",
                     html_code("w-75"),
                     " class to set the width to 75%",
                 ],
-                class_name = "card-text",
+                className = "card-text",
             ),
         ]),
-        class_name = "w-75 mb-3",
+        className = "w-75 mb-3",
     ),
     dbc_card(
         dbc_cardbody([
-            html_h5("50% width card", class_name = "card-title"),
+            html_h5("50% width card", className = "card-title"),
             html_p(
                 [
                     "This card uses the ",
                     html_code("w-50"),
                     " class to set the width to 50%",
                 ],
-                class_name = "card-text",
+                className = "card-text",
             ),
         ]),
-        class_name = "w-50",
+        className = "w-50",
     ),
 ]);
diff --git a/docs/components_page/components/card/sizing/utility.py b/docs/components_page/components/card/sizing/utility.py
index f275b7927..b2d0bd228 100644
--- a/docs/components_page/components/card/sizing/utility.py
+++ b/docs/components_page/components/card/sizing/utility.py
@@ -6,34 +6,34 @@
         dbc.Card(
             dbc.CardBody(
                 [
-                    html.H5("75% width card", class_name="card-title"),
+                    html.H5("75% width card", className="card-title"),
                     html.P(
                         [
                             "This card uses the ",
                             html.Code("w-75"),
                             " class to set the width to 75%",
                         ],
-                        class_name="card-text",
+                        className="card-text",
                     ),
                 ]
             ),
-            class_name="w-75 mb-3",
+            className="w-75 mb-3",
         ),
         dbc.Card(
             dbc.CardBody(
                 [
-                    html.H5("50% width card", class_name="card-title"),
+                    html.H5("50% width card", className="card-title"),
                     html.P(
                         [
                             "This card uses the ",
                             html.Code("w-50"),
                             " class to set the width to 50%",
                         ],
-                        class_name="card-text",
+                        className="card-text",
                     ),
                 ]
             ),
-            class_name="w-50",
+            className="w-50",
         ),
     ]
 )
diff --git a/docs/components_page/components/card/ttl.R b/docs/components_page/components/card/ttl.R
index aa480b6c0..b061cee4a 100644
--- a/docs/components_page/components/card/ttl.R
+++ b/docs/components_page/components/card/ttl.R
@@ -4,14 +4,14 @@ library(dashHtmlComponents)
 card <- dbcCard(
   dbcCardBody(
     list(
-      htmlH4("Title", class_name = "card-title"),
-      htmlH6("Card subtitle", class_name = "card-subtitle"),
+      htmlH4("Title", className = "card-title"),
+      htmlH6("Card subtitle", className = "card-subtitle"),
       htmlP(
         paste(
           "Some quick example text to build on the card title and",
           "make up the bulk of the card's content."
         ),
-        class_name = "card-text",
+        className = "card-text",
       ),
       dbcCardLink("Card link", href = "#"),
       dbcCardLink("External link", href = "https://google.com")
diff --git a/docs/components_page/components/card/ttl.jl b/docs/components_page/components/card/ttl.jl
index ebe1c728d..caae09fca 100644
--- a/docs/components_page/components/card/ttl.jl
+++ b/docs/components_page/components/card/ttl.jl
@@ -2,12 +2,12 @@ using DashBootstrapComponents, DashHtmlComponents
 
 card = dbc_card(
     dbc_cardbody([
-        html_h4("Title", class_name = "card-title"),
-        html_h6("Card subtitle", class_name = "card-subtitle"),
+        html_h4("Title", className = "card-title"),
+        html_h6("Card subtitle", className = "card-subtitle"),
         html_p(
             "Some quick example text to build on the card title and make " *
             "up the bulk of the card's content.",
-            class_name = "card-text",
+            className = "card-text",
         ),
         dbc_cardlink("Card link", href = "#"),
         dbc_cardlink("External link", href = "https://google.com"),
diff --git a/docs/components_page/components/card/ttl.py b/docs/components_page/components/card/ttl.py
index fbaf29c77..b05ab15e8 100644
--- a/docs/components_page/components/card/ttl.py
+++ b/docs/components_page/components/card/ttl.py
@@ -4,12 +4,12 @@
 card = dbc.Card(
     dbc.CardBody(
         [
-            html.H4("Title", class_name="card-title"),
-            html.H6("Card subtitle", class_name="card-subtitle"),
+            html.H4("Title", className="card-title"),
+            html.H6("Card subtitle", className="card-subtitle"),
             html.P(
                 "Some quick example text to build on the card title and make "
                 "up the bulk of the card's content.",
-                class_name="card-text",
+                className="card-text",
             ),
             dbc.CardLink("Card link", href="#"),
             dbc.CardLink("External link", href="https://google.com"),
diff --git a/docs/components_page/components/carousel/captions.R b/docs/components_page/components/carousel/captions.R
index 55ecc5c4e..377f1804f 100644
--- a/docs/components_page/components/carousel/captions.R
+++ b/docs/components_page/components/carousel/captions.R
@@ -22,7 +22,3 @@ carousel <- dbcCarousel(
     )
   )
 )
-
-
-
-
diff --git a/docs/components_page/components/collapse/multiple.R b/docs/components_page/components/collapse/multiple.R
index dc1549380..d2163b80b 100644
--- a/docs/components_page/components/collapse/multiple.R
+++ b/docs/components_page/components/collapse/multiple.R
@@ -5,11 +5,11 @@ collapses <- htmlDiv(
   list(
     dbcButton("Toggle left",
       color = "primary", id = "left",
-      class_name = "me-1", n_clicks = 0
+      className = "me-1", n_clicks = 0
     ),
     dbcButton("Toggle right",
       color = "primary", id = "right",
-      class_name = "me-1", n_clicks = 0
+      className = "me-1", n_clicks = 0
     ),
     dbcButton("Toggle both", color = "primary", id = "both", n_clicks = 0),
     dbcRow(
@@ -29,7 +29,7 @@ collapses <- htmlDiv(
           )
         )
       ),
-      class_name = "mt-3"
+      className = "mt-3"
     )
   )
 )
diff --git a/docs/components_page/components/collapse/multiple.jl b/docs/components_page/components/collapse/multiple.jl
index 75b4ebae0..1d8f5abd7 100644
--- a/docs/components_page/components/collapse/multiple.jl
+++ b/docs/components_page/components/collapse/multiple.jl
@@ -5,14 +5,14 @@ collapses = html_div([
         "Toggle left",
         color = "primary",
         id = "left",
-        class_name = "me-1",
+        className = "me-1",
         n_clicks = 0,
     ),
     dbc_button(
         "Toggle right",
         color = "primary",
         id = "right",
-        class_name = "me-1",
+        className = "me-1",
         n_clicks = 0,
     ),
     dbc_button("Toggle both", color = "primary", id = "both", n_clicks = 0),
@@ -33,7 +33,7 @@ collapses = html_div([
                 ),
             ),
         ],
-        class_name = "mt-3",
+        className = "mt-3",
     ),
 ]);
 
diff --git a/docs/components_page/components/collapse/multiple.py b/docs/components_page/components/collapse/multiple.py
index 059d1fad0..f7703632d 100644
--- a/docs/components_page/components/collapse/multiple.py
+++ b/docs/components_page/components/collapse/multiple.py
@@ -7,14 +7,14 @@
             "Toggle left",
             color="primary",
             id="left",
-            class_name="me-1",
+            className="me-1",
             n_clicks=0,
         ),
         dbc.Button(
             "Toggle right",
             color="primary",
             id="right",
-            class_name="me-1",
+            className="me-1",
             n_clicks=0,
         ),
         dbc.Button("Toggle both", color="primary", id="both", n_clicks=0),
@@ -35,7 +35,7 @@
                     )
                 ),
             ],
-            class_name="mt-3",
+            className="mt-3",
         ),
     ]
 )
diff --git a/docs/components_page/components/collapse/simple.R b/docs/components_page/components/collapse/simple.R
index aa4331a83..a3a909819 100644
--- a/docs/components_page/components/collapse/simple.R
+++ b/docs/components_page/components/collapse/simple.R
@@ -7,7 +7,7 @@ collapse <- htmlDiv(
     dbcButton(
       "Open collapse",
       id = "collapse-button",
-      class_name = "mb-3",
+      className = "mb-3",
       color = "primary",
       n_clicks = 0
     ),
diff --git a/docs/components_page/components/collapse/simple.jl b/docs/components_page/components/collapse/simple.jl
index 6ac4f33c3..730835f6b 100644
--- a/docs/components_page/components/collapse/simple.jl
+++ b/docs/components_page/components/collapse/simple.jl
@@ -4,7 +4,7 @@ collapse = html_div([
     dbc_button(
         "Open collapse",
         id = "collapse-button",
-        class_name = "mb-3",
+        className = "mb-3",
         color = "primary",
         n_clicks = 0,
     ),
diff --git a/docs/components_page/components/collapse/simple.py b/docs/components_page/components/collapse/simple.py
index bd9ad1b57..f81df3ba2 100644
--- a/docs/components_page/components/collapse/simple.py
+++ b/docs/components_page/components/collapse/simple.py
@@ -6,7 +6,7 @@
         dbc.Button(
             "Open collapse",
             id="collapse-button",
-            class_name="mb-3",
+            className="mb-3",
             color="primary",
             n_clicks=0,
         ),
diff --git a/docs/components_page/components/dropdown.md b/docs/components_page/components/dropdown.md
index 4ea11b419..5e27b7ae7 100644
--- a/docs/components_page/components/dropdown.md
+++ b/docs/components_page/components/dropdown.md
@@ -25,7 +25,7 @@ Set `menu_variant="dark"` to change the dropdown menu to a dark colour scheme.
 
 ## Styling the toggle
 
-You can use the `color` prop of `DropdownMenu` to set the color to one of the Bootstrap contextual colors. If you want to further customise the style you can use the `toggle_style` and `toggle_class_name` arguments.
+You can use the `color` prop of `DropdownMenu` to set the color to one of the Bootstrap contextual colors. If you want to further customise the style you can use the `toggle_style` and `toggleClassName` arguments.
 
 {{example:components/dropdown/style.py:dropdowns}}
 
diff --git a/docs/components_page/components/dropdown/content.R b/docs/components_page/components/dropdown/content.R
index 3e3a39557..1cbc2ad72 100644
--- a/docs/components_page/components/dropdown/content.R
+++ b/docs/components_page/components/dropdown/content.R
@@ -12,7 +12,7 @@ dropdown <- dbcDropdownMenu(
     dbcDropdownMenuItem(divider = TRUE),
     htmlP(
       "You can have other content here like text if you like.",
-      class_name = "text-muted px-4 mt-4"
+      className = "text-muted px-4 mt-4"
     )
   ),
   label = "Menu"
diff --git a/docs/components_page/components/dropdown/content.jl b/docs/components_page/components/dropdown/content.jl
index 83e9eb56a..3f92a63a8 100644
--- a/docs/components_page/components/dropdown/content.jl
+++ b/docs/components_page/components/dropdown/content.jl
@@ -11,7 +11,7 @@ dropdown = dbc_dropdownmenu(
         dbc_dropdownmenuitem(divider = true),
         html_p(
             "You can have other content here like text if you like.",
-            class_name = "text-muted px-4 mt-4",
+            className = "text-muted px-4 mt-4",
         ),
     ],
     label = "Menu",
diff --git a/docs/components_page/components/dropdown/content.py b/docs/components_page/components/dropdown/content.py
index 293aa256a..5fb1b7031 100644
--- a/docs/components_page/components/dropdown/content.py
+++ b/docs/components_page/components/dropdown/content.py
@@ -12,7 +12,7 @@
         dbc.DropdownMenuItem(divider=True),
         html.P(
             "You can have other content here like text if you like.",
-            class_name="text-muted px-4 mt-4",
+            className="text-muted px-4 mt-4",
         ),
     ],
     label="Menu",
diff --git a/docs/components_page/components/dropdown/menu_items.R b/docs/components_page/components/dropdown/menu_items.R
index fad5eb38c..9179946fe 100644
--- a/docs/components_page/components/dropdown/menu_items.R
+++ b/docs/components_page/components/dropdown/menu_items.R
@@ -22,7 +22,7 @@ dropdown <- htmlDiv(
       ),
       label = "Menu"
     ),
-    htmlP(id = "item-clicks", class_name = "mt-3")
+    htmlP(id = "item-clicks", className = "mt-3")
   )
 )
 
diff --git a/docs/components_page/components/dropdown/menu_items.jl b/docs/components_page/components/dropdown/menu_items.jl
index 066e3fd26..2e920b85b 100644
--- a/docs/components_page/components/dropdown/menu_items.jl
+++ b/docs/components_page/components/dropdown/menu_items.jl
@@ -14,7 +14,7 @@ dropdown = html_div([
         ],
         label = "Menu",
     ),
-    html_p(id = "item-clicks", class_name = "mt-3"),
+    html_p(id = "item-clicks", className = "mt-3"),
 ]);
 
 callback!(app, Output("item-clicks", "children"), Input("dropdown-button", "n_clicks")) do n
diff --git a/docs/components_page/components/dropdown/menu_items.py b/docs/components_page/components/dropdown/menu_items.py
index 3c3dd437e..03ddf995f 100644
--- a/docs/components_page/components/dropdown/menu_items.py
+++ b/docs/components_page/components/dropdown/menu_items.py
@@ -22,7 +22,7 @@
             ],
             label="Menu",
         ),
-        html.P(id="item-clicks", class_name="mt-3"),
+        html.P(id="item-clicks", className="mt-3"),
     ]
 )
 
diff --git a/docs/components_page/components/dropdown/size.R b/docs/components_page/components/dropdown/size.R
index 2ea4bbd47..79ece1bf9 100644
--- a/docs/components_page/components/dropdown/size.R
+++ b/docs/components_page/components/dropdown/size.R
@@ -13,10 +13,10 @@ dropdown <- htmlDiv(
       label = "large dropdown",
       size = "lg",
       children = items,
-      class_name = "mb-3"
+      className = "mb-3"
     ),
     dbcDropdownMenu(
-      label = "normal dropdown", children = items, class_name = "mb-3"
+      label = "normal dropdown", children = items, className = "mb-3"
     ),
     dbcDropdownMenu(
       label = "small dropdown", size = "sm",
diff --git a/docs/components_page/components/dropdown/size.jl b/docs/components_page/components/dropdown/size.jl
index 792ae17c1..5a91ed256 100644
--- a/docs/components_page/components/dropdown/size.jl
+++ b/docs/components_page/components/dropdown/size.jl
@@ -11,8 +11,8 @@ dropdown = html_div([
         label = "large dropdown",
         size = "lg",
         children = items,
-        class_name = "mb-3",
+        className = "mb-3",
     ),
-    dbc_dropdownmenu(label = "normal dropdown", children = items, class_name = "mb-3"),
+    dbc_dropdownmenu(label = "normal dropdown", children = items, className = "mb-3"),
     dbc_dropdownmenu(label = "small dropdown", size = "sm", children = items),
 ]);
diff --git a/docs/components_page/components/dropdown/size.py b/docs/components_page/components/dropdown/size.py
index 6182d0525..b1f91c3d3 100644
--- a/docs/components_page/components/dropdown/size.py
+++ b/docs/components_page/components/dropdown/size.py
@@ -13,10 +13,10 @@
             label="large dropdown",
             size="lg",
             children=items,
-            class_name="mb-3",
+            className="mb-3",
         ),
         dbc.DropdownMenu(
-            label="normal dropdown", children=items, class_name="mb-3"
+            label="normal dropdown", children=items, className="mb-3"
         ),
         dbc.DropdownMenu(label="small dropdown", size="sm", children=items),
     ]
diff --git a/docs/components_page/components/dropdown/style.R b/docs/components_page/components/dropdown/style.R
index e1190fc55..80d56bdd1 100644
--- a/docs/components_page/components/dropdown/style.R
+++ b/docs/components_page/components/dropdown/style.R
@@ -11,27 +11,27 @@ dropdowns <- htmlDiv(
   list(
     dbcDropdownMenu(
       items_style,
-      label = "Primary", color = "primary", class_name = "m-1"
+      label = "Primary", color = "primary", className = "m-1"
     ),
     dbcDropdownMenu(
       items_style,
-      label = "Secondary", color = "secondary", class_name = "m-1"
+      label = "Secondary", color = "secondary", className = "m-1"
     ),
     dbcDropdownMenu(
       items_style,
-      label = "Success", color = "success", class_name = "m-1"
+      label = "Success", color = "success", className = "m-1"
     ),
     dbcDropdownMenu(
       items_style,
-      label = "Warning", color = "warning", class_name = "m-1"
+      label = "Warning", color = "warning", className = "m-1"
     ),
     dbcDropdownMenu(
       items_style,
-      label = "Danger", color = "danger", class_name = "m-1"
+      label = "Danger", color = "danger", className = "m-1"
     ),
     dbcDropdownMenu(items_style,
       label = "Info", color = "info",
-      class_name = "m-1"
+      className = "m-1"
     )
   ),
   style = list(display = "flex", flexWrap = "wrap")
diff --git a/docs/components_page/components/dropdown/style.jl b/docs/components_page/components/dropdown/style.jl
index f78714ac3..73489b2c3 100644
--- a/docs/components_page/components/dropdown/style.jl
+++ b/docs/components_page/components/dropdown/style.jl
@@ -8,17 +8,17 @@ items = [
 
 dropdowns = html_div(
     [
-        dbc_dropdownmenu(items, label = "Primary", color = "primary", class_name = "m-1"),
+        dbc_dropdownmenu(items, label = "Primary", color = "primary", className = "m-1"),
         dbc_dropdownmenu(
             items,
             label = "Secondary",
             color = "secondary",
-            class_name = "m-1",
+            className = "m-1",
         ),
-        dbc_dropdownmenu(items, label = "Success", color = "success", class_name = "m-1"),
-        dbc_dropdownmenu(items, label = "Warning", color = "warning", class_name = "m-1"),
-        dbc_dropdownmenu(items, label = "Danger", color = "danger", class_name = "m-1"),
-        dbc_dropdownmenu(items, label = "Info", color = "info", class_name = "m-1"),
+        dbc_dropdownmenu(items, label = "Success", color = "success", className = "m-1"),
+        dbc_dropdownmenu(items, label = "Warning", color = "warning", className = "m-1"),
+        dbc_dropdownmenu(items, label = "Danger", color = "danger", className = "m-1"),
+        dbc_dropdownmenu(items, label = "Info", color = "info", className = "m-1"),
     ],
     style = Dict("display" => "flex", "flexWrap" => "wrap"),
 );
diff --git a/docs/components_page/components/dropdown/style.py b/docs/components_page/components/dropdown/style.py
index 6c8021db3..d5275cd1c 100644
--- a/docs/components_page/components/dropdown/style.py
+++ b/docs/components_page/components/dropdown/style.py
@@ -10,21 +10,21 @@
 dropdowns = html.Div(
     [
         dbc.DropdownMenu(
-            items, label="Primary", color="primary", class_name="m-1"
+            items, label="Primary", color="primary", className="m-1"
         ),
         dbc.DropdownMenu(
-            items, label="Secondary", color="secondary", class_name="m-1"
+            items, label="Secondary", color="secondary", className="m-1"
         ),
         dbc.DropdownMenu(
-            items, label="Success", color="success", class_name="m-1"
+            items, label="Success", color="success", className="m-1"
         ),
         dbc.DropdownMenu(
-            items, label="Warning", color="warning", class_name="m-1"
+            items, label="Warning", color="warning", className="m-1"
         ),
         dbc.DropdownMenu(
-            items, label="Danger", color="danger", class_name="m-1"
+            items, label="Danger", color="danger", className="m-1"
         ),
-        dbc.DropdownMenu(items, label="Info", color="info", class_name="m-1"),
+        dbc.DropdownMenu(items, label="Info", color="info", className="m-1"),
     ],
     style={"display": "flex", "flexWrap": "wrap"},
 )
diff --git a/docs/components_page/components/fade/fade.R b/docs/components_page/components/fade/fade.R
index 187113832..a6810fad9 100644
--- a/docs/components_page/components/fade/fade.R
+++ b/docs/components_page/components/fade/fade.R
@@ -5,14 +5,14 @@ fade <- htmlDiv(
   list(
     dbcButton("Toggle fade",
       id = "fade-button", n_clicks = 0,
-      class_name = "mb-3"
+      className = "mb-3"
     ),
     dbcFade(
       dbcCard(
         dbcCardBody(
           htmlP(
             "This content fades in and out",
-            class_name = "card-text"
+            className = "card-text"
           )
         )
       ),
diff --git a/docs/components_page/components/fade/fade.jl b/docs/components_page/components/fade/fade.jl
index 3946db713..d071521f8 100644
--- a/docs/components_page/components/fade/fade.jl
+++ b/docs/components_page/components/fade/fade.jl
@@ -1,10 +1,10 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 fade = html_div([
-    dbc_button("Toggle fade", id = "fade-button", class_name = "mb-3", n_clicks = 0),
+    dbc_button("Toggle fade", id = "fade-button", className = "mb-3", n_clicks = 0),
     dbc_fade(
         dbc_card(
-            dbc_cardbody(html_p("This content fades in and out", class_name = "card-text")),
+            dbc_cardbody(html_p("This content fades in and out", className = "card-text")),
         ),
         id = "fade",
         is_in = true,
diff --git a/docs/components_page/components/fade/fade.py b/docs/components_page/components/fade/fade.py
index a3d736e25..a4952edb2 100644
--- a/docs/components_page/components/fade/fade.py
+++ b/docs/components_page/components/fade/fade.py
@@ -4,13 +4,13 @@
 fade = html.Div(
     [
         dbc.Button(
-            "Toggle fade", id="fade-button", class_name="mb-3", n_clicks=0
+            "Toggle fade", id="fade-button", className="mb-3", n_clicks=0
         ),
         dbc.Fade(
             dbc.Card(
                 dbc.CardBody(
                     html.P(
-                        "This content fades in and out", class_name="card-text"
+                        "This content fades in and out", className="card-text"
                     )
                 )
             ),
diff --git a/docs/components_page/components/fade/transition.R b/docs/components_page/components/fade/transition.R
index e8296941d..7186a89be 100644
--- a/docs/components_page/components/fade/transition.R
+++ b/docs/components_page/components/fade/transition.R
@@ -5,14 +5,14 @@ fade <- htmlDiv(
   list(
     dbcButton("Toggle fade",
       id = "fade-transition-button", n_clicks = 0,
-      class_name = "mb-3"
+      className = "mb-3"
     ),
     dbcFade(
       dbcCard(
         dbcCardBody(
           htmlP(
             "This content fades in and out",
-            class_name = "card-text"
+            className = "card-text"
           )
         )
       ),
diff --git a/docs/components_page/components/fade/transition.jl b/docs/components_page/components/fade/transition.jl
index 320d8059b..127582ee6 100644
--- a/docs/components_page/components/fade/transition.jl
+++ b/docs/components_page/components/fade/transition.jl
@@ -4,12 +4,12 @@ fade = html_div([
     dbc_button(
         "Toggle fade",
         id = "fade-transition-button",
-        class_name = "mb-3",
+        className = "mb-3",
         n_clicks = 0,
     ),
     dbc_fade(
         dbc_card(
-            dbc_cardbody(html_p("This content fades in and out", class_name = "card-text")),
+            dbc_cardbody(html_p("This content fades in and out", className = "card-text")),
         ),
         id = "fade-transition",
         is_in = true,
diff --git a/docs/components_page/components/fade/transition.py b/docs/components_page/components/fade/transition.py
index 405f62ffd..482b64a69 100644
--- a/docs/components_page/components/fade/transition.py
+++ b/docs/components_page/components/fade/transition.py
@@ -6,14 +6,14 @@
         dbc.Button(
             "Toggle fade",
             id="fade-transition-button",
-            class_name="mb-3",
+            className="mb-3",
             n_clicks=0,
         ),
         dbc.Fade(
             dbc.Card(
                 dbc.CardBody(
                     html.P(
-                        "This content fades in and out", class_name="card-text"
+                        "This content fades in and out", className="card-text"
                     )
                 )
             ),
diff --git a/docs/components_page/components/form/dash_core.R b/docs/components_page/components/form/dash_core.R
index 2007a87ea..120a752c0 100644
--- a/docs/components_page/components/form/dash_core.R
+++ b/docs/components_page/components/form/dash_core.R
@@ -12,7 +12,7 @@ dropdown <- htmlDiv(
       )
     )
   ),
-  class_name = "mb-3",
+  className = "mb-3",
 )
 
 slider <- htmlDiv(
@@ -20,7 +20,7 @@ slider <- htmlDiv(
     dbcLabel("Slider", html_for = "slider"),
     dccSlider(id = "slider", min = 0, max = 10, step = 0.5, value = 3)
   ),
-  class_name = "mb-3"
+  className = "mb-3"
 )
 
 range_slider <- htmlDiv(
@@ -28,7 +28,7 @@ range_slider <- htmlDiv(
     dbcLabel("RangeSlider", html_for = "range-slider"),
     dccRangeSlider(id = "range-slider", min = 0, max = 10, value = list(3, 7))
   ),
-  class_name = "mb-3"
+  className = "mb-3"
 )
 
 form <- dbcForm(list(dropdown, slider, range_slider))
diff --git a/docs/components_page/components/form/dash_core.jl b/docs/components_page/components/form/dash_core.jl
index 65344a64b..6875f941c 100644
--- a/docs/components_page/components/form/dash_core.jl
+++ b/docs/components_page/components/form/dash_core.jl
@@ -11,7 +11,7 @@ dropdown = html_div(
             ],
         ),
     ],
-    class_name = "mb-3",
+    className = "mb-3",
 );
 
 slider = html_div(
@@ -19,7 +19,7 @@ slider = html_div(
         dbc_label("Slider", html_for = "slider"),
         dcc_slider(id = "slider", min = 0, max = 10, step = 0.5, value = 3),
     ],
-    class_name = "mb-3",
+    className = "mb-3",
 );
 
 range_slider = html_div(
@@ -27,7 +27,7 @@ range_slider = html_div(
         dbc_label("RangeSlider", html_for = "range-slider"),
         dcc_rangeslider(id = "range-slider", min = 0, max = 10, value = [3, 7]),
     ],
-    class_name = "mb-3",
+    className = "mb-3",
 );
 
 form = dbc_form([dropdown, slider, range_slider]);
diff --git a/docs/components_page/components/form/dash_core.py b/docs/components_page/components/form/dash_core.py
index 4887a0d76..904836557 100644
--- a/docs/components_page/components/form/dash_core.py
+++ b/docs/components_page/components/form/dash_core.py
@@ -12,7 +12,7 @@
             ],
         ),
     ],
-    class_name="mb-3",
+    className="mb-3",
 )
 
 slider = html.Div(
@@ -20,7 +20,7 @@
         dbc.Label("Slider", html_for="slider"),
         dcc.Slider(id="slider", min=0, max=10, step=0.5, value=3),
     ],
-    class_name="mb-3",
+    className="mb-3",
 )
 
 range_slider = html.Div(
@@ -28,7 +28,7 @@
         dbc.Label("RangeSlider", html_for="range-slider"),
         dcc.RangeSlider(id="range-slider", min=0, max=10, value=[3, 7]),
     ],
-    class_name="mb-3",
+    className="mb-3",
 )
 
 form = dbc.Form([dropdown, slider, range_slider])
diff --git a/docs/components_page/components/form/grid.R b/docs/components_page/components/form/grid.R
index d2b512ab3..e54ae38ae 100644
--- a/docs/components_page/components/form/grid.R
+++ b/docs/components_page/components/form/grid.R
@@ -25,5 +25,5 @@ form <- dbcRow(
       width = 6,
     )
   ),
-  class_name = "g-3",
+  className = "g-3",
 )
diff --git a/docs/components_page/components/form/grid.jl b/docs/components_page/components/form/grid.jl
index aa3484ed8..0ac3feb9f 100644
--- a/docs/components_page/components/form/grid.jl
+++ b/docs/components_page/components/form/grid.jl
@@ -25,5 +25,5 @@ form = dbc_row(
             width = 6,
         ),
     ],
-    class_name = "g-3",
+    className = "g-3",
 )
diff --git a/docs/components_page/components/form/grid.py b/docs/components_page/components/form/grid.py
index 3d49552e9..133d984d9 100644
--- a/docs/components_page/components/form/grid.py
+++ b/docs/components_page/components/form/grid.py
@@ -25,5 +25,5 @@
             width=6,
         ),
     ],
-    class_name="g-3",
+    className="g-3",
 )
diff --git a/docs/components_page/components/form/inline.R b/docs/components_page/components/form/inline.R
index 8ba2822b0..aa1da9360 100644
--- a/docs/components_page/components/form/inline.R
+++ b/docs/components_page/components/form/inline.R
@@ -6,15 +6,15 @@ form <- dbcForm(
       dbcLabel("Email", width = "auto"),
       dbcCol(
         dbcInput(type = "email", placeholder = "Enter email"),
-        class_name = "me-3",
+        className = "me-3",
       ),
       dbcLabel("Password", width = "auto"),
       dbcCol(
         dbcInput(type = "password", placeholder = "Enter password"),
-        class_name = "me-3",
+        className = "me-3",
       ),
       dbcCol(dbcButton("Submit", color = "primary"), width = "auto")
     ),
-    class_name = "g-2",
+    className = "g-2",
   )
 )
diff --git a/docs/components_page/components/form/inline.jl b/docs/components_page/components/form/inline.jl
index c7a739f01..cf5950a80 100644
--- a/docs/components_page/components/form/inline.jl
+++ b/docs/components_page/components/form/inline.jl
@@ -6,15 +6,15 @@ form = dbc_form(
             dbc_label("Email", width = "auto"),
             dbc_col(
                 dbc_input(type = "email", placeholder = "Enter email"),
-                class_name = "me-3",
+                className = "me-3",
             ),
             dbc_label("Password", width = "auto"),
             dbc_col(
                 dbc_input(type = "password", placeholder = "Enter password"),
-                class_name = "me-3",
+                className = "me-3",
             ),
             dbc_col(dbc_button("Submit", color = "primary"), width = "auto"),
         ],
-        class_name = "g-2",
+        className = "g-2",
     ),
 )
diff --git a/docs/components_page/components/form/inline.py b/docs/components_page/components/form/inline.py
index 60690c164..cd07c5db3 100644
--- a/docs/components_page/components/form/inline.py
+++ b/docs/components_page/components/form/inline.py
@@ -6,15 +6,15 @@
             dbc.Label("Email", width="auto"),
             dbc.Col(
                 dbc.Input(type="email", placeholder="Enter email"),
-                class_name="me-3",
+                className="me-3",
             ),
             dbc.Label("Password", width="auto"),
             dbc.Col(
                 dbc.Input(type="password", placeholder="Enter password"),
-                class_name="me-3",
+                className="me-3",
             ),
             dbc.Col(dbc.Button("Submit", color="primary"), width="auto"),
         ],
-        class_name="g-2",
+        className="g-2",
     )
 )
diff --git a/docs/components_page/components/form/row.R b/docs/components_page/components/form/row.R
index acb0b1fa6..f5fb22460 100644
--- a/docs/components_page/components/form/row.R
+++ b/docs/components_page/components/form/row.R
@@ -10,7 +10,7 @@ email_input <- dbcRow(
       width = 10
     )
   ),
-  class_name = "mb-3",
+  className = "mb-3",
 )
 
 password_input <- dbcRow(
@@ -25,7 +25,7 @@ password_input <- dbcRow(
       width = 10
     )
   ),
-  class_name = "mb-3",
+  className = "mb-3",
 )
 
 radios_input <- dbcRow(
@@ -47,7 +47,7 @@ radios_input <- dbcRow(
       width = 10
     )
   ),
-  class_name = "mb-3",
+  className = "mb-3",
 )
 
 form <- dbcForm(list(email_input, password_input, radios_input))
diff --git a/docs/components_page/components/form/row.jl b/docs/components_page/components/form/row.jl
index 40bbc419c..519a42c98 100644
--- a/docs/components_page/components/form/row.jl
+++ b/docs/components_page/components/form/row.jl
@@ -12,7 +12,7 @@ email_input = dbc_row(
             width = 10,
         ),
     ],
-    class_name = "mb-3",
+    className = "mb-3",
 );
 
 password_input = dbc_row(
@@ -27,7 +27,7 @@ password_input = dbc_row(
             width = 10,
         ),
     ],
-    class_name = "mb-3",
+    className = "mb-3",
 );
 
 radios_input = dbc_row(
@@ -49,7 +49,7 @@ radios_input = dbc_row(
             width = 10,
         ),
     ],
-    class_name = "mb-3",
+    className = "mb-3",
 );
 
 form = dbc_form([email_input, password_input, radios_input]);
diff --git a/docs/components_page/components/form/row.py b/docs/components_page/components/form/row.py
index 0e205ced2..fa0556114 100644
--- a/docs/components_page/components/form/row.py
+++ b/docs/components_page/components/form/row.py
@@ -10,7 +10,7 @@
             width=10,
         ),
     ],
-    class_name="mb-3",
+    className="mb-3",
 )
 
 password_input = dbc.Row(
@@ -25,7 +25,7 @@
             width=10,
         ),
     ],
-    class_name="mb-3",
+    className="mb-3",
 )
 
 radios_input = dbc.Row(
@@ -47,7 +47,7 @@
             width=10,
         ),
     ],
-    class_name="mb-3",
+    className="mb-3",
 )
 
 form = dbc.Form([email_input, password_input, radios_input])
diff --git a/docs/components_page/components/form/simple.R b/docs/components_page/components/form/simple.R
index 52ca557f0..2df049fe7 100644
--- a/docs/components_page/components/form/simple.R
+++ b/docs/components_page/components/form/simple.R
@@ -9,7 +9,7 @@ email_input_simple <- htmlDiv(
       color = "secondary",
     )
   ),
-  class_name = "mb-3"
+  className = "mb-3"
 )
 
 password_input_simple <- htmlDiv(
@@ -25,7 +25,7 @@ password_input_simple <- htmlDiv(
       color = "secondary"
     )
   ),
-  class_name = "mb-3"
+  className = "mb-3"
 )
 
 form <- dbcForm(list(email_input_simple, password_input_simple))
diff --git a/docs/components_page/components/form/simple.jl b/docs/components_page/components/form/simple.jl
index 340472203..60f596fa5 100644
--- a/docs/components_page/components/form/simple.jl
+++ b/docs/components_page/components/form/simple.jl
@@ -9,7 +9,7 @@ email_input = html_div(
             color = "secondary",
         ),
     ],
-    class_name = "mb-3",
+    className = "mb-3",
 );
 
 password_input = html_div(
@@ -22,7 +22,7 @@ password_input = html_div(
         ),
         dbc_formtext("A password stops mean people taking your stuff", color = "secondary"),
     ],
-    class_name = "mb-3",
+    className = "mb-3",
 );
 
 form = dbc_form([email_input, password_input]);
diff --git a/docs/components_page/components/form/simple.py b/docs/components_page/components/form/simple.py
index 461c4a053..ce5c62288 100644
--- a/docs/components_page/components/form/simple.py
+++ b/docs/components_page/components/form/simple.py
@@ -10,7 +10,7 @@
             color="secondary",
         ),
     ],
-    class_name="mb-3",
+    className="mb-3",
 )
 
 password_input = html.Div(
@@ -25,7 +25,7 @@
             "A password stops mean people taking your stuff", color="secondary"
         ),
     ],
-    class_name="mb-3",
+    className="mb-3",
 )
 
 form = dbc.Form([email_input, password_input])
diff --git a/docs/components_page/components/input.md b/docs/components_page/components/input.md
index b0cabe7b0..85c9ec15d 100644
--- a/docs/components_page/components/input.md
+++ b/docs/components_page/components/input.md
@@ -71,7 +71,7 @@ Set `inline=True` to make the radio items or checklists fit next to each other o
 
 ## Checked item styles
 
-Use the `input_checked_style`, `input_checked_class_name`, `label_checked_style` and `label_checked_class_name` arguments to apply different styles to the labels of checked items.
+Use the `input_checked_style`, `inputCheckedClassName`, `label_checked_style` and `labelCheckedClassName` arguments to apply different styles to the labels of checked items.
 
 {{example:components/input/selected_styles.py:checklist}}
 
diff --git a/docs/components_page/components/input/radio_check_standalone.R b/docs/components_page/components/input/radio_check_standalone.R
index 9ca133474..ffe660b5c 100644
--- a/docs/components_page/components/input/radio_check_standalone.R
+++ b/docs/components_page/components/input/radio_check_standalone.R
@@ -12,7 +12,7 @@ standalone_radio_check <- htmlDiv(
           check = TRUE
         )
       ),
-      class_name = "form-check"
+      className = "form-check"
     ),
     htmlDiv(
       list(
@@ -23,7 +23,7 @@ standalone_radio_check <- htmlDiv(
           check = TRUE
         )
       ),
-      class_name = "form-check"
+      className = "form-check"
     ),
     htmlP(id = "standalone-radio-check-output")
   )
diff --git a/docs/components_page/components/input/radio_check_standalone.jl b/docs/components_page/components/input/radio_check_standalone.jl
index 3a879f69e..02689ef3f 100644
--- a/docs/components_page/components/input/radio_check_standalone.jl
+++ b/docs/components_page/components/input/radio_check_standalone.jl
@@ -6,7 +6,7 @@ standalone_radio_check = html_div([
             dbc_checkbox(id = "standalone-checkbox"),
             dbc_label("This is a checkbox", html_for = "standalone-checkbox", check = true),
         ],
-        class_name = "form-check",
+        className = "form-check",
     ),
     html_div(
         [
@@ -17,7 +17,7 @@ standalone_radio_check = html_div([
                 check = true,
             ),
         ],
-        class_name = "form-check",
+        className = "form-check",
     ),
     html_p(id = "standalone-radio-check-output"),
 ]);
diff --git a/docs/components_page/components/input/radio_check_standalone.py b/docs/components_page/components/input/radio_check_standalone.py
index 79856d06d..dd5967696 100644
--- a/docs/components_page/components/input/radio_check_standalone.py
+++ b/docs/components_page/components/input/radio_check_standalone.py
@@ -12,7 +12,7 @@
                     check=True,
                 ),
             ],
-            class_name="form-check",
+            className="form-check",
         ),
         html.Div(
             [
@@ -23,7 +23,7 @@
                     check=True,
                 ),
             ],
-            class_name="form-check",
+            className="form-check",
         ),
         html.P(id="standalone-radio-check-output"),
     ]
diff --git a/docs/components_page/components/input/selected_styles.R b/docs/components_page/components/input/selected_styles.R
index 82d20a8e6..b94f87245 100644
--- a/docs/components_page/components/input/selected_styles.R
+++ b/docs/components_page/components/input/selected_styles.R
@@ -24,8 +24,8 @@ checklist <- htmlDiv(
         list(label = "Option 2", value = 2),
         list(label = "Option 3", value = 3)
       ),
-      label_checked_class_name = "text-success",
-      input_checked_class_name = "border border-success bg-success"
+      labelCheckedClassName = "text-success",
+      inputCheckedClassName = "border border-success bg-success"
     )
   )
 )
diff --git a/docs/components_page/components/input/selected_styles.jl b/docs/components_page/components/input/selected_styles.jl
index 33d2914a2..ead29b15e 100644
--- a/docs/components_page/components/input/selected_styles.jl
+++ b/docs/components_page/components/input/selected_styles.jl
@@ -23,7 +23,7 @@ checklist = html_div([
             Dict("label" => "Option 2", "value" => 2),
             Dict("label" => "Option 3", "value" => 3),
         ],
-        label_checked_class_name = "text-success",
-        input_checked_class_name = "border border-success bg-success",
+        labelCheckedClassName = "text-success",
+        inputCheckedClassName = "border border-success bg-success",
     ),
 ]);
diff --git a/docs/components_page/components/input/selected_styles.py b/docs/components_page/components/input/selected_styles.py
index cd50acada..70902fd8a 100644
--- a/docs/components_page/components/input/selected_styles.py
+++ b/docs/components_page/components/input/selected_styles.py
@@ -24,8 +24,8 @@
                 {"label": "Option 2", "value": 2},
                 {"label": "Option 3", "value": 3},
             ],
-            label_checked_class_name="text-success",
-            input_checked_class_name="border border-success bg-success",
+            labelCheckedClassName="text-success",
+            inputCheckedClassName="border border-success bg-success",
         ),
     ]
 )
diff --git a/docs/components_page/components/input/size.R b/docs/components_page/components/input/size.R
index 9ed5f5ae0..a86bb920d 100644
--- a/docs/components_page/components/input/size.R
+++ b/docs/components_page/components/input/size.R
@@ -4,10 +4,10 @@ library(dashHtmlComponents)
 inputs <- htmlDiv(
   list(
     dbcInput(
-      placeholder = "A large input...", size = "lg", class_name = "mb-3"
+      placeholder = "A large input...", size = "lg", className = "mb-3"
     ),
     dbcInput(
-      placeholder = "A medium input...", size = "md", class_name = "mb-3"
+      placeholder = "A medium input...", size = "md", className = "mb-3"
     ),
     dbcInput(placeholder = "A small input...", size = "sm")
   )
diff --git a/docs/components_page/components/input/size.jl b/docs/components_page/components/input/size.jl
index 144bc1cc1..42f3466c1 100644
--- a/docs/components_page/components/input/size.jl
+++ b/docs/components_page/components/input/size.jl
@@ -1,7 +1,7 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 inputs = html_div([
-    dbc_input(placeholder = "A large input...", size = "lg", class_name = "mb-3"),
-    dbc_input(placeholder = "A medium input...", size = "md", class_name = "mb-3"),
+    dbc_input(placeholder = "A large input...", size = "lg", className = "mb-3"),
+    dbc_input(placeholder = "A medium input...", size = "md", className = "mb-3"),
     dbc_input(placeholder = "A small input...", size = "sm"),
 ]);
diff --git a/docs/components_page/components/input/size.py b/docs/components_page/components/input/size.py
index 5be2c4adb..c43e28968 100644
--- a/docs/components_page/components/input/size.py
+++ b/docs/components_page/components/input/size.py
@@ -3,11 +3,9 @@
 
 inputs = html.Div(
     [
+        dbc.Input(placeholder="A large input...", size="lg", className="mb-3"),
         dbc.Input(
-            placeholder="A large input...", size="lg", class_name="mb-3"
-        ),
-        dbc.Input(
-            placeholder="A medium input...", size="md", class_name="mb-3"
+            placeholder="A medium input...", size="md", className="mb-3"
         ),
         dbc.Input(placeholder="A small input...", size="sm"),
     ]
diff --git a/docs/components_page/components/input/textarea.R b/docs/components_page/components/input/textarea.R
index 9610a7c42..cf796d04f 100644
--- a/docs/components_page/components/input/textarea.R
+++ b/docs/components_page/components/input/textarea.R
@@ -2,11 +2,11 @@ library(dashBootstrapComponents)
 
 textareas <- htmlDiv(
   list(
-    dbcTextarea(class_name = "mb-3", placeholder = "A Textarea"),
+    dbcTextarea(className = "mb-3", placeholder = "A Textarea"),
     dbcTextarea(
       valid = TRUE,
       size = "sm",
-      class_name = "mb-3",
+      className = "mb-3",
       placeholder = "A small, valid Textarea",
     ),
     dbcTextarea(
diff --git a/docs/components_page/components/input/textarea.jl b/docs/components_page/components/input/textarea.jl
index 27b43f9b7..be118769b 100644
--- a/docs/components_page/components/input/textarea.jl
+++ b/docs/components_page/components/input/textarea.jl
@@ -1,11 +1,11 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 textareas = html_div([
-    dbc_textarea(class_name = "mb-3", placeholder = "A Textarea"),
+    dbc_textarea(className = "mb-3", placeholder = "A Textarea"),
     dbc_textarea(
         valid = true,
         size = "sm",
-        class_name = "mb-3",
+        className = "mb-3",
         placeholder = "A small, valid Textarea",
     ),
     dbc_textarea(invalid = true, size = "lg", placeholder = "A large, invalid Textarea"),
diff --git a/docs/components_page/components/input/textarea.py b/docs/components_page/components/input/textarea.py
index 3ef0afe88..f08b18801 100644
--- a/docs/components_page/components/input/textarea.py
+++ b/docs/components_page/components/input/textarea.py
@@ -3,11 +3,11 @@
 
 textareas = html.Div(
     [
-        dbc.Textarea(class_name="mb-3", placeholder="A Textarea"),
+        dbc.Textarea(className="mb-3", placeholder="A Textarea"),
         dbc.Textarea(
             valid=True,
             size="sm",
-            class_name="mb-3",
+            className="mb-3",
             placeholder="A small, valid Textarea",
         ),
         dbc.Textarea(
diff --git a/docs/components_page/components/input/validation.R b/docs/components_page/components/input/validation.R
index f86e97fd6..0e4426db8 100644
--- a/docs/components_page/components/input/validation.R
+++ b/docs/components_page/components/input/validation.R
@@ -3,7 +3,7 @@ library(dashHtmlComponents)
 
 inputs <- htmlDiv(
   list(
-    dbcInput(placeholder = "Valid input...", valid = TRUE, class_name = "mb-3"),
+    dbcInput(placeholder = "Valid input...", valid = TRUE, className = "mb-3"),
     dbcInput(placeholder = "Invalid input...", invalid = TRUE)
   )
 )
diff --git a/docs/components_page/components/input/validation.jl b/docs/components_page/components/input/validation.jl
index 9bb4c8d19..21aceb508 100644
--- a/docs/components_page/components/input/validation.jl
+++ b/docs/components_page/components/input/validation.jl
@@ -1,6 +1,6 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 inputs = html_div([
-    dbc_input(placeholder = "Valid input...", valid = true, class_name = "mb-3"),
+    dbc_input(placeholder = "Valid input...", valid = true, className = "mb-3"),
     dbc_input(placeholder = "Invalid input...", invalid = true),
 ]);
diff --git a/docs/components_page/components/input/validation.py b/docs/components_page/components/input/validation.py
index de9af8b74..535d162df 100644
--- a/docs/components_page/components/input/validation.py
+++ b/docs/components_page/components/input/validation.py
@@ -3,7 +3,7 @@
 
 inputs = html.Div(
     [
-        dbc.Input(placeholder="Valid input...", valid=True, class_name="mb-3"),
+        dbc.Input(placeholder="Valid input...", valid=True, className="mb-3"),
         dbc.Input(placeholder="Invalid input...", invalid=True),
     ]
 )
diff --git a/docs/components_page/components/input_group/check_radio.R b/docs/components_page/components/input_group/check_radio.R
index 217828532..a75d907c1 100644
--- a/docs/components_page/components/input_group/check_radio.R
+++ b/docs/components_page/components/input_group/check_radio.R
@@ -8,7 +8,7 @@ input_groups <- htmlDiv(
         dbcInputGroupText(dbcRadioButton()),
         dbcInput()
       ),
-      class_name = "mb-3",
+      className = "mb-3",
     ),
     dbcInputGroup(
       list(
diff --git a/docs/components_page/components/input_group/check_radio.jl b/docs/components_page/components/input_group/check_radio.jl
index 53b89dd40..3d82fffcb 100644
--- a/docs/components_page/components/input_group/check_radio.jl
+++ b/docs/components_page/components/input_group/check_radio.jl
@@ -3,7 +3,7 @@ using DashBootstrapComponents, DashHtmlComponents
 input_groups = html_div([
     dbc_inputgroup(
         [dbc_inputgrouptext(dbc_radiobutton()), dbc_input()],
-        class_name = "mb-3",
+        className = "mb-3",
     ),
     dbc_inputgroup([dbc_inputgrouptext(dbc_checkbox()), dbc_input()]),
 ]);
diff --git a/docs/components_page/components/input_group/check_radio.py b/docs/components_page/components/input_group/check_radio.py
index 3814becaa..45119bf86 100644
--- a/docs/components_page/components/input_group/check_radio.py
+++ b/docs/components_page/components/input_group/check_radio.py
@@ -5,7 +5,7 @@
     [
         dbc.InputGroup(
             [dbc.InputGroupText(dbc.RadioButton()), dbc.Input()],
-            class_name="mb-3",
+            className="mb-3",
         ),
         dbc.InputGroup([dbc.InputGroupText(dbc.Checkbox()), dbc.Input()]),
     ]
diff --git a/docs/components_page/components/input_group/simple.R b/docs/components_page/components/input_group/simple.R
index 5d98e478e..1316ac2f1 100644
--- a/docs/components_page/components/input_group/simple.R
+++ b/docs/components_page/components/input_group/simple.R
@@ -7,14 +7,14 @@ input_groups <- htmlDiv(
         dbcInputGroupText("@"),
         dbcInput(placeholder = "Username")
       ),
-      class_name = "mb-3"
+      className = "mb-3"
     ),
     dbcInputGroup(
       list(
         dbcInput(placeholder = "Recipient's username"),
         dbcInputGroupText("@example.com")
       ),
-      class_name = "mb-3"
+      className = "mb-3"
     ),
     dbcInputGroup(
       list(
@@ -22,7 +22,7 @@ input_groups <- htmlDiv(
         dbcInput(placeholder = "Amount", type = "number"),
         dbcInputGroupText(".00")
       ),
-      class_name = "mb-3"
+      className = "mb-3"
     ),
     dbcInputGroup(
       list(
@@ -32,14 +32,14 @@ input_groups <- htmlDiv(
         dbcInputGroupText(".00"),
         dbcInputGroupText("only")
       ),
-      class_name = "mb-3"
+      className = "mb-3"
     ),
     dbcInputGroup(
       list(
         dbcInputGroupText("With textarea"),
         dbcTextarea()
       ),
-      class_name = "mb-3"
+      className = "mb-3"
     ),
     dbcInputGroup(
       list(
diff --git a/docs/components_page/components/input_group/simple.jl b/docs/components_page/components/input_group/simple.jl
index d108c8d24..f5705188d 100644
--- a/docs/components_page/components/input_group/simple.jl
+++ b/docs/components_page/components/input_group/simple.jl
@@ -3,14 +3,14 @@ using DashBootstrapComponents, DashHtmlComponents
 input_groups = html_div([
     dbc_inputgroup(
         [dbc_inputgrouptext("@"), dbc_input(placeholder = "Username")],
-        class_name = "mb-3",
+        className = "mb-3",
     ),
     dbc_inputgroup(
         [
             dbc_input(placeholder = "Recipient's username"),
             dbc_inputgrouptext("@example.com"),
         ],
-        class_name = "mb-3",
+        className = "mb-3",
     ),
     dbc_inputgroup(
         [
@@ -18,7 +18,7 @@ input_groups = html_div([
             dbc_input(placeholder = "Amount", type = "number"),
             dbc_inputgrouptext(".00"),
         ],
-        class_name = "mb-3",
+        className = "mb-3",
     ),
     dbc_inputgroup(
         [
@@ -28,11 +28,11 @@ input_groups = html_div([
             dbc_inputgrouptext(".00"),
             dbc_inputgrouptext("only"),
         ],
-        class_name = "mb-3",
+        className = "mb-3",
     ),
     dbc_inputgroup(
         [dbc_inputgrouptext("With textarea"), dbc_textarea()],
-        class_name = "mb-3",
+        className = "mb-3",
     ),
     dbc_inputgroup([
         dbc_select(
diff --git a/docs/components_page/components/input_group/simple.py b/docs/components_page/components/input_group/simple.py
index 7e018cd40..f0ed54640 100644
--- a/docs/components_page/components/input_group/simple.py
+++ b/docs/components_page/components/input_group/simple.py
@@ -5,14 +5,14 @@
     [
         dbc.InputGroup(
             [dbc.InputGroupText("@"), dbc.Input(placeholder="Username")],
-            class_name="mb-3",
+            className="mb-3",
         ),
         dbc.InputGroup(
             [
                 dbc.Input(placeholder="Recipient's username"),
                 dbc.InputGroupText("@example.com"),
             ],
-            class_name="mb-3",
+            className="mb-3",
         ),
         dbc.InputGroup(
             [
@@ -20,7 +20,7 @@
                 dbc.Input(placeholder="Amount", type="number"),
                 dbc.InputGroupText(".00"),
             ],
-            class_name="mb-3",
+            className="mb-3",
         ),
         dbc.InputGroup(
             [
@@ -30,14 +30,14 @@
                 dbc.InputGroupText(".00"),
                 dbc.InputGroupText("only"),
             ],
-            class_name="mb-3",
+            className="mb-3",
         ),
         dbc.InputGroup(
             [
                 dbc.InputGroupText("With textarea"),
                 dbc.Textarea(),
             ],
-            class_name="mb-3",
+            className="mb-3",
         ),
         dbc.InputGroup(
             [
diff --git a/docs/components_page/components/jumbotron/custom.R b/docs/components_page/components/jumbotron/custom.R
index 17a333f43..c41dceb12 100644
--- a/docs/components_page/components/jumbotron/custom.R
+++ b/docs/components_page/components/jumbotron/custom.R
@@ -4,8 +4,8 @@ library(dashHtmlComponents)
 left_jumbotron <- dbcCol(
   htmlDiv(
     list(
-      htmlH2("Change the background", class_name = "display-3"),
-      htmlHr(class_name = "my-2"),
+      htmlH2("Change the background", className = "display-3"),
+      htmlHr(className = "my-2"),
       htmlP(
         paste(
           "Swap the background-color utility and add a `.text-*` color",
@@ -14,7 +14,7 @@ left_jumbotron <- dbcCol(
       ),
       dbcButton("Example Button", color = "light", outline = TRUE)
     ),
-    class_name = "h-100 p-5 text-white bg-dark rounded-3"
+    className = "h-100 p-5 text-white bg-dark rounded-3"
   ),
   md = 6
 )
@@ -22,8 +22,8 @@ left_jumbotron <- dbcCol(
 right_jumbotron <- dbcCol(
   htmlDiv(
     list(
-      htmlH2("Add borders", class_name = "display-3"),
-      htmlHr(class_name = "my-2"),
+      htmlH2("Add borders", className = "display-3"),
+      htmlHr(className = "my-2"),
       htmlP(
         paste(
           "Or, keep it light and add a border for some added definition",
@@ -32,12 +32,12 @@ right_jumbotron <- dbcCol(
       ),
       dbcButton("Example Button", color = "secondary", outline = TRUE)
     ),
-    class_name = "h-100 p-5 bg-light border rounded-3"
+    className = "h-100 p-5 bg-light border rounded-3"
   ),
   md = 6
 )
 
 jumbotron <- dbcRow(
   list(left_jumbotron, right_jumbotron),
-  class_name = "align-items-md-stretch"
+  className = "align-items-md-stretch"
 )
diff --git a/docs/components_page/components/jumbotron/custom.jl b/docs/components_page/components/jumbotron/custom.jl
index 26a88a541..e4ce2039d 100644
--- a/docs/components_page/components/jumbotron/custom.jl
+++ b/docs/components_page/components/jumbotron/custom.jl
@@ -3,15 +3,15 @@ using DashBootstrapComponents, DashHtmlComponents
 left_jumbotron = dbc_col(
     html_div(
         [
-            html_h2("Change the background", class_name = "display-3"),
-            html_hr(class_name = "my-2"),
+            html_h2("Change the background", className = "display-3"),
+            html_hr(className = "my-2"),
             html_p(
                 "Swap the background-color utility and add a `.text-*` color " *
                 "utility to mix up the look.",
             ),
             dbc_button("Example Button", color = "light", outline = true),
         ],
-        class_name = "h-100 p-5 text-white bg-dark rounded-3",
+        className = "h-100 p-5 text-white bg-dark rounded-3",
     ),
     md = 6,
 )
@@ -19,18 +19,17 @@ left_jumbotron = dbc_col(
 right_jumbotron = dbc_col(
     html_div(
         [
-            html_h2("Add borders", class_name = "display-3"),
-            html_hr(class_name = "my-2"),
+            html_h2("Add borders", className = "display-3"),
+            html_hr(className = "my-2"),
             html_p(
                 "Or, keep it light and add a border for some added definition " *
                 "to the boundaries of your content.",
             ),
             dbc_button("Example Button", color = "secondary", outline = true),
         ],
-        class_name = "h-100 p-5 bg-light border rounded-3",
+        className = "h-100 p-5 bg-light border rounded-3",
     ),
     md = 6,
 )
 
-jumbotron =
-    dbc_row([left_jumbotron, right_jumbotron], class_name = "align-items-md-stretch")
+jumbotron = dbc_row([left_jumbotron, right_jumbotron], className = "align-items-md-stretch")
diff --git a/docs/components_page/components/jumbotron/custom.py b/docs/components_page/components/jumbotron/custom.py
index 1a8325129..3bcdf0063 100644
--- a/docs/components_page/components/jumbotron/custom.py
+++ b/docs/components_page/components/jumbotron/custom.py
@@ -4,15 +4,15 @@
 left_jumbotron = dbc.Col(
     html.Div(
         [
-            html.H2("Change the background", class_name="display-3"),
-            html.Hr(class_name="my-2"),
+            html.H2("Change the background", className="display-3"),
+            html.Hr(className="my-2"),
             html.P(
                 "Swap the background-color utility and add a `.text-*` color "
                 "utility to mix up the look."
             ),
             dbc.Button("Example Button", color="light", outline=True),
         ],
-        class_name="h-100 p-5 text-white bg-dark rounded-3",
+        className="h-100 p-5 text-white bg-dark rounded-3",
     ),
     md=6,
 )
@@ -20,20 +20,20 @@
 right_jumbotron = dbc.Col(
     html.Div(
         [
-            html.H2("Add borders", class_name="display-3"),
-            html.Hr(class_name="my-2"),
+            html.H2("Add borders", className="display-3"),
+            html.Hr(className="my-2"),
             html.P(
                 "Or, keep it light and add a border for some added definition "
                 "to the boundaries of your content."
             ),
             dbc.Button("Example Button", color="secondary", outline=True),
         ],
-        class_name="h-100 p-5 bg-light border rounded-3",
+        className="h-100 p-5 bg-light border rounded-3",
     ),
     md=6,
 )
 
 jumbotron = dbc.Row(
     [left_jumbotron, right_jumbotron],
-    class_name="align-items-md-stretch",
+    className="align-items-md-stretch",
 )
diff --git a/docs/components_page/components/jumbotron/simple.R b/docs/components_page/components/jumbotron/simple.R
index abc612211..8bad3f21f 100644
--- a/docs/components_page/components/jumbotron/simple.R
+++ b/docs/components_page/components/jumbotron/simple.R
@@ -4,15 +4,15 @@ library(dashHtmlComponents)
 jumbotron <- htmlDiv(
   dbcContainer(
     list(
-      htmlH1("Jumbotron", class_name = "display-3"),
+      htmlH1("Jumbotron", className = "display-3"),
       htmlP(
         paste(
           "Use Containers to create a jumbotron to call attention to",
           "featured content or information."
         ),
-        class_name = "lead"
+        className = "lead"
       ),
-      htmlHr(class_name = "my-2"),
+      htmlHr(className = "my-2"),
       htmlP(
         paste(
           "Use utility classes for typography and spacing to suit the",
@@ -21,11 +21,11 @@ jumbotron <- htmlDiv(
       ),
       htmlP(
         dbcButton("Learn more", color = "primary"),
-        class_name = "lead"
+        className = "lead"
       )
     ),
     fluid = TRUE,
-    class_name = "py-3"
+    className = "py-3"
   ),
-  class_name = "p-3 bg-light rounded-3"
+  className = "p-3 bg-light rounded-3"
 )
diff --git a/docs/components_page/components/jumbotron/simple.jl b/docs/components_page/components/jumbotron/simple.jl
index a07f69904..bc83699ed 100644
--- a/docs/components_page/components/jumbotron/simple.jl
+++ b/docs/components_page/components/jumbotron/simple.jl
@@ -3,21 +3,21 @@ using DashBootstrapComponents, DashHtmlComponents
 jumbotron = html_div(
     dbc_container(
         [
-            html_h1("Jumbotron", class_name = "display-3"),
+            html_h1("Jumbotron", className = "display-3"),
             html_p(
                 "Use Containers to create a jumbotron to call attention to " *
                 "featured content or information.",
-                class_name = "lead",
+                className = "lead",
             ),
-            html_hr(class_name = "my-2"),
+            html_hr(className = "my-2"),
             html_p(
                 "Use utility classes for typography and spacing to suit the " *
                 "larger container.",
             ),
-            html_p(dbc_button("Learn more", color = "primary"), class_name = "lead"),
+            html_p(dbc_button("Learn more", color = "primary"), className = "lead"),
         ],
         fluid = true,
-        class_name = "py-3",
+        className = "py-3",
     ),
-    class_name = "p-3 bg-light rounded-3",
+    className = "p-3 bg-light rounded-3",
 )
diff --git a/docs/components_page/components/jumbotron/simple.py b/docs/components_page/components/jumbotron/simple.py
index 7d72dc309..4dcf9e4be 100644
--- a/docs/components_page/components/jumbotron/simple.py
+++ b/docs/components_page/components/jumbotron/simple.py
@@ -4,23 +4,23 @@
 jumbotron = html.Div(
     dbc.Container(
         [
-            html.H1("Jumbotron", class_name="display-3"),
+            html.H1("Jumbotron", className="display-3"),
             html.P(
                 "Use Containers to create a jumbotron to call attention to "
                 "featured content or information.",
-                class_name="lead",
+                className="lead",
             ),
-            html.Hr(class_name="my-2"),
+            html.Hr(className="my-2"),
             html.P(
                 "Use utility classes for typography and spacing to suit the "
                 "larger container."
             ),
             html.P(
-                dbc.Button("Learn more", color="primary"), class_name="lead"
+                dbc.Button("Learn more", color="primary"), className="lead"
             ),
         ],
         fluid=True,
-        class_name="py-3",
+        className="py-3",
     ),
-    class_name="p-3 bg-light rounded-3",
+    className="p-3 bg-light rounded-3",
 )
diff --git a/docs/components_page/components/layout/no_gutters.R b/docs/components_page/components/layout/no_gutters.R
index d982e42d4..c46fe4c3a 100644
--- a/docs/components_page/components/layout/no_gutters.R
+++ b/docs/components_page/components/layout/no_gutters.R
@@ -7,5 +7,5 @@ row <- dbcRow(
     dbcCol(htmlDiv("One of three columns")),
     dbcCol(htmlDiv("One of three columns"))
   ),
-  class_name = "g-0"
+  className = "g-0"
 )
diff --git a/docs/components_page/components/layout/no_gutters.jl b/docs/components_page/components/layout/no_gutters.jl
index 752dc02d4..b55b8ec3e 100644
--- a/docs/components_page/components/layout/no_gutters.jl
+++ b/docs/components_page/components/layout/no_gutters.jl
@@ -6,5 +6,5 @@ row = dbc_row(
         dbc_col(html_div("One of three columns")),
         dbc_col(html_div("One of three columns")),
     ],
-    class_name = "g-0",
+    className = "g-0",
 );
diff --git a/docs/components_page/components/layout/no_gutters.py b/docs/components_page/components/layout/no_gutters.py
index e13edefed..c113e7f33 100644
--- a/docs/components_page/components/layout/no_gutters.py
+++ b/docs/components_page/components/layout/no_gutters.py
@@ -7,5 +7,5 @@
         dbc.Col(html.Div("One of three columns")),
         dbc.Col(html.Div("One of three columns")),
     ],
-    class_name="g-0",
+    className="g-0",
 )
diff --git a/docs/components_page/components/list_group/content.R b/docs/components_page/components/list_group/content.R
index 4cf2de266..ace1bb52b 100644
--- a/docs/components_page/components/list_group/content.R
+++ b/docs/components_page/components/list_group/content.R
@@ -6,13 +6,13 @@ list_group <- dbcListGroup(
       list(
         htmlDiv(
           list(
-            htmlH5("This item has a heading", class_name = "mb-1"),
-            htmlSmall("Yay!", class_name = "text-success")
+            htmlH5("This item has a heading", className = "mb-1"),
+            htmlSmall("Yay!", className = "text-success")
           ),
-          class_name = "d-flex w-100 justify-content-between"
+          className = "d-flex w-100 justify-content-between"
         ),
-        htmlP("And some text underneath", class_name = "mb-1"),
-        htmlSmall("Plus some small print.", class_name = "text-muted")
+        htmlP("And some text underneath", className = "mb-1"),
+        htmlSmall("Plus some small print.", className = "text-muted")
       )
     ),
     dbcListGroupItem(
@@ -21,16 +21,16 @@ list_group <- dbcListGroup(
           list(
             htmlH5(
               "This item also has a heading",
-              class_name = "mb-1"
+              className = "mb-1"
             ),
-            htmlSmall("Ok!", class_name = "text-warning")
+            htmlSmall("Ok!", className = "text-warning")
           ),
-          class_name = "d-flex w-100 justify-content-between"
+          className = "d-flex w-100 justify-content-between"
         ),
-        htmlP("And some more text underneath too", class_name = "mb-1"),
+        htmlP("And some more text underneath too", className = "mb-1"),
         htmlSmall(
           "Plus even more small print.",
-          class_name = "text-muted"
+          className = "text-muted"
         )
       )
     )
diff --git a/docs/components_page/components/list_group/content.jl b/docs/components_page/components/list_group/content.jl
index 94c9f86f9..7d1e9723d 100644
--- a/docs/components_page/components/list_group/content.jl
+++ b/docs/components_page/components/list_group/content.jl
@@ -4,23 +4,23 @@ list_group = dbc_listgroup([
     dbc_listgroupitem([
         html_div(
             [
-                html_h5("This item has a heading", class_name = "mb-1"),
-                html_small("Yay!", class_name = "text-success"),
+                html_h5("This item has a heading", className = "mb-1"),
+                html_small("Yay!", className = "text-success"),
             ],
-            class_name = "d-flex w-100 justify-content-between",
+            className = "d-flex w-100 justify-content-between",
         ),
-        html_p("And some text underneath", class_name = "mb-1"),
-        html_small("Plus some small print.", class_name = "text-muted"),
+        html_p("And some text underneath", className = "mb-1"),
+        html_small("Plus some small print.", className = "text-muted"),
     ]),
     dbc_listgroupitem([
         html_div(
             [
-                html_h5("This item also has a heading", class_name = "mb-1"),
-                html_small("Ok!", class_name = "text-warning"),
+                html_h5("This item also has a heading", className = "mb-1"),
+                html_small("Ok!", className = "text-warning"),
             ],
-            class_name = "d-flex w-100 justify-content-between",
+            className = "d-flex w-100 justify-content-between",
         ),
-        html_p("And some more text underneath too", class_name = "mb-1"),
-        html_small("Plus even more small print.", class_name = "text-muted"),
+        html_p("And some more text underneath too", className = "mb-1"),
+        html_small("Plus even more small print.", className = "text-muted"),
     ]),
 ]);
diff --git a/docs/components_page/components/list_group/content.py b/docs/components_page/components/list_group/content.py
index 6698b4bb7..bee95f729 100644
--- a/docs/components_page/components/list_group/content.py
+++ b/docs/components_page/components/list_group/content.py
@@ -7,13 +7,13 @@
             [
                 html.Div(
                     [
-                        html.H5("This item has a heading", class_name="mb-1"),
-                        html.Small("Yay!", class_name="text-success"),
+                        html.H5("This item has a heading", className="mb-1"),
+                        html.Small("Yay!", className="text-success"),
                     ],
-                    class_name="d-flex w-100 justify-content-between",
+                    className="d-flex w-100 justify-content-between",
                 ),
-                html.P("And some text underneath", class_name="mb-1"),
-                html.Small("Plus some small print.", class_name="text-muted"),
+                html.P("And some text underneath", className="mb-1"),
+                html.Small("Plus some small print.", className="text-muted"),
             ]
         ),
         dbc.ListGroupItem(
@@ -21,15 +21,15 @@
                 html.Div(
                     [
                         html.H5(
-                            "This item also has a heading", class_name="mb-1"
+                            "This item also has a heading", className="mb-1"
                         ),
-                        html.Small("Ok!", class_name="text-warning"),
+                        html.Small("Ok!", className="text-warning"),
                     ],
-                    class_name="d-flex w-100 justify-content-between",
+                    className="d-flex w-100 justify-content-between",
                 ),
-                html.P("And some more text underneath too", class_name="mb-1"),
+                html.P("And some more text underneath too", className="mb-1"),
                 html.Small(
-                    "Plus even more small print.", class_name="text-muted"
+                    "Plus even more small print.", className="text-muted"
                 ),
             ]
         ),
diff --git a/docs/components_page/components/list_group/horizontal.R b/docs/components_page/components/list_group/horizontal.R
index 5802b2430..3e42d7135 100644
--- a/docs/components_page/components/list_group/horizontal.R
+++ b/docs/components_page/components/list_group/horizontal.R
@@ -10,7 +10,7 @@ list_group <- htmlDiv(
         dbcListGroupItem("Item 3")
       ),
       horizontal = TRUE,
-      class_name = "mb-2"
+      className = "mb-2"
     ),
     dbcListGroup(
       list(
diff --git a/docs/components_page/components/list_group/horizontal.jl b/docs/components_page/components/list_group/horizontal.jl
index 45bf76d86..71072070b 100644
--- a/docs/components_page/components/list_group/horizontal.jl
+++ b/docs/components_page/components/list_group/horizontal.jl
@@ -8,7 +8,7 @@ list_group = html_div([
             dbc_listgroupitem("Item 3"),
         ],
         horizontal = true,
-        class_name = "mb-2",
+        className = "mb-2",
     ),
     dbc_listgroup(
         [
diff --git a/docs/components_page/components/list_group/horizontal.py b/docs/components_page/components/list_group/horizontal.py
index 1824a2276..dda329e22 100644
--- a/docs/components_page/components/list_group/horizontal.py
+++ b/docs/components_page/components/list_group/horizontal.py
@@ -10,7 +10,7 @@
                 dbc.ListGroupItem("Item 3"),
             ],
             horizontal=True,
-            class_name="mb-2",
+            className="mb-2",
         ),
         dbc.ListGroup(
             [
diff --git a/docs/components_page/components/modal/backdrop.R b/docs/components_page/components/modal/backdrop.R
index 80d512710..0516dff39 100644
--- a/docs/components_page/components/modal/backdrop.R
+++ b/docs/components_page/components/modal/backdrop.R
@@ -17,7 +17,7 @@ modal <- htmlDiv(
           value = TRUE,
         )
       ),
-      class_name = "mb-2"
+      className = "mb-2"
     ),
     dbcButton("Open modal", id = "open-backdrop", n_clicks = 0),
     dbcModal(
@@ -30,7 +30,7 @@ modal <- htmlDiv(
           dbcButton(
             "Close",
             id = "close-backdrop",
-            class_name = "ms-auto",
+            className = "ms-auto",
             n_clicks = 0
           )
         )
diff --git a/docs/components_page/components/modal/backdrop.jl b/docs/components_page/components/modal/backdrop.jl
index a226435b5..da96dcfb5 100644
--- a/docs/components_page/components/modal/backdrop.jl
+++ b/docs/components_page/components/modal/backdrop.jl
@@ -15,7 +15,7 @@ modal = html_div([
                 value = true,
             ),
         ],
-        class_name = "mb-2",
+        className = "mb-2",
     ),
     dbc_button("Open modal", id = "open-backdrop", n_clicks = 0),
     dbc_modal(
@@ -26,7 +26,7 @@ modal = html_div([
                 dbc_button(
                     "Close",
                     id = "close-backdrop",
-                    class_name = "ms-auto",
+                    className = "ms-auto",
                     n_clicks = 0,
                 ),
             ),
diff --git a/docs/components_page/components/modal/backdrop.py b/docs/components_page/components/modal/backdrop.py
index d0daf8d75..f0e51158c 100644
--- a/docs/components_page/components/modal/backdrop.py
+++ b/docs/components_page/components/modal/backdrop.py
@@ -17,7 +17,7 @@
                     value=True,
                 ),
             ],
-            class_name="mb-2",
+            className="mb-2",
         ),
         dbc.Button("Open modal", id="open-backdrop", n_clicks=0),
         dbc.Modal(
@@ -30,7 +30,7 @@
                     dbc.Button(
                         "Close",
                         id="close-backdrop",
-                        class_name="ms-auto",
+                        className="ms-auto",
                         n_clicks=0,
                     )
                 ),
diff --git a/docs/components_page/components/modal/centered.R b/docs/components_page/components/modal/centered.R
index 072f3b85d..110061897 100644
--- a/docs/components_page/components/modal/centered.R
+++ b/docs/components_page/components/modal/centered.R
@@ -11,7 +11,7 @@ modal <- htmlDiv(
         dbcModalFooter(
           dbcButton(
             "Close",
-            id = "close-centered", class_name = "ms-auto", n_clicks = 0
+            id = "close-centered", className = "ms-auto", n_clicks = 0
           )
         )
       ),
diff --git a/docs/components_page/components/modal/centered.jl b/docs/components_page/components/modal/centered.jl
index 8cf181b29..985250a3e 100644
--- a/docs/components_page/components/modal/centered.jl
+++ b/docs/components_page/components/modal/centered.jl
@@ -10,7 +10,7 @@ modal = html_div([
                 dbc_button(
                     "Close",
                     id = "close-centered",
-                    class_name = "ms-auto",
+                    className = "ms-auto",
                     n_clicks = 0,
                 ),
             ),
diff --git a/docs/components_page/components/modal/centered.py b/docs/components_page/components/modal/centered.py
index 0ba031a63..cef9baf43 100644
--- a/docs/components_page/components/modal/centered.py
+++ b/docs/components_page/components/modal/centered.py
@@ -12,7 +12,7 @@
                     dbc.Button(
                         "Close",
                         id="close-centered",
-                        class_name="ms-auto",
+                        className="ms-auto",
                         n_clicks=0,
                     )
                 ),
diff --git a/docs/components_page/components/modal/scrollable.R b/docs/components_page/components/modal/scrollable.R
index 915410364..6333d2ebf 100644
--- a/docs/components_page/components/modal/scrollable.R
+++ b/docs/components_page/components/modal/scrollable.R
@@ -12,7 +12,7 @@ modal <- htmlDiv(
   list(
     dbcButton(
       "Scrolling modal",
-      id = "open-scroll", n_clicks = 0, class_name = "me-1"
+      id = "open-scroll", n_clicks = 0, className = "me-1"
     ),
     dbcButton("Modal with scrollable body",
       id = "open-body-scroll",
@@ -25,7 +25,7 @@ modal <- htmlDiv(
         dbcModalFooter(
           dbcButton("Close",
             id = "close-scroll", n_clicks = 0,
-            class_name = "ms-auto"
+            className = "ms-auto"
           )
         )
       ),
@@ -40,7 +40,7 @@ modal <- htmlDiv(
           dbcButton(
             "Close",
             id = "close-body-scroll", n_clicks = 0,
-            class_name = "ms-auto"
+            className = "ms-auto"
           )
         )
       ),
diff --git a/docs/components_page/components/modal/scrollable.jl b/docs/components_page/components/modal/scrollable.jl
index d356d9823..15eddda34 100644
--- a/docs/components_page/components/modal/scrollable.jl
+++ b/docs/components_page/components/modal/scrollable.jl
@@ -11,7 +11,7 @@ LOREM = rstrip(
 )
 
 modal = html_div([
-    dbc_button("Scrolling modal", id = "open-scroll", class_name = "me-1", n_clicks = 0),
+    dbc_button("Scrolling modal", id = "open-scroll", className = "me-1", n_clicks = 0),
     dbc_button("Modal with scrollable body", id = "open-body-scroll", n_clicks = 0),
     dbc_modal(
         [
@@ -21,7 +21,7 @@ modal = html_div([
                 dbc_button(
                     "Close",
                     id = "close-scroll",
-                    class_name = "ms-auto",
+                    className = "ms-auto",
                     n_clicks = 0,
                 ),
             ),
@@ -37,7 +37,7 @@ modal = html_div([
                 dbc_button(
                     "Close",
                     id = "close-body-scroll",
-                    class_name = "ms-auto",
+                    className = "ms-auto",
                     n_clicks = 0,
                 ),
             ),
diff --git a/docs/components_page/components/modal/scrollable.py b/docs/components_page/components/modal/scrollable.py
index 18c52e5c0..df14ce997 100644
--- a/docs/components_page/components/modal/scrollable.py
+++ b/docs/components_page/components/modal/scrollable.py
@@ -4,7 +4,7 @@
 modal = html.Div(
     [
         dbc.Button(
-            "Scrolling modal", id="open-scroll", class_name="me-1", n_clicks=0
+            "Scrolling modal", id="open-scroll", className="me-1", n_clicks=0
         ),
         dbc.Button(
             "Modal with scrollable body", id="open-body-scroll", n_clicks=0
@@ -17,7 +17,7 @@
                     dbc.Button(
                         "Close",
                         id="close-scroll",
-                        class_name="ms-auto",
+                        className="ms-auto",
                         n_clicks=0,
                     )
                 ),
@@ -33,7 +33,7 @@
                     dbc.Button(
                         "Close",
                         id="close-body-scroll",
-                        class_name="ms-auto",
+                        className="ms-auto",
                         n_clicks=0,
                     )
                 ),
diff --git a/docs/components_page/components/modal/simple.R b/docs/components_page/components/modal/simple.R
index 3ca74f7be..e302b1d16 100644
--- a/docs/components_page/components/modal/simple.R
+++ b/docs/components_page/components/modal/simple.R
@@ -11,7 +11,7 @@ modal <- htmlDiv(
         dbcModalFooter(
           dbcButton(
             "Close",
-            id = "close", n_clicks = 0, class_name = "ms-auto"
+            id = "close", n_clicks = 0, className = "ms-auto"
           )
         )
       ),
diff --git a/docs/components_page/components/modal/simple.jl b/docs/components_page/components/modal/simple.jl
index 627a14e53..4df7d38cc 100644
--- a/docs/components_page/components/modal/simple.jl
+++ b/docs/components_page/components/modal/simple.jl
@@ -7,7 +7,7 @@ modal = html_div([
             dbc_modalheader(dbc_modaltitle("Header")),
             dbc_modalbody("This is the content of the modal"),
             dbc_modalfooter(
-                dbc_button("Close", id = "close", class_name = "ms-auto", n_clicks = 0),
+                dbc_button("Close", id = "close", className = "ms-auto", n_clicks = 0),
             ),
         ],
         id = "modal",
diff --git a/docs/components_page/components/modal/simple.py b/docs/components_page/components/modal/simple.py
index 44ef45f68..ca6541ede 100644
--- a/docs/components_page/components/modal/simple.py
+++ b/docs/components_page/components/modal/simple.py
@@ -10,7 +10,7 @@
                 dbc.ModalBody("This is the content of the modal"),
                 dbc.ModalFooter(
                     dbc.Button(
-                        "Close", id="close", class_name="ms-auto", n_clicks=0
+                        "Close", id="close", className="ms-auto", n_clicks=0
                     )
                 ),
             ],
diff --git a/docs/components_page/components/modal/size.R b/docs/components_page/components/modal/size.R
index 867d33822..9e38e0498 100644
--- a/docs/components_page/components/modal/size.R
+++ b/docs/components_page/components/modal/size.R
@@ -3,8 +3,8 @@ library(dashHtmlComponents)
 
 modal <- htmlDiv(
   list(
-    dbcButton("Small modal", id = "open-sm", n_clicks = 0, class_name = "me-1"),
-    dbcButton("Large modal", id = "open-lg", n_clicks = 0, class_name = "me-1"),
+    dbcButton("Small modal", id = "open-sm", n_clicks = 0, className = "me-1"),
+    dbcButton("Large modal", id = "open-lg", n_clicks = 0, className = "me-1"),
     dbcButton("Extra large modal", n_clicks = 0, id = "open-xl"),
     dbcModal(
       list(
diff --git a/docs/components_page/components/modal/size.jl b/docs/components_page/components/modal/size.jl
index 067d1b635..125b5d068 100644
--- a/docs/components_page/components/modal/size.jl
+++ b/docs/components_page/components/modal/size.jl
@@ -1,8 +1,8 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 modal = html_div([
-    dbc_button("Small modal", id = "open-sm", class_name = "me-1", n_clicks = 0),
-    dbc_button("Large modal", id = "open-lg", class_name = "me-1", n_clicks = 0),
+    dbc_button("Small modal", id = "open-sm", className = "me-1", n_clicks = 0),
+    dbc_button("Large modal", id = "open-lg", className = "me-1", n_clicks = 0),
     dbc_button("Extra large modal", id = "open-xl", n_clicks = 0),
     dbc_modal(
         [dbc_modalheader(dbc_modaltitle("Header")), dbc_modalbody("A small modal.")],
diff --git a/docs/components_page/components/modal/size.py b/docs/components_page/components/modal/size.py
index 9659813d3..a24d3fbb1 100644
--- a/docs/components_page/components/modal/size.py
+++ b/docs/components_page/components/modal/size.py
@@ -3,8 +3,8 @@
 
 modal = html.Div(
     [
-        dbc.Button("Small modal", id="open-sm", class_name="me-1", n_clicks=0),
-        dbc.Button("Large modal", id="open-lg", class_name="me-1", n_clicks=0),
+        dbc.Button("Small modal", id="open-sm", className="me-1", n_clicks=0),
+        dbc.Button("Large modal", id="open-lg", className="me-1", n_clicks=0),
         dbc.Button("Extra large modal", id="open-xl", n_clicks=0),
         dbc.Modal(
             [
diff --git a/docs/components_page/components/modal/toggle.R b/docs/components_page/components/modal/toggle.R
index 9fd9634d7..f3474f6dd 100644
--- a/docs/components_page/components/modal/toggle.R
+++ b/docs/components_page/components/modal/toggle.R
@@ -9,7 +9,7 @@ modal_1 <- dbcModal(
       dbcButton(
         "Open Modal 2",
         id = "open-toggle-modal-2",
-        class_name = "ms-auto",
+        className = "ms-auto",
         n_clicks = 0
       )
     )
@@ -26,7 +26,7 @@ modal_2 <- dbcModal(
       dbcButton(
         "Back to Modal 1",
         id = "open-toggle-modal-1",
-        class_name = "ms-auto",
+        className = "ms-auto",
         n_clicks = 0
       )
     )
diff --git a/docs/components_page/components/modal/toggle.jl b/docs/components_page/components/modal/toggle.jl
index c035277e3..68660d5f3 100644
--- a/docs/components_page/components/modal/toggle.jl
+++ b/docs/components_page/components/modal/toggle.jl
@@ -8,7 +8,7 @@ modal_1 = dbc_modal(
             dbc_button(
                 "Open Modal 2",
                 id = "open-toggle-modal-2",
-                class_name = "ms-auto",
+                className = "ms-auto",
                 n_clicks = 0,
             ),
         ),
@@ -25,7 +25,7 @@ modal_2 = dbc_modal(
             dbc_button(
                 "Back to Modal 1",
                 id = "open-toggle-modal-1",
-                class_name = "ms-auto",
+                className = "ms-auto",
                 n_clicks = 0,
             ),
         ),
diff --git a/docs/components_page/components/modal/toggle.py b/docs/components_page/components/modal/toggle.py
index 3cfee631e..a730fd13a 100644
--- a/docs/components_page/components/modal/toggle.py
+++ b/docs/components_page/components/modal/toggle.py
@@ -9,7 +9,7 @@
             dbc.Button(
                 "Open Modal 2",
                 id="open-toggle-modal-2",
-                class_name="ms-auto",
+                className="ms-auto",
                 n_clicks=0,
             )
         ),
@@ -26,7 +26,7 @@
             dbc.Button(
                 "Back to Modal 1",
                 id="open-toggle-modal-1",
-                class_name="ms-auto",
+                className="ms-auto",
                 n_clicks=0,
             )
         ),
diff --git a/docs/components_page/components/navbar/navbar.R b/docs/components_page/components/navbar/navbar.R
index c23fee51d..e87a2ef18 100644
--- a/docs/components_page/components/navbar/navbar.R
+++ b/docs/components_page/components/navbar/navbar.R
@@ -9,12 +9,12 @@ search_bar <- dbcRow(
     dbcCol(
       dbcButton(
         "Search",
-        color = "primary", n_clicks = 0, class_name = "ms-2"
+        color = "primary", n_clicks = 0, className = "ms-2"
       ),
       width = "auto"
     )
   ),
-  class_name = "g-0 ms-auto flex-nowrap mt-3 mt-md-0",
+  className = "g-0 ms-auto flex-nowrap mt-3 mt-md-0",
   align = "center"
 )
 
@@ -26,10 +26,10 @@ navbar <- dbcNavbar(
         dbcRow(
           list(
             dbcCol(htmlImg(src = PLOTLY_LOGO, height = "30px")),
-            dbcCol(dbcNavbarBrand("Navbar", class_name = "ms-2"))
+            dbcCol(dbcNavbarBrand("Navbar", className = "ms-2"))
           ),
           align = "center",
-          class_name = "g-0"
+          className = "g-0"
         ),
         href = "https://plotly.com",
         style = list("textDecoration" = "none")
diff --git a/docs/components_page/components/navbar/navbar.jl b/docs/components_page/components/navbar/navbar.jl
index 427b48498..5e7321b95 100644
--- a/docs/components_page/components/navbar/navbar.jl
+++ b/docs/components_page/components/navbar/navbar.jl
@@ -6,11 +6,11 @@ search_bar = dbc_row(
     [
         dbc_col(dbc_input(type = "search", placeholder = "Search")),
         dbc_col(
-            dbc_button("Search", color = "primary", class_name = "ms-2", n_clicks = 0),
+            dbc_button("Search", color = "primary", className = "ms-2", n_clicks = 0),
             width = "auto",
         ),
     ],
-    class_name = "g-0 ms-auto flex-nowrap mt-3 mt-md-0",
+    className = "g-0 ms-auto flex-nowrap mt-3 mt-md-0",
     align = "center",
 );
 
@@ -21,10 +21,10 @@ navbar = dbc_navbar(
             dbc_row(
                 [
                     dbc_col(html_img(src = PLOTLY_LOGO, height = "30px")),
-                    dbc_col(dbc_navbarbrand("Navbar", class_name = "ms-2")),
+                    dbc_col(dbc_navbarbrand("Navbar", className = "ms-2")),
                 ],
                 align = "center",
-                class_name = "g-0",
+                className = "g-0",
             ),
             href = "https://plotly.com",
             style = Dict("textDecoration" => "none"),
diff --git a/docs/components_page/components/navbar/navbar.py b/docs/components_page/components/navbar/navbar.py
index e97722a1b..fc25a38c5 100644
--- a/docs/components_page/components/navbar/navbar.py
+++ b/docs/components_page/components/navbar/navbar.py
@@ -9,12 +9,12 @@
         dbc.Col(dbc.Input(type="search", placeholder="Search")),
         dbc.Col(
             dbc.Button(
-                "Search", color="primary", class_name="ms-2", n_clicks=0
+                "Search", color="primary", className="ms-2", n_clicks=0
             ),
             width="auto",
         ),
     ],
-    class_name="g-0 ms-auto flex-nowrap mt-3 mt-md-0",
+    className="g-0 ms-auto flex-nowrap mt-3 mt-md-0",
     align="center",
 )
 
@@ -26,10 +26,10 @@
                 dbc.Row(
                     [
                         dbc.Col(html.Img(src=PLOTLY_LOGO, height="30px")),
-                        dbc.Col(dbc.NavbarBrand("Navbar", class_name="ms-2")),
+                        dbc.Col(dbc.NavbarBrand("Navbar", className="ms-2")),
                     ],
                     align="center",
-                    class_name="g-0",
+                    className="g-0",
                 ),
                 href="https://plotly.com",
                 style={"textDecoration": "none"},
diff --git a/docs/components_page/components/offcanvas/backdrop.R b/docs/components_page/components/offcanvas/backdrop.R
index 6042584bf..081d1577a 100644
--- a/docs/components_page/components/offcanvas/backdrop.R
+++ b/docs/components_page/components/offcanvas/backdrop.R
@@ -15,7 +15,7 @@ backdrop_selector <- htmlDiv(
       value = TRUE
     )
   ),
-  class_name = "mb-2"
+  className = "mb-2"
 )
 
 
diff --git a/docs/components_page/components/offcanvas/backdrop.jl b/docs/components_page/components/offcanvas/backdrop.jl
index d7013e576..04761488d 100644
--- a/docs/components_page/components/offcanvas/backdrop.jl
+++ b/docs/components_page/components/offcanvas/backdrop.jl
@@ -14,7 +14,7 @@ backdrop_selector = html_div(
             value = true,
         ),
     ],
-    class_name = "mb-2",
+    className = "mb-2",
 )
 
 offcanvas = html_div([
diff --git a/docs/components_page/components/offcanvas/backdrop.py b/docs/components_page/components/offcanvas/backdrop.py
index 7b9af7229..bba8180ae 100644
--- a/docs/components_page/components/offcanvas/backdrop.py
+++ b/docs/components_page/components/offcanvas/backdrop.py
@@ -15,7 +15,7 @@
             value=True,
         ),
     ],
-    class_name="mb-2",
+    className="mb-2",
 )
 
 offcanvas = html.Div(
diff --git a/docs/components_page/components/offcanvas/placement.R b/docs/components_page/components/offcanvas/placement.R
index 268622713..0fa3f97ca 100644
--- a/docs/components_page/components/offcanvas/placement.R
+++ b/docs/components_page/components/offcanvas/placement.R
@@ -16,7 +16,7 @@ placement_selector <- htmlDiv(
       inline = TRUE
     )
   ),
-  class_name = "mb-2"
+  className = "mb-2"
 )
 
 offcanvas <- htmlDiv(
diff --git a/docs/components_page/components/offcanvas/placement.jl b/docs/components_page/components/offcanvas/placement.jl
index c55067f86..f8fd7d810 100644
--- a/docs/components_page/components/offcanvas/placement.jl
+++ b/docs/components_page/components/offcanvas/placement.jl
@@ -15,7 +15,7 @@ placement_selector = html_div(
             inline = true,
         ),
     ],
-    class_name = "mb-2",
+    className = "mb-2",
 )
 
 offcanvas = html_div([
diff --git a/docs/components_page/components/offcanvas/placement.py b/docs/components_page/components/offcanvas/placement.py
index 5ff6b22b7..8bd60c2a9 100644
--- a/docs/components_page/components/offcanvas/placement.py
+++ b/docs/components_page/components/offcanvas/placement.py
@@ -16,7 +16,7 @@
             inline=True,
         ),
     ],
-    class_name="mb-2",
+    className="mb-2",
 )
 
 offcanvas = html.Div(
diff --git a/docs/components_page/components/popover/direction.R b/docs/components_page/components/popover/direction.R
index 752baf59a..c8fca6985 100644
--- a/docs/components_page/components/popover/direction.R
+++ b/docs/components_page/components/popover/direction.R
@@ -22,7 +22,7 @@ make_button <- function(placement) {
     dbcButton(
       sprintf("Popover on %s", placement),
       id = sprintf("popover-%s-target", placement),
-      class_name = "mx-2",
+      className = "mx-2",
       n_clicks = 0
     )
   )
diff --git a/docs/components_page/components/popover/direction.jl b/docs/components_page/components/popover/direction.jl
index 7b162b5af..644304d66 100644
--- a/docs/components_page/components/popover/direction.jl
+++ b/docs/components_page/components/popover/direction.jl
@@ -15,7 +15,7 @@ function make_button(placement)
     return dbc_button(
         "Popover on $placement",
         id = "popover-$placement-target",
-        class_name = "mx-2",
+        className = "mx-2",
         n_clicks = 0,
     )
 end;
diff --git a/docs/components_page/components/popover/direction.py b/docs/components_page/components/popover/direction.py
index 2a7b19dc9..8d3e088b8 100644
--- a/docs/components_page/components/popover/direction.py
+++ b/docs/components_page/components/popover/direction.py
@@ -19,7 +19,7 @@ def make_button(placement):
     return dbc.Button(
         f"Popover on {placement}",
         id=f"popover-{placement}-target",
-        class_name="mx-2",
+        className="mx-2",
         n_clicks=0,
     )
 
diff --git a/docs/components_page/components/popover/popover.R b/docs/components_page/components/popover/popover.R
index e89bf03e5..c53d90ff8 100644
--- a/docs/components_page/components/popover/popover.R
+++ b/docs/components_page/components/popover/popover.R
@@ -11,7 +11,7 @@ popovers <- htmlDiv(
     dbcButton(
       "Click",
       id = "click-target", n_clicks = 0,
-      color = "danger", class_name = "me-1"
+      color = "danger", className = "me-1"
     ),
     dbcPopover(
       popover_children,
@@ -22,7 +22,7 @@ popovers <- htmlDiv(
     dbcButton(
       "Focus",
       id = "focus-target", n_clicks = 0,
-      color = "danger", class_name = "me-1"
+      color = "danger", className = "me-1"
     ),
     dbcPopover(
       popover_children,
@@ -33,7 +33,7 @@ popovers <- htmlDiv(
     dbcButton(
       "Hover",
       id = "hover-target", n_clicks = 0,
-      color = "danger", class_name = "me-1"
+      color = "danger", className = "me-1"
     ),
     dbcPopover(
       popover_children,
diff --git a/docs/components_page/components/popover/popover.jl b/docs/components_page/components/popover/popover.jl
index 7f3774853..5bfbc541d 100644
--- a/docs/components_page/components/popover/popover.jl
+++ b/docs/components_page/components/popover/popover.jl
@@ -10,7 +10,7 @@ popovers = html_div([
         "Click",
         id = "click-target",
         color = "danger",
-        class_name = "me-1",
+        className = "me-1",
         n_clicks = 0,
     ),
     dbc_popover(popover_children, id = "click", target = "click-target", trigger = "click"),
@@ -18,7 +18,7 @@ popovers = html_div([
         "Focus",
         id = "focus-target",
         color = "danger",
-        class_name = "me-1",
+        className = "me-1",
         n_clicks = 0,
     ),
     dbc_popover(popover_children, id = "focus", target = "focus-target", trigger = "focus"),
@@ -26,7 +26,7 @@ popovers = html_div([
         "Hover",
         id = "hover-target",
         color = "danger",
-        class_name = "me-1",
+        className = "me-1",
         n_clicks = 0,
     ),
     dbc_popover(popover_children, id = "hover", target = "hover-target", trigger = "hover"),
diff --git a/docs/components_page/components/popover/popover.py b/docs/components_page/components/popover/popover.py
index 3c7138a62..7a793dc8d 100644
--- a/docs/components_page/components/popover/popover.py
+++ b/docs/components_page/components/popover/popover.py
@@ -12,7 +12,7 @@
             "Click",
             id="click-target",
             color="danger",
-            class_name="me-1",
+            className="me-1",
             n_clicks=0,
         ),
         dbc.Popover(
@@ -25,7 +25,7 @@
             "Focus",
             id="focus-target",
             color="danger",
-            class_name="me-1",
+            className="me-1",
             n_clicks=0,
         ),
         dbc.Popover(
@@ -38,7 +38,7 @@
             "Hover",
             id="hover-target",
             color="danger",
-            class_name="me-1",
+            className="me-1",
             n_clicks=0,
         ),
         dbc.Popover(
diff --git a/docs/components_page/components/popover/popover_callback.R b/docs/components_page/components/popover/popover_callback.R
index 1bb8df667..c701b68e5 100644
--- a/docs/components_page/components/popover/popover_callback.R
+++ b/docs/components_page/components/popover/popover_callback.R
@@ -5,7 +5,7 @@ popover <- htmlDiv(
   list(
     dbcButton("Toggle",
       id = "toggle", n_clicks = 0,
-      color = "success", class_name = "me-4"
+      color = "success", className = "me-4"
     ),
     dbcButton("Target", id = "target", n_clicks = 0, color = "danger"),
     dbcPopover(
diff --git a/docs/components_page/components/popover/popover_callback.jl b/docs/components_page/components/popover/popover_callback.jl
index 83b98243d..6345d86a6 100644
--- a/docs/components_page/components/popover/popover_callback.jl
+++ b/docs/components_page/components/popover/popover_callback.jl
@@ -5,7 +5,7 @@ popover = html_div([
         "Toggle",
         id = "toggle",
         color = "success",
-        class_name = "me-4",
+        className = "me-4",
         n_clicks = 0,
     ),
     dbc_button("Target", id = "target", color = "danger", n_clicks = 0),
diff --git a/docs/components_page/components/popover/popover_callback.py b/docs/components_page/components/popover/popover_callback.py
index a4e36ae76..52a52a731 100644
--- a/docs/components_page/components/popover/popover_callback.py
+++ b/docs/components_page/components/popover/popover_callback.py
@@ -7,7 +7,7 @@
             "Toggle",
             id="toggle",
             color="success",
-            class_name="me-4",
+            className="me-4",
             n_clicks=0,
         ),
         dbc.Button("Target", id="target", color="danger", n_clicks=0),
diff --git a/docs/components_page/components/progress/animated.R b/docs/components_page/components/progress/animated.R
index caa856aa0..2ded10f1b 100644
--- a/docs/components_page/components/progress/animated.R
+++ b/docs/components_page/components/progress/animated.R
@@ -9,7 +9,7 @@ progress <- htmlDiv(
     dbcButton(
       "Toggle animation",
       id = "animation-toggle", n_clicks = 0,
-      class_name = "mt-3"
+      className = "mt-3"
     )
   )
 )
diff --git a/docs/components_page/components/progress/animated.jl b/docs/components_page/components/progress/animated.jl
index d99263872..ab3807891 100644
--- a/docs/components_page/components/progress/animated.jl
+++ b/docs/components_page/components/progress/animated.jl
@@ -5,7 +5,7 @@ progress = html_div([
     dbc_button(
         "Toggle animation",
         id = "animation-toggle",
-        class_name = "mt-3",
+        className = "mt-3",
         n_clicks = 0,
     ),
 ]);
diff --git a/docs/components_page/components/progress/animated.py b/docs/components_page/components/progress/animated.py
index 0cc0cfb9e..2d0f03be3 100644
--- a/docs/components_page/components/progress/animated.py
+++ b/docs/components_page/components/progress/animated.py
@@ -9,7 +9,7 @@
         dbc.Button(
             "Toggle animation",
             id="animation-toggle",
-            class_name="mt-3",
+            className="mt-3",
             n_clicks=0,
         ),
     ]
diff --git a/docs/components_page/components/progress/background.R b/docs/components_page/components/progress/background.R
index 8ed3c7d7d..18cac0405 100644
--- a/docs/components_page/components/progress/background.R
+++ b/docs/components_page/components/progress/background.R
@@ -3,9 +3,9 @@ library(dashHtmlComponents)
 
 progress <- htmlDiv(
   list(
-    dbcProgress(value = 25, color = "success", class_name = "mb-3"),
-    dbcProgress(value = 50, color = "warning", class_name = "mb-3"),
-    dbcProgress(value = 75, color = "danger", class_name = "mb-3"),
+    dbcProgress(value = 25, color = "success", className = "mb-3"),
+    dbcProgress(value = 50, color = "warning", className = "mb-3"),
+    dbcProgress(value = 75, color = "danger", className = "mb-3"),
     dbcProgress(value = 100, color = "info")
   )
 )
diff --git a/docs/components_page/components/progress/background.jl b/docs/components_page/components/progress/background.jl
index 3ee9a74b3..6845d75bb 100644
--- a/docs/components_page/components/progress/background.jl
+++ b/docs/components_page/components/progress/background.jl
@@ -1,8 +1,8 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 progress = html_div([
-    dbc_progress(value = 25, color = "success", class_name = "mb-3"),
-    dbc_progress(value = 50, color = "warning", class_name = "mb-3"),
-    dbc_progress(value = 75, color = "danger", class_name = "mb-3"),
+    dbc_progress(value = 25, color = "success", className = "mb-3"),
+    dbc_progress(value = 50, color = "warning", className = "mb-3"),
+    dbc_progress(value = 75, color = "danger", className = "mb-3"),
     dbc_progress(value = 100, color = "info"),
 ]);
diff --git a/docs/components_page/components/progress/background.py b/docs/components_page/components/progress/background.py
index 47774d980..05e05209d 100644
--- a/docs/components_page/components/progress/background.py
+++ b/docs/components_page/components/progress/background.py
@@ -3,9 +3,9 @@
 
 progress = html.Div(
     [
-        dbc.Progress(value=25, color="success", class_name="mb-3"),
-        dbc.Progress(value=50, color="warning", class_name="mb-3"),
-        dbc.Progress(value=75, color="danger", class_name="mb-3"),
+        dbc.Progress(value=25, color="success", className="mb-3"),
+        dbc.Progress(value=50, color="warning", className="mb-3"),
+        dbc.Progress(value=75, color="danger", className="mb-3"),
         dbc.Progress(value=100, color="info"),
     ]
 )
diff --git a/docs/components_page/components/progress/height.R b/docs/components_page/components/progress/height.R
index 78ee91d34..b7a347cd7 100644
--- a/docs/components_page/components/progress/height.R
+++ b/docs/components_page/components/progress/height.R
@@ -3,7 +3,7 @@ library(dashHtmlComponents)
 
 progress <- htmlDiv(
   list(
-    dbcProgress(value = 50, style = list(height = "1px"), class_name = "mb-3"),
+    dbcProgress(value = 50, style = list(height = "1px"), className = "mb-3"),
     dbcProgress(value = 50, style = list(height = "30px"))
   )
 )
diff --git a/docs/components_page/components/progress/height.jl b/docs/components_page/components/progress/height.jl
index b693ef9ff..b7414f3a9 100644
--- a/docs/components_page/components/progress/height.jl
+++ b/docs/components_page/components/progress/height.jl
@@ -1,6 +1,6 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 progress = html_div([
-    dbc_progress(value = 50, style = Dict("height" => "1px"), class_name = "mb-3"),
+    dbc_progress(value = 50, style = Dict("height" => "1px"), className = "mb-3"),
     dbc_progress(value = 50, style = Dict("height" => "30px")),
 ]);
diff --git a/docs/components_page/components/progress/height.py b/docs/components_page/components/progress/height.py
index e47467e66..35ee19ee7 100644
--- a/docs/components_page/components/progress/height.py
+++ b/docs/components_page/components/progress/height.py
@@ -3,7 +3,7 @@
 
 progress = html.Div(
     [
-        dbc.Progress(value=50, style={"height": "1px"}, class_name="mb-3"),
+        dbc.Progress(value=50, style={"height": "1px"}, className="mb-3"),
         dbc.Progress(value=50, style={"height": "30px"}),
     ]
 )
diff --git a/docs/components_page/components/spinner.md b/docs/components_page/components/spinner.md
index 516572e4d..99ed8b8d9 100644
--- a/docs/components_page/components/spinner.md
+++ b/docs/components_page/components/spinner.md
@@ -15,7 +15,7 @@ To create a simple spinner, just add `dbc.Spinner()` to your layout. By default,
 
 If you pass children to `dbc.Spinner`, it will behave like `dcc.Loading`, which is to say it will render a spinner until the children component have loaded.
 
-The spinner is rendered inside a `html.Div`. The `html.Div` that the spinner is rendered in will expand to fill the available width, and add a top and bottom margin. This can be overridden using `spinner_style` or `spinner_class_name`.
+The spinner is rendered inside a `html.Div`. The `html.Div` that the spinner is rendered in will expand to fill the available width, and add a top and bottom margin. This can be overridden using `spinner_style` or `spinnerClassName`.
 
 {{example:components/spinner/loading.py:loading_spinner}}
 
diff --git a/docs/components_page/components/spinner/button.R b/docs/components_page/components/spinner/button.R
index aef91abb8..5132b391e 100644
--- a/docs/components_page/components/spinner/button.R
+++ b/docs/components_page/components/spinner/button.R
@@ -7,7 +7,7 @@ spinners <- htmlDiv(
       dbcSpinner(size = "sm"),
       color = "primary",
       disabled = TRUE,
-      class_name = "me-1"
+      className = "me-1"
     ),
     dbcButton(
       list(dbcSpinner(size = "sm"), " Loading..."),
diff --git a/docs/components_page/components/spinner/button.jl b/docs/components_page/components/spinner/button.jl
index 86d5eb829..eaeba089b 100644
--- a/docs/components_page/components/spinner/button.jl
+++ b/docs/components_page/components/spinner/button.jl
@@ -5,7 +5,7 @@ spinners = html_div([
         dbc_spinner(size = "sm"),
         color = "primary",
         disabled = true,
-        class_name = "me-1",
+        className = "me-1",
     ),
     dbc_button(
         [dbc_spinner(size = "sm"), " Loading..."],
diff --git a/docs/components_page/components/spinner/button.py b/docs/components_page/components/spinner/button.py
index 995b7c205..11d55d4f7 100644
--- a/docs/components_page/components/spinner/button.py
+++ b/docs/components_page/components/spinner/button.py
@@ -7,7 +7,7 @@
             dbc.Spinner(size="sm"),
             color="primary",
             disabled=True,
-            class_name="me-1",
+            className="me-1",
         ),
         dbc.Button(
             [dbc.Spinner(size="sm"), " Loading..."],
diff --git a/docs/components_page/components/table/color.R b/docs/components_page/components/table/color.R
index 99fc0bbcd..36e66dd8f 100644
--- a/docs/components_page/components/table/color.R
+++ b/docs/components_page/components/table/color.R
@@ -19,7 +19,7 @@ color_selector <- htmlDiv(
       value = "primary"
     )
   ),
-  class_name = "p-3 m-2 border"
+  className = "p-3 m-2 border"
 )
 
 table <- htmlDiv(
diff --git a/docs/components_page/components/table/color.jl b/docs/components_page/components/table/color.jl
index 20a39d6e5..f0f26fdc6 100644
--- a/docs/components_page/components/table/color.jl
+++ b/docs/components_page/components/table/color.jl
@@ -18,7 +18,7 @@ color_selector = html_div(
             value = "primary",
         ),
     ],
-    class_name = "p-3 m-2 border",
+    className = "p-3 m-2 border",
 )
 
 table = html_div([
diff --git a/docs/components_page/components/table/color.py b/docs/components_page/components/table/color.py
index 10eba804b..85e086f51 100644
--- a/docs/components_page/components/table/color.py
+++ b/docs/components_page/components/table/color.py
@@ -19,7 +19,7 @@
             value="primary",
         ),
     ],
-    class_name="p-3 m-2 border",
+    className="p-3 m-2 border",
 )
 
 table = html.Div(
diff --git a/docs/components_page/components/tabs.md b/docs/components_page/components/tabs.md
index 1905a4657..f0c284657 100644
--- a/docs/components_page/components/tabs.md
+++ b/docs/components_page/components/tabs.md
@@ -25,11 +25,11 @@ Use `card=True` when placing your `Tabs` inside a `CardHeader`. You must use a c
 
 You can modify the style of the tabs and labels using the `tab_style` and `label_style` properties. Use `tab_style` to modify the tab itself, for example to modify placement and spacing. Use `label_style` to modify the label, for example the font, text color, border-radius and so on.
 
-You can also apply CSS classes to the tab or label using the `tab_class_name` or `label_class_name` properties. In the below example we apply the Bootstrap classes `ms-auto`, which sets the left margin to `auto`, and `text-success`, which sets the text color to the theme's 'success' color.
+You can also apply CSS classes to the tab or label using the `tabClassName` or `labelClassName` properties. In the below example we apply the Bootstrap classes `ms-auto`, which sets the left margin to `auto`, and `text-success`, which sets the text color to the theme's 'success' color.
 
 {{example:components/tabs/style.py:tabs}}
 
-To apply certain styles only to the currently active tab, you can use the `active_tab_style`, `active_tab_class_name`, `active_label_style` and `active_label_class_name` properties.
+To apply certain styles only to the currently active tab, you can use the `active_tab_style`, `activeTabClassName`, `active_label_style` and `active_labelClassName` properties.
 
 {{apidoc:src/components/tabs/Tabs.js}}
 
diff --git a/docs/components_page/components/tabs/card.R b/docs/components_page/components/tabs/card.R
index 020bee6d5..665d33060 100644
--- a/docs/components_page/components/tabs/card.R
+++ b/docs/components_page/components/tabs/card.R
@@ -13,7 +13,7 @@ card <- dbcCard(
         active_tab = "tab-1"
       )
     ),
-    dbcCardBody(htmlP(id = "card-content", class_name = "card-text"))
+    dbcCardBody(htmlP(id = "card-content", className = "card-text"))
   )
 )
 
diff --git a/docs/components_page/components/tabs/card.jl b/docs/components_page/components/tabs/card.jl
index 5f30d8cfa..d81df77b5 100644
--- a/docs/components_page/components/tabs/card.jl
+++ b/docs/components_page/components/tabs/card.jl
@@ -11,7 +11,7 @@ card = dbc_card([
             active_tab = "tab-1",
         ),
     ),
-    dbc_cardbody(html_p(id = "card-content", class_name = "card-text")),
+    dbc_cardbody(html_p(id = "card-content", className = "card-text")),
 ]);
 
 callback!(
diff --git a/docs/components_page/components/tabs/card.py b/docs/components_page/components/tabs/card.py
index 55059482a..142493316 100644
--- a/docs/components_page/components/tabs/card.py
+++ b/docs/components_page/components/tabs/card.py
@@ -13,7 +13,7 @@
                 active_tab="tab-1",
             )
         ),
-        dbc.CardBody(html.P(id="card-content", class_name="card-text")),
+        dbc.CardBody(html.P(id="card-content", className="card-text")),
     ]
 )
 
diff --git a/docs/components_page/components/tabs/simple.R b/docs/components_page/components/tabs/simple.R
index 4c4565438..0552a9313 100644
--- a/docs/components_page/components/tabs/simple.R
+++ b/docs/components_page/components/tabs/simple.R
@@ -4,21 +4,21 @@ library(dashHtmlComponents)
 tab1_content <- dbcCard(
   dbcCardBody(
     list(
-      htmlP("This is tab 1!", class_name = "card-text"),
+      htmlP("This is tab 1!", className = "card-text"),
       dbcButton("Click here", color = "success")
     )
   ),
-  class_name = "mt-3"
+  className = "mt-3"
 )
 
 tab2_content <- dbcCard(
   dbcCardBody(
     list(
-      htmlP("This is tab 2!", class_name = "card-text"),
+      htmlP("This is tab 2!", className = "card-text"),
       dbcButton("Don't click here", color = "danger")
     )
   ),
-  class_name = "mt-3",
+  className = "mt-3",
 )
 
 
diff --git a/docs/components_page/components/tabs/simple.jl b/docs/components_page/components/tabs/simple.jl
index c640897e5..63f3c4db6 100644
--- a/docs/components_page/components/tabs/simple.jl
+++ b/docs/components_page/components/tabs/simple.jl
@@ -2,18 +2,18 @@ using DashBootstrapComponents, DashHtmlComponents
 
 tab1_content = dbc_card(
     dbc_cardbody([
-        html_p("This is tab 1!", class_name = "card-text"),
+        html_p("This is tab 1!", className = "card-text"),
         dbc_button("Click here", color = "success"),
     ]),
-    class_name = "mt-3",
+    className = "mt-3",
 );
 
 tab2_content = dbc_card(
     dbc_cardbody([
-        html_p("This is tab 2!", class_name = "card-text"),
+        html_p("This is tab 2!", className = "card-text"),
         dbc_button("Don't click here", color = "danger"),
     ]),
-    class_name = "mt-3",
+    className = "mt-3",
 );
 
 
diff --git a/docs/components_page/components/tabs/simple.py b/docs/components_page/components/tabs/simple.py
index f5fad7a30..09e4854d1 100644
--- a/docs/components_page/components/tabs/simple.py
+++ b/docs/components_page/components/tabs/simple.py
@@ -4,21 +4,21 @@
 tab1_content = dbc.Card(
     dbc.CardBody(
         [
-            html.P("This is tab 1!", class_name="card-text"),
+            html.P("This is tab 1!", className="card-text"),
             dbc.Button("Click here", color="success"),
         ]
     ),
-    class_name="mt-3",
+    className="mt-3",
 )
 
 tab2_content = dbc.Card(
     dbc.CardBody(
         [
-            html.P("This is tab 2!", class_name="card-text"),
+            html.P("This is tab 2!", className="card-text"),
             dbc.Button("Don't click here", color="danger"),
         ]
     ),
-    class_name="mt-3",
+    className="mt-3",
 )
 
 
diff --git a/docs/components_page/components/tabs/style.R b/docs/components_page/components/tabs/style.R
index 2ccaf3531..bebf372a7 100644
--- a/docs/components_page/components/tabs/style.R
+++ b/docs/components_page/components/tabs/style.R
@@ -12,8 +12,8 @@ tabs <- htmlDiv(
     htmlBr(),
     dbcTabs(
       list(
-        dbcTab(label = "Tab 1", tab_class_name = "ms-auto"),
-        dbcTab(label = "Tab 2", label_class_name = "text-success")
+        dbcTab(label = "Tab 1", tabClassName = "ms-auto"),
+        dbcTab(label = "Tab 2", labelClassName = "text-success")
       )
     )
   )
diff --git a/docs/components_page/components/tabs/style.jl b/docs/components_page/components/tabs/style.jl
index e03fc4e17..a4c1daeb8 100644
--- a/docs/components_page/components/tabs/style.jl
+++ b/docs/components_page/components/tabs/style.jl
@@ -7,7 +7,7 @@ tabs = html_div([
     ]),
     html_br(),
     dbc_tabs([
-        dbc_tab(label = "Tab 1", tab_class_name = "ms-auto"),
-        dbc_tab(label = "Tab 2", label_class_name = "text-success"),
+        dbc_tab(label = "Tab 1", tabClassName = "ms-auto"),
+        dbc_tab(label = "Tab 2", labelClassName = "text-success"),
     ]),
 ]);
diff --git a/docs/components_page/components/tabs/style.py b/docs/components_page/components/tabs/style.py
index 723a8558f..c8d17abe9 100644
--- a/docs/components_page/components/tabs/style.py
+++ b/docs/components_page/components/tabs/style.py
@@ -12,8 +12,8 @@
         html.Br(),
         dbc.Tabs(
             [
-                dbc.Tab(label="Tab 1", tab_class_name="ms-auto"),
-                dbc.Tab(label="Tab 2", label_class_name="text-success"),
+                dbc.Tab(label="Tab 1", tabClassName="ms-auto"),
+                dbc.Tab(label="Tab 2", labelClassName="text-success"),
             ]
         ),
     ]
diff --git a/docs/components_page/components/toast.md b/docs/components_page/components/toast.md
index 98972776f..00e638203 100644
--- a/docs/components_page/components/toast.md
+++ b/docs/components_page/components/toast.md
@@ -25,7 +25,7 @@ You can have your `Toast` components dismiss themselves by using the `duration`
 
 ## Positioning
 
-Toasts can be placed using CSS. If positioning a single toast you can use the `style` and `class_name` arguments to place it. If you will display multiple notifications consider wrapping them in a container and positioning the container so that the notifications stack properly.
+Toasts can be placed using CSS. If positioning a single toast you can use the `style` and `className` arguments to place it. If you will display multiple notifications consider wrapping them in a container and positioning the container so that the notifications stack properly.
 
 {{example:components/toast/position.py:toast}}
 
diff --git a/docs/components_page/components/toast/auto_dismiss.R b/docs/components_page/components/toast/auto_dismiss.R
index d7c677e55..6daaede56 100644
--- a/docs/components_page/components/toast/auto_dismiss.R
+++ b/docs/components_page/components/toast/auto_dismiss.R
@@ -8,10 +8,10 @@ toast <- htmlDiv(
       id = "auto-toast-toggle",
       color = "primary",
       n_clicks = 0,
-      class_name = "mb-3",
+      className = "mb-3",
     ),
     dbcToast(
-      list(htmlP("This is the content of the toast", class_name = "mb-0")),
+      list(htmlP("This is the content of the toast", className = "mb-0")),
       id = "auto-toast",
       header = "This is the header",
       icon = "primary",
diff --git a/docs/components_page/components/toast/auto_dismiss.jl b/docs/components_page/components/toast/auto_dismiss.jl
index c141b641d..03edc195f 100644
--- a/docs/components_page/components/toast/auto_dismiss.jl
+++ b/docs/components_page/components/toast/auto_dismiss.jl
@@ -5,11 +5,11 @@ toast = html_div([
         "Open toast",
         id = "auto-toast-toggle",
         color = "primary",
-        class_name = "mb-3",
+        className = "mb-3",
         n_clicks = 0,
     ),
     dbc_toast(
-        [html_p("This is the content of the toast", class_name = "mb-0")],
+        [html_p("This is the content of the toast", className = "mb-0")],
         id = "auto-toast",
         header = "This is the header",
         icon = "primary",
diff --git a/docs/components_page/components/toast/auto_dismiss.py b/docs/components_page/components/toast/auto_dismiss.py
index 4767d1e50..4f560acd6 100644
--- a/docs/components_page/components/toast/auto_dismiss.py
+++ b/docs/components_page/components/toast/auto_dismiss.py
@@ -7,11 +7,11 @@
             "Open toast",
             id="auto-toast-toggle",
             color="primary",
-            class_name="mb-3",
+            className="mb-3",
             n_clicks=0,
         ),
         dbc.Toast(
-            [html.P("This is the content of the toast", class_name="mb-0")],
+            [html.P("This is the content of the toast", className="mb-0")],
             id="auto-toast",
             header="This is the header",
             icon="primary",
diff --git a/docs/components_page/components/toast/icon_dismiss.R b/docs/components_page/components/toast/icon_dismiss.R
index ba0f15431..4ec3fedce 100644
--- a/docs/components_page/components/toast/icon_dismiss.R
+++ b/docs/components_page/components/toast/icon_dismiss.R
@@ -8,10 +8,10 @@ toast <- htmlDiv(
       id = "simple-toast-toggle",
       color = "primary",
       n_clicks = 0,
-      class_name = "mb-3",
+      className = "mb-3",
     ),
     dbcToast(
-      list(htmlP("This is the content of the toast", class_name = "mb-0")),
+      list(htmlP("This is the content of the toast", className = "mb-0")),
       id = "simple-toast",
       header = "This is the header",
       icon = "primary",
diff --git a/docs/components_page/components/toast/icon_dismiss.jl b/docs/components_page/components/toast/icon_dismiss.jl
index ba62557c4..8be51879f 100644
--- a/docs/components_page/components/toast/icon_dismiss.jl
+++ b/docs/components_page/components/toast/icon_dismiss.jl
@@ -5,11 +5,11 @@ toast = html_div([
         "Open toast",
         id = "simple-toast-toggle",
         color = "primary",
-        class_name = "mb-3",
+        className = "mb-3",
         n_clicks = 0,
     ),
     dbc_toast(
-        [html_p("This is the content of the toast", class_name = "mb-0")],
+        [html_p("This is the content of the toast", className = "mb-0")],
         id = "simple-toast",
         header = "This is the header",
         icon = "primary",
diff --git a/docs/components_page/components/toast/icon_dismiss.py b/docs/components_page/components/toast/icon_dismiss.py
index ee910415c..db2df7763 100644
--- a/docs/components_page/components/toast/icon_dismiss.py
+++ b/docs/components_page/components/toast/icon_dismiss.py
@@ -7,11 +7,11 @@
             "Open toast",
             id="simple-toast-toggle",
             color="primary",
-            class_name="mb-3",
+            className="mb-3",
             n_clicks=0,
         ),
         dbc.Toast(
-            [html.P("This is the content of the toast", class_name="mb-0")],
+            [html.P("This is the content of the toast", className="mb-0")],
             id="simple-toast",
             header="This is the header",
             icon="primary",
diff --git a/docs/components_page/components/toast/simple.R b/docs/components_page/components/toast/simple.R
index 4e1a39858..bbdba0599 100644
--- a/docs/components_page/components/toast/simple.R
+++ b/docs/components_page/components/toast/simple.R
@@ -3,7 +3,7 @@ library(dashHtmlComponents)
 
 toast <- dbcToast(
   list(
-    htmlP("This is the content of the toast", class_name = "mb-0")
+    htmlP("This is the content of the toast", className = "mb-0")
   ),
   header = "This is the header",
 )
diff --git a/docs/components_page/components/toast/simple.jl b/docs/components_page/components/toast/simple.jl
index d950c36b2..f1969c81c 100644
--- a/docs/components_page/components/toast/simple.jl
+++ b/docs/components_page/components/toast/simple.jl
@@ -1,6 +1,6 @@
 using DashBootstrapComponents, DashHtmlComponents
 
 toast = dbc_toast(
-    [html_p("This is the content of the toast", class_name = "mb-0")],
+    [html_p("This is the content of the toast", className = "mb-0")],
     header = "This is the header",
 );
diff --git a/docs/components_page/components/toast/simple.py b/docs/components_page/components/toast/simple.py
index a0761868b..79f490b60 100644
--- a/docs/components_page/components/toast/simple.py
+++ b/docs/components_page/components/toast/simple.py
@@ -2,6 +2,6 @@
 from dash import html
 
 toast = dbc.Toast(
-    [html.P("This is the content of the toast", class_name="mb-0")],
+    [html.P("This is the content of the toast", className="mb-0")],
     header="This is the header",
 )
diff --git a/docs/components_page/components/tooltip/placement.R b/docs/components_page/components/tooltip/placement.R
index ac1e1140c..0d8113e09 100644
--- a/docs/components_page/components/tooltip/placement.R
+++ b/docs/components_page/components/tooltip/placement.R
@@ -7,7 +7,7 @@ make_button <- function(placement) {
       sprintf("Tooltip on %s", placement),
       id = sprintf("tooltip-target-%s", placement),
       n_clicks = 0,
-      class_name = "mx-2"
+      className = "mx-2"
     )
   )
 }
diff --git a/docs/components_page/components/tooltip/placement.jl b/docs/components_page/components/tooltip/placement.jl
index 1fc760c31..45fb627e8 100644
--- a/docs/components_page/components/tooltip/placement.jl
+++ b/docs/components_page/components/tooltip/placement.jl
@@ -5,7 +5,7 @@ function make_button(placement)
     return dbc_button(
         "Tooltip on $placement",
         id = "tooltip-target-$placement",
-        class_name = "mx-2",
+        className = "mx-2",
         n_clicks = 0,
     )
 end;
diff --git a/docs/components_page/components/tooltip/placement.py b/docs/components_page/components/tooltip/placement.py
index f48422b03..6a8164601 100644
--- a/docs/components_page/components/tooltip/placement.py
+++ b/docs/components_page/components/tooltip/placement.py
@@ -6,7 +6,7 @@ def make_button(placement):
     return dbc.Button(
         f"Tooltip on {placement}",
         id=f"tooltip-target-{placement}",
-        class_name="mx-2",
+        className="mx-2",
         n_clicks=0,
     )
 
diff --git a/docs/components_page/helpers.py b/docs/components_page/helpers.py
index f3bbb9bf6..4241bf025 100644
--- a/docs/components_page/helpers.py
+++ b/docs/components_page/helpers.py
@@ -6,9 +6,9 @@ def HighlightedSource(py_source, r_source, jl_source):
     return dbc.Tabs(
         [
             dbc.Tab(
-                dcc.Markdown(f"```{lang}\n{source}\n```", class_name="m-3"),
+                dcc.Markdown(f"```{lang}\n{source}\n```", className="m-3"),
                 label=lang.capitalize(),
-                class_name="example-source",
+                className="example-source",
             )
             for lang, source in [
                 ("python", py_source),
@@ -17,17 +17,17 @@ def HighlightedSource(py_source, r_source, jl_source):
             ]
             if source is not None
         ],
-        class_name="px-3",
+        className="px-3",
     )
 
 
 def ExampleContainer(component, py_source, r_source, jl_source):
     return html.Div(
         [
-            html.Div(component, class_name="example"),
+            html.Div(component, className="example"),
             HighlightedSource(py_source, r_source, jl_source),
         ],
-        class_name="example-container",
+        className="example-container",
     )
 
 
diff --git a/docs/content/changelog.md b/docs/content/changelog.md
index 6879f406b..d35384dd7 100644
--- a/docs/content/changelog.md
+++ b/docs/content/changelog.md
@@ -77,7 +77,7 @@ This version marks the first release of dash-bootstrap-components for Julia. The
 ### Added
 
 - The `NavLink` component can now automatically set the `active` prop based on the current pathname. Set `active="exact"` to toggle set `active=True` if the `href` exactly matches the current pathname, or `active="partial"` to set `active=True` if the current pathname starts with `href` ([PR 482](https://github.com/facultyai/dash-bootstrap-components/pull/482))
-- `active_tab_style` and `active_tab_class_name` props to `Tab` for styling active tabs ([PR 491](https://github.com/facultyai/dash-bootstrap-components/pull/491))
+- `active_tab_style` and `activeTabClassName` props to `Tab` for styling active tabs ([PR 491](https://github.com/facultyai/dash-bootstrap-components/pull/491))
 - Exposed `name` prop on input components so that they can be used more effectively in form submissions, and `action` and `method` props of `Form` so that `Form` can be used to post form submissions to a route on the backend ([PR 474](https://github.com/facultyai/dash-bootstrap-components/pull/474))
 - Exposes `type` prop on `Button` ([PR 470](https://github.com/facultyai/dash-bootstrap-components/pull/470))
 
@@ -167,7 +167,7 @@ This version marks the first release of dash-bootstrap-components for Julia. The
 
 ### Changed
 
-- Removed `style` and `class_name` arguments from `Spinner`, replaced with `spinner_style` and `spinner_class_name`. Also added `fullscreen_style` and `fullscreen_class_name` for controlling the style of fullscreen spinners. ([PR 344](https://github.com/facultyai/dash-bootstrap-components/pull/366))
+- Removed `style` and `class_name` arguments from `Spinner`, replaced with `spinner_style` and `spinnerClassName`. Also added `fullscreen_style` and `fullscreenClassName` for controlling the style of fullscreen spinners. ([PR 344](https://github.com/facultyai/dash-bootstrap-components/pull/366))
 
 ## 0.9.2 - 2020/4/5
 
@@ -267,7 +267,7 @@ This version marks the first release of dash-bootstrap-components for Julia. The
 
 ### Added
 
-- Expose `color`, `toggle_style` and `toggle_class_name` props in `DropdownMenu` component ([PR 221](https://github.com/facultyai/dash-bootstrap-components/pull/221))
+- Expose `color`, `toggle_style` and `toggleClassName` props in `DropdownMenu` component ([PR 221](https://github.com/facultyai/dash-bootstrap-components/pull/221))
 
 ## 0.6.2 - 2019/6/5
 
diff --git a/docs/run.py b/docs/run.py
index ee23bba59..a4a8cf7e9 100644
--- a/docs/run.py
+++ b/docs/run.py
@@ -1,39 +1,5 @@
-from dash import dcc, html
 from werkzeug.middleware.dispatcher import DispatcherMiddleware
 
-
-# TODO: delete once Dash 2.0 is released
-def class_name_shim(fn):
-    def new_init(self, *args, **kwargs):
-        kwargs["className"] = kwargs.get("class_name", kwargs.get("className"))
-        return fn(
-            self,
-            *args,
-            **{k: v for k, v in kwargs.items() if k != "class_name"}
-        )
-
-    return new_init
-
-
-for component in [
-    dcc.Markdown,
-    html.A,
-    html.Blockquote,
-    html.Div,
-    html.H1,
-    html.H2,
-    html.H3,
-    html.H4,
-    html.H5,
-    html.H6,
-    html.Hr,
-    html.I,
-    html.P,
-    html.Small,
-]:
-    component.__init__ = class_name_shim(component.__init__)
-
-
 from components_page import register_apps as register_component_apps  # noqa
 from demos import register_apps as register_demo_apps  # noqa
 from examples import register_apps as register_example_apps  # noqa
diff --git a/examples/python/advanced-component-usage/graphs_in_tabs.py b/examples/python/advanced-component-usage/graphs_in_tabs.py
index 1d4634292..b1bcb1cb1 100644
--- a/examples/python/advanced-component-usage/graphs_in_tabs.py
+++ b/examples/python/advanced-component-usage/graphs_in_tabs.py
@@ -23,7 +23,7 @@
             "Regenerate graphs",
             color="primary",
             id="button",
-            class_name="mb-3",
+            className="mb-3",
         ),
         dbc.Tabs(
             [
@@ -33,7 +33,7 @@
             id="tabs",
             active_tab="scatter",
         ),
-        html.Div(id="tab-content", class_name="p-4"),
+        html.Div(id="tab-content", className="p-4"),
     ]
 )
 
diff --git a/examples/python/advanced-component-usage/navbars.py b/examples/python/advanced-component-usage/navbars.py
index 4684e151e..2c94b75d3 100644
--- a/examples/python/advanced-component-usage/navbars.py
+++ b/examples/python/advanced-component-usage/navbars.py
@@ -38,7 +38,7 @@
     brand="Default",
     brand_href="#",
     sticky="top",
-    class_name="mb-5",
+    className="mb-5",
 )
 
 # here's how you can recreate the same thing using Navbar
@@ -50,14 +50,14 @@
             dbc.NavbarToggler(id="navbar-toggler1"),
             dbc.Collapse(
                 dbc.Nav(
-                    [nav_item, dropdown], class_name="ms-auto", navbar=True
+                    [nav_item, dropdown], className="ms-auto", navbar=True
                 ),
                 id="navbar-collapse1",
                 navbar=True,
             ),
         ]
     ),
-    class_name="mb-5",
+    className="mb-5",
 )
 
 
@@ -70,10 +70,10 @@
                 dbc.Row(
                     [
                         dbc.Col(html.Img(src=PLOTLY_LOGO, height="30px")),
-                        dbc.Col(dbc.NavbarBrand("Logo", class_name="ms-2")),
+                        dbc.Col(dbc.NavbarBrand("Logo", className="ms-2")),
                     ],
                     align="center",
-                    class_name="g-0",
+                    className="g-0",
                 ),
                 href="https://plotly.com",
                 style={"textDecoration": "none"},
@@ -82,7 +82,7 @@
             dbc.Collapse(
                 dbc.Nav(
                     [nav_item, dropdown],
-                    class_name="ms-auto",
+                    className="ms-auto",
                     navbar=True,
                 ),
                 id="navbar-collapse2",
@@ -92,7 +92,7 @@
     ),
     color="dark",
     dark=True,
-    class_name="mb-5",
+    className="mb-5",
 )
 
 # this example has a search bar and button instead of navitems / dropdowns
@@ -109,7 +109,7 @@
                         ),
                         dbc.Col(
                             dbc.Button(
-                                "Search", color="primary", class_name="ms-2"
+                                "Search", color="primary", className="ms-2"
                             ),
                             # set width of button column to auto to allow
                             # search box to take up remaining space.
@@ -121,7 +121,7 @@
                     # larger screens (mt-md-0) when the navbar is expanded.
                     # keep button and search box on same row (flex-nowrap).
                     # align everything on the right with left margin (ms-auto).
-                    class_name="g-0 ms-auto flex-nowrap mt-3 mt-md-0",
+                    className="g-0 ms-auto flex-nowrap mt-3 mt-md-0",
                     align="center",
                 ),
                 id="navbar-collapse3",
@@ -129,7 +129,7 @@
             ),
         ]
     ),
-    class_name="mb-5",
+    className="mb-5",
 )
 
 # custom navbar based on https://getbootstrap.com/docs/4.1/examples/dashboard/
diff --git a/examples/python/gallery/telephones-by-region/app.py b/examples/python/gallery/telephones-by-region/app.py
index e8dbf2f3f..8378dc84e 100644
--- a/examples/python/gallery/telephones-by-region/app.py
+++ b/examples/python/gallery/telephones-by-region/app.py
@@ -32,7 +32,7 @@
         html.Hr(),
         html.P(
             "Data from AT&T (1961) The World's Telephones.",
-            class_name="text-muted",
+            className="text-muted",
         ),
     ],
     body=True,
diff --git a/examples/python/gallery/wordcloud/app.py b/examples/python/gallery/wordcloud/app.py
index fb3e8742c..2eeb8acef 100644
--- a/examples/python/gallery/wordcloud/app.py
+++ b/examples/python/gallery/wordcloud/app.py
@@ -53,7 +53,7 @@ def load_word_frequencies(book):
         value=15,
         marks={1: "1", **{i: str(i) for i in range(5, 51, 5)}},
     ),
-    class_name="p-3 mb-2",
+    className="p-3 mb-2",
 )
 
 max_vocab_slider = html.Div(
@@ -65,7 +65,7 @@ def load_word_frequencies(book):
         value=100,
         marks={1: "1", **{i: str(i) for i in range(30, 301, 30)}},
     ),
-    class_name="p-3",
+    className="p-3",
 )
 
 controls = dbc.Card(
@@ -74,7 +74,7 @@ def load_word_frequencies(book):
         html.Div([dbc.Label("Minimum frequency:"), min_freq_slider]),
         html.Div([dbc.Label("Maximum number of words:"), max_vocab_slider]),
     ],
-    class_name="mb-3",
+    className="mb-3",
     body=True,
 )
 
diff --git a/examples/python/templates/multi-page-apps/collapsible-sidebar-with-icons/app.py b/examples/python/templates/multi-page-apps/collapsible-sidebar-with-icons/app.py
index 4bd8708ff..16414875f 100644
--- a/examples/python/templates/multi-page-apps/collapsible-sidebar-with-icons/app.py
+++ b/examples/python/templates/multi-page-apps/collapsible-sidebar-with-icons/app.py
@@ -30,19 +30,19 @@
                 html.Img(src=PLOTLY_LOGO, style={"width": "3rem"}),
                 html.H2("Sidebar"),
             ],
-            class_name="sidebar-header",
+            className="sidebar-header",
         ),
         html.Hr(),
         dbc.Nav(
             [
                 dbc.NavLink(
-                    [html.I(class_name="fas fa-home me-2"), html.Span("Home")],
+                    [html.I(className="fas fa-home me-2"), html.Span("Home")],
                     href="/",
                     active="exact",
                 ),
                 dbc.NavLink(
                     [
-                        html.I(class_name="fas fa-calendar-alt me-2"),
+                        html.I(className="fas fa-calendar-alt me-2"),
                         html.Span("Calendar"),
                     ],
                     href="/calendar",
@@ -50,7 +50,7 @@
                 ),
                 dbc.NavLink(
                     [
-                        html.I(class_name="fas fa-envelope-open-text me-2"),
+                        html.I(className="fas fa-envelope-open-text me-2"),
                         html.Span("Messages"),
                     ],
                     href="/messages",
@@ -61,10 +61,10 @@
             pills=True,
         ),
     ],
-    class_name="sidebar",
+    className="sidebar",
 )
 
-content = html.Div(id="page-content", class_name="content")
+content = html.Div(id="page-content", className="content")
 
 app.layout = html.Div([dcc.Location(id="url"), sidebar, content])
 
@@ -81,7 +81,7 @@ def render_page_content(pathname):
     # If the user tries to reach a different page, return a 404 message
     return dbc.Jumbotron(
         [
-            html.H1("404: Not found", class_name="text-danger"),
+            html.H1("404: Not found", className="text-danger"),
             html.Hr(),
             html.P(f"The pathname {pathname} was not recognised..."),
         ]
diff --git a/examples/python/templates/multi-page-apps/navbar.py b/examples/python/templates/multi-page-apps/navbar.py
index 446149de4..349b6a2eb 100644
--- a/examples/python/templates/multi-page-apps/navbar.py
+++ b/examples/python/templates/multi-page-apps/navbar.py
@@ -28,7 +28,7 @@
             color="primary",
             dark=True,
         ),
-        dbc.Container(id="page-content", class_name="pt-4"),
+        dbc.Container(id="page-content", className="pt-4"),
     ]
 )
 
@@ -44,7 +44,7 @@ def render_page_content(pathname):
     # If the user tries to reach a different page, return a 404 message
     return dbc.Jumbotron(
         [
-            html.H1("404: Not found", class_name="text-danger"),
+            html.H1("404: Not found", className="text-danger"),
             html.Hr(),
             html.P(f"The pathname {pathname} was not recognised..."),
         ]
diff --git a/examples/python/templates/multi-page-apps/responsive-collapsible-sidebar/sidebar.py b/examples/python/templates/multi-page-apps/responsive-collapsible-sidebar/sidebar.py
index 674b196a4..e693ed24a 100644
--- a/examples/python/templates/multi-page-apps/responsive-collapsible-sidebar/sidebar.py
+++ b/examples/python/templates/multi-page-apps/responsive-collapsible-sidebar/sidebar.py
@@ -32,13 +32,13 @@
 # it consists of a title, and a toggle, the latter is hidden on large screens
 sidebar_header = dbc.Row(
     [
-        dbc.Col(html.H2("Sidebar", class_name="display-4")),
+        dbc.Col(html.H2("Sidebar", className="display-4")),
         dbc.Col(
             [
                 html.Button(
                     # use the Bootstrap navbar-toggler classes to style
-                    html.Span(class_name="navbar-toggler-icon"),
-                    class_name="navbar-toggler",
+                    html.Span(className="navbar-toggler-icon"),
+                    className="navbar-toggler",
                     # the navbar-toggler classes don't set color
                     style={
                         "color": "rgba(0,0,0,.5)",
@@ -48,8 +48,8 @@
                 ),
                 html.Button(
                     # use the Bootstrap navbar-toggler classes to style
-                    html.Span(class_name="navbar-toggler-icon"),
-                    class_name="navbar-toggler",
+                    html.Span(className="navbar-toggler-icon"),
+                    className="navbar-toggler",
                     # the navbar-toggler classes don't set color
                     style={
                         "color": "rgba(0,0,0,.5)",
@@ -78,7 +78,7 @@
                 html.P(
                     "A responsive sidebar layout with collapsible navigation "
                     "links.",
-                    class_name="lead",
+                    className="lead",
                 ),
             ],
             id="blurb",
@@ -116,7 +116,7 @@ def render_page_content(pathname):
     # If the user tries to reach a different page, return a 404 message
     return dbc.Jumbotron(
         [
-            html.H1("404: Not found", class_name="text-danger"),
+            html.H1("404: Not found", className="text-danger"),
             html.Hr(),
             html.P(f"The pathname {pathname} was not recognised..."),
         ]
@@ -124,9 +124,9 @@ def render_page_content(pathname):
 
 
 @app.callback(
-    Output("sidebar", "class_name"),
+    Output("sidebar", "className"),
     [Input("sidebar-toggle", "n_clicks")],
-    [State("sidebar", "class_name")],
+    [State("sidebar", "className")],
 )
 def toggle_classname(n, classname):
     if n and classname == "":
diff --git a/examples/python/templates/multi-page-apps/responsive-sidebar/sidebar.py b/examples/python/templates/multi-page-apps/responsive-sidebar/sidebar.py
index 27f9d14c7..39aeb98da 100644
--- a/examples/python/templates/multi-page-apps/responsive-sidebar/sidebar.py
+++ b/examples/python/templates/multi-page-apps/responsive-sidebar/sidebar.py
@@ -32,12 +32,12 @@
 # it consists of a title, and a toggle, the latter is hidden on large screens
 sidebar_header = dbc.Row(
     [
-        dbc.Col(html.H2("Sidebar", class_name="display-4")),
+        dbc.Col(html.H2("Sidebar", className="display-4")),
         dbc.Col(
             html.Button(
                 # use the Bootstrap navbar-toggler classes to style the toggle
-                html.Span(class_name="navbar-toggler-icon"),
-                class_name="navbar-toggler",
+                html.Span(className="navbar-toggler-icon"),
+                className="navbar-toggler",
                 # the navbar-toggler classes don't set color, so we do it here
                 style={
                     "color": "rgba(0,0,0,.5)",
@@ -65,7 +65,7 @@
                 html.P(
                     "A responsive sidebar layout with collapsible navigation "
                     "links.",
-                    class_name="lead",
+                    className="lead",
                 ),
             ],
             id="blurb",
@@ -103,7 +103,7 @@ def render_page_content(pathname):
     # If the user tries to reach a different page, return a 404 message
     return dbc.Jumbotron(
         [
-            html.H1("404: Not found", class_name="text-danger"),
+            html.H1("404: Not found", className="text-danger"),
             html.Hr(),
             html.P(f"The pathname {pathname} was not recognised..."),
         ]
diff --git a/examples/python/templates/multi-page-apps/sidebar-with-submenus/sidebar.py b/examples/python/templates/multi-page-apps/sidebar-with-submenus/sidebar.py
index 6f157a3c7..7d01f10ef 100644
--- a/examples/python/templates/multi-page-apps/sidebar-with-submenus/sidebar.py
+++ b/examples/python/templates/multi-page-apps/sidebar-with-submenus/sidebar.py
@@ -45,11 +45,11 @@
             [
                 dbc.Col("Menu 1"),
                 dbc.Col(
-                    html.I(class_name="fas fa-chevron-right me-3"),
+                    html.I(className="fas fa-chevron-right me-3"),
                     width="auto",
                 ),
             ],
-            class_name="my-1",
+            className="my-1",
         ),
         style={"cursor": "pointer"},
         id="submenu-1",
@@ -70,11 +70,11 @@
             [
                 dbc.Col("Menu 2"),
                 dbc.Col(
-                    html.I(class_name="fas fa-chevron-right me-3"),
+                    html.I(className="fas fa-chevron-right me-3"),
                     width="auto",
                 ),
             ],
-            class_name="my-1",
+            className="my-1",
         ),
         style={"cursor": "pointer"},
         id="submenu-2",
@@ -91,10 +91,10 @@
 
 sidebar = html.Div(
     [
-        html.H2("Sidebar", class_name="display-4"),
+        html.H2("Sidebar", className="display-4"),
         html.Hr(),
         html.P(
-            "A sidebar with collapsible navigation links", class_name="lead"
+            "A sidebar with collapsible navigation links", className="lead"
         ),
         dbc.Nav(submenu_1 + submenu_2, vertical=True),
     ],
@@ -129,7 +129,7 @@ def set_navitem_class(is_open):
     )(toggle_collapse)
 
     app.callback(
-        Output(f"submenu-{i}", "class_name"),
+        Output(f"submenu-{i}", "className"),
         [Input(f"submenu-{i}-collapse", "is_open")],
     )(set_navitem_class)
 
@@ -147,7 +147,7 @@ def render_page_content(pathname):
     # If the user tries to reach a different page, return a 404 message
     return dbc.Jumbotron(
         [
-            html.H1("404: Not found", class_name="text-danger"),
+            html.H1("404: Not found", className="text-danger"),
             html.Hr(),
             html.P(f"The pathname {pathname} was not recognised..."),
         ]
diff --git a/examples/python/templates/multi-page-apps/simple_sidebar.py b/examples/python/templates/multi-page-apps/simple_sidebar.py
index 8424235bb..8ca8daf7f 100644
--- a/examples/python/templates/multi-page-apps/simple_sidebar.py
+++ b/examples/python/templates/multi-page-apps/simple_sidebar.py
@@ -37,10 +37,10 @@
 
 sidebar = html.Div(
     [
-        html.H2("Sidebar", class_name="display-4"),
+        html.H2("Sidebar", className="display-4"),
         html.Hr(),
         html.P(
-            "A simple sidebar layout with navigation links", class_name="lead"
+            "A simple sidebar layout with navigation links", className="lead"
         ),
         dbc.Nav(
             [
@@ -71,7 +71,7 @@ def render_page_content(pathname):
     # If the user tries to reach a different page, return a 404 message
     return dbc.Jumbotron(
         [
-            html.H1("404: Not found", class_name="text-danger"),
+            html.H1("404: Not found", className="text-danger"),
             html.Hr(),
             html.P(f"The pathname {pathname} was not recognised..."),
         ]
diff --git a/tasks.py b/tasks.py
index e67799f98..9e7ec94df 100644
--- a/tasks.py
+++ b/tasks.py
@@ -342,7 +342,8 @@ def format_r_jl(_):
         try:
             info("Formatting R with styler")
             run(
-                "Rscript -e 'library(styler); style_dir(\"docs\")'",
+                'Rscript -e \'library(styler); style_dir("docs"); '
+                'style_dir("examples")\'',
                 exit_on_error=False,
             )
         except RuntimeError:
@@ -354,7 +355,8 @@ def format_r_jl(_):
         try:
             info("Formatting Julia with JuliaFormatter")
             run(
-                "julia -e 'using JuliaFormatter; format(\"docs\")'",
+                'julia -e \'using JuliaFormatter; format("docs"); '
+                'format("examples");\'',
                 exit_on_error=False,
             )
         except RuntimeError:
diff --git a/tests/test_alert.py b/tests/test_alert.py
index 4ea4ac231..8a18f45f6 100644
--- a/tests/test_alert.py
+++ b/tests/test_alert.py
@@ -1,12 +1,11 @@
-from dash import Dash
+from dash import Dash, html
 from dash_bootstrap_components import Alert
-from dash.html import Div
 
 
 def test_dbal001_alert_content(dash_duo):
     app = Dash()
 
-    app.layout = Div([Alert("Test content", id="alert")])
+    app.layout = html.Div([Alert("Test content", id="alert")])
 
     dash_duo.start_server(app)
 
diff --git a/tests/test_navlink.py b/tests/test_navlink.py
index 20faba00c..7de275884 100644
--- a/tests/test_navlink.py
+++ b/tests/test_navlink.py
@@ -1,8 +1,7 @@
 from dash import Dash
 from dash.dependencies import Input, Output
 from dash_bootstrap_components import NavLink
-from dash.dcc import Location
-from dash.html import Div
+from dash import dcc, html
 from selenium.webdriver.support.wait import WebDriverWait
 
 
@@ -13,10 +12,10 @@ def test_dbnl001_auto_active(dash_duo):
     """
     app = Dash()
 
-    app.layout = Div(
+    app.layout = html.Div(
         [
-            # Location is required to fire events to History
-            Location(id="url"),
+            # dcc.Location is required to fire events to History
+            dcc.Location(id="url"),
             NavLink("Page 1", id="page-1-link", href="/page-1", active=True),
             NavLink("Page 2", id="page-2-link", href="/page-2", active=False),
             NavLink(
@@ -28,7 +27,7 @@ def test_dbnl001_auto_active(dash_duo):
                 href="/page-3/extra",
                 active="exact",
             ),
-            Div(id="content"),
+            html.Div(id="content"),
         ]
     )
 
@@ -84,14 +83,14 @@ def test_dbnl_002_manual_active(dash_duo):
     """
     app = Dash()
 
-    app.layout = Div(
+    app.layout = html.Div(
         [
-            # Location is required to fire events to History
-            Location(id="url"),
+            # dcc.Location is required to fire events to History
+            dcc.Location(id="url"),
             NavLink("Page 1", id="page-1-link", href="/page-1"),
             NavLink("Page 2", id="page-2-link", href="/page-2"),
             NavLink("Page 3", id="page-3-link", href="/page-3"),
-            Div(id="content"),
+            html.Div(id="content"),
         ]
     )