diff --git a/CHANGES.rst b/CHANGES.rst
index 9e02600..f1b3e8f 100644
--- a/CHANGES.rst
+++ b/CHANGES.rst
@@ -1,9 +1,9 @@
Changelog
=========
+- Reduced icon whitespace and support for classes.
- Upgrade to Bootstrap Icons 1.11.3.
-
2.4.1
-----
diff --git a/docs/macros.rst b/docs/macros.rst
index 83bee9b..ed78946 100644
--- a/docs/macros.rst
+++ b/docs/macros.rst
@@ -621,7 +621,7 @@ Example
API
~~~~
-.. py:function:: render_icon(name, size=config.BOOTSTRAP_ICON_SIZE, color=config.BOOTSTRAP_ICON_COLOR, title=None, desc=None)
+.. py:function:: render_icon(name, size=config.BOOTSTRAP_ICON_SIZE, color=config.BOOTSTRAP_ICON_COLOR, title=None, desc=None, classes=None)
:param name: The name of icon, you can find all available names at `Bootstrap Icon
{% raw %}{{ render_icon('heart', '2em', 'red') }}{% endraw %}
Output: {{ render_icon('heart', '2em', 'red') }}
+{% raw %}{{ render_icon('heart', '2em', classes='text-success bg-light p-2 rounded-lg') }}{% endraw %}
+Output: {{ render_icon('heart', '4em', classes='text-success bg-light p-2 rounded-lg') }}
+
{% raw %}{{ render_icon('heart', title='Heart', desc='A heart.') }}{% endraw %}
Output: {{ render_icon('heart', title='Heart', desc='A heart.') }}
diff --git a/examples/bootstrap5/templates/icon.html b/examples/bootstrap5/templates/icon.html
index 3457a94..caf9137 100644
--- a/examples/bootstrap5/templates/icon.html
+++ b/examples/bootstrap5/templates/icon.html
@@ -18,6 +18,10 @@ {% raw %}{{ render_icon('heart', '2em', 'red') }}{% endraw %}
Output: {{ render_icon('heart', '2em', 'red') }}
+{% raw %}{{ render_icon('heart', '2em', classes='text-success bg-body-secondary p-2 rounded-3') }}{% endraw %}
+Output: {{ render_icon('heart', '4em', classes='text-success bg-body-secondary p-2 rounded-3') }}
+
{% raw %}{{ render_icon('heart', title='Heart', desc='A heart.') }}{% endraw %}
Output: {{ render_icon('heart', title='Heart', desc='A heart.') }}
diff --git a/flask_bootstrap/templates/base/utils.html b/flask_bootstrap/templates/base/utils.html
index 014bc50..f901223 100644
--- a/flask_bootstrap/templates/base/utils.html
+++ b/flask_bootstrap/templates/base/utils.html
@@ -10,15 +10,15 @@
{% endmacro %}
-{% macro render_icon(name, size=config.BOOTSTRAP_ICON_SIZE, color=config.BOOTSTRAP_ICON_COLOR, title=None, desc=None) %}
-{% set bootstrap_colors = ['primary', 'secondary', 'success', 'danger', 'warning', 'info', 'light', 'dark', 'muted'] %}
-
-{% endmacro %}
+{% macro render_icon(name, size=config.BOOTSTRAP_ICON_SIZE, color=config.BOOTSTRAP_ICON_COLOR, title=None, desc=None, classes=None) %}
+{%- set bootstrap_colors = ['primary', 'secondary', 'success', 'danger', 'warning', 'info', 'light', 'dark', 'muted'] -%}
+
+{%- endmacro %}
{% macro arg_url_for(endpoint, base) %}
diff --git a/tests/test_bootstrap4/test_render_icon.py b/tests/test_bootstrap4/test_render_icon.py
index 4f9d11c..afea9bb 100644
--- a/tests/test_bootstrap4/test_render_icon.py
+++ b/tests/test_bootstrap4/test_render_icon.py
@@ -37,11 +37,11 @@ def icon_title():
{{ render_icon('heart', title='Heart') }}
''')
- @app.route('/icon-desc')
- def icon_desc():
+ @app.route('/icon-desc-classes')
+ def icon_desc_classes():
return render_template_string('''
{% from 'bootstrap4/utils.html' import render_icon %}
- {{ render_icon('heart', desc='A heart.') }}
+ {{ render_icon('heart', desc='A heart.', classes='text-success bg-light') }}
''')
response = client.get('/icon')
@@ -71,10 +71,11 @@ def icon_desc():
assert 'bootstrap-icons.svg#heart' in data
assert '