Update doc

Author: StevenRenaux

src/Icons/doc/index.rst

@@ -112,22 +112,31 @@ the size of all your icons from a single place.
 Icon Color
 ~~~~~~~~~~
 
-By default, SVG icons rendered by UX Icons use ``fill="currentColor"``.
-You can change the icon color in several ways:
+UX Icons renders SVG icons with fill="currentColor" (see the `default configuration`_).
 
-You can use the CSS color property to modify your icon through a CSS class.
+This means icons take their color from the CSS color property, which by default is inherited from the text color of
+the parent element.
 
-.. code-block:: twig
+.. code-block:: html+twig
 
-    {{ ux_icon('user-profile', {class: 'my_class'}) }}
+    <a href="#" class="text-blue-500">
+        {# icon color: blue #}
+        {{ ux_icon('bi:star') }}
+    </a>
 
-Or you can just as easily use the color attribute.
+You can set the icon’s color using CSS classes, either on the parent container or directly on the icon:
 
-.. code-block:: twig
+.. code-block:: html+twig
+
+    <div class="text-red-500">
+        {# Inherit color from container (red) #}
+        {{ ux_icon('warning') }}
 
-    {{ ux_icon('user-profile', {color: 'red'}) }}
+        {# Override parent with CSS class (blue) #}
+        {{ ux_icon('warning', { class: 'text-blue-500' }) }}
+    </div>
 
-Both will indirectly apply a potential value for currentColor.
+To configure a default class for all icons across your application see the `default configuration`_.
 
 Icon Sets
 ~~~~~~~~~
@@ -687,3 +696,4 @@ Learn more
 .. _`Tabler Icons`: https://github.com/tabler/tabler-icons
 .. _`Creating and Using Templates`: https://symfony.com/doc/current/templates.html
 .. _`How to manage CSS and JavaScript assets in Symfony applications`: https://symfony.com/doc/current/frontend.html
+.. _`default configuration`: https://symfony.com/bundles/ux-icons/current/index.html#full-configuration