diff --git a/.plugin-data b/.plugin-data
index fedae13..7610d70 100644
--- a/.plugin-data
+++ b/.plugin-data
@@ -1,4 +1,4 @@
 {
-	"version": "1.0.6",
+	"version": "1.0.7",
 	"slug": "blockparty-icons"
 }
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 89c4609..deb421b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -6,6 +6,10 @@ This plugin **doesn't run any sanitization on SVGs** before using them. Only use
 
 ## Changelog
 
+### 1.0.7 - 2026-05-26
+
+- Fix icon color with CSS custom properties
+
 ### 1.0.6 - 2026-05-18
 
 - Fix icon preview size styles
diff --git a/blockparty-icons.php b/blockparty-icons.php
index 728280a..c764679 100644
--- a/blockparty-icons.php
+++ b/blockparty-icons.php
@@ -4,7 +4,7 @@
  * Description:       Provides blocks in WordPress editor to add custom SVG icons.
  * Requires at least: 6.2
  * Requires PHP:      8.1
- * Version:           1.0.6
+ * Version:           1.0.7
  * Author:            Blockparty
  * Author URI:        https://beapi.fr
  * License:           GPL-2.0-or-later
@@ -29,7 +29,7 @@
 	include_once __DIR__ . '/vendor/autoload.php';
 }
 
-define( 'BLOCKPARTY_ICONS_VERSION', '1.0.6' );
+define( 'BLOCKPARTY_ICONS_VERSION', '1.0.7' );
 define( 'BLOCKPARTY_ICONS_URL', plugin_dir_url( __FILE__ ) );
 define( 'BLOCKPARTY_ICONS_DIR', plugin_dir_path( __FILE__ ) );
 define( 'BLOCKPARTY_ICONS_PLUGIN_BASENAME', plugin_basename( __FILE__ ) );
diff --git a/includes/BlockRenderer.php b/includes/BlockRenderer.php
index 52ee87e..a3ccf43 100644
--- a/includes/BlockRenderer.php
+++ b/includes/BlockRenderer.php
@@ -149,19 +149,59 @@ private static function prepare_svg_html_attributes( CollectionItem $icon, array
 		$css_style           = [];
 		$css_style['width']  = sprintf( '%spx', $size );
 		$css_style['height'] = sprintf( '%spx', $size );
-		if ( ! empty( $icon_color ) ) {
-			$css_style['fill'] = sanitize_hex_color( $icon_color );
+
+		$sanitized_icon_color = self::sanitize_icon_color( $icon_color );
+		if ( '' !== $sanitized_icon_color ) {
+			$css_style['fill']       = $sanitized_icon_color;
+			$html_attributes['fill'] = $sanitized_icon_color;
 		}
 
 		foreach ( $css_style as $property => $value ) {
 			$html_attributes['style'] .= sprintf( '%s: %s;', $property, $value );
 		}
 
-		// Custom attributes
-		if ( ! empty( $icon_color ) ) {
-			$html_attributes['fill'] = sanitize_hex_color( $icon_color );
+		return $html_attributes;
+	}
+
+	/**
+	 * Sanitize icon color value (hex, theme preset, or CSS custom property).
+	 *
+	 * @param string $color Raw color value from block attributes.
+	 *
+	 * @return string Sanitized color, or empty string when invalid.
+	 */
+	private static function sanitize_icon_color( string $color ): string {
+		$color = trim( $color );
+
+		if ( '' === $color ) {
+			return '';
 		}
 
-		return $html_attributes;
+		$hex_color = sanitize_hex_color( $color );
+		if ( $hex_color ) {
+			return $hex_color;
+		}
+
+		// Block editor theme preset format (e.g. var:preset|color|primary).
+		if ( preg_match( '/^var:preset\|color\|([a-z0-9_-]+)$/i', $color, $matches ) ) {
+			return sprintf(
+				'var(--wp--preset--color--%s)',
+				sanitize_key( $matches[1] )
+			);
+		}
+
+		// CSS custom property with optional hex fallback (e.g. var(--wp--preset--color--primary, #000)).
+		if ( preg_match( '/^var\(\s*(--[a-zA-Z0-9_-]+)\s*,\s*(#[0-9a-fA-F]{3,8})\s*\)$/', $color, $matches ) ) {
+			$fallback = sanitize_hex_color( $matches[2] );
+
+			return $fallback ? sprintf( 'var(%s, %s)', $matches[1], $fallback ) : '';
+		}
+
+		// CSS custom property (e.g. var(--wp--preset--color--primary)).
+		if ( preg_match( '/^var\(\s*--[a-zA-Z0-9_-]+\s*\)$/', $color ) ) {
+			return $color;
+		}
+
+		return '';
 	}
 }
diff --git a/package.json b/package.json
index a984d59..ac22406 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "blockparty-icons",
-	"version": "1.0.6",
+	"version": "1.0.7",
 	"description": "Provides blocks in WordPress editor to add custom SVG icons from your theme.",
 	"author": "Be API Technical team",
 	"license": "GPL-2.0-or-later",
diff --git a/src/block.json b/src/block.json
index ca88257..6556a02 100644
--- a/src/block.json
+++ b/src/block.json
@@ -2,7 +2,7 @@
 	"$schema": "https://schemas.wp.org/trunk/block.json",
 	"apiVersion": 3,
 	"name": "blockparty/icon",
-	"version": "1.0.6",
+	"version": "1.0.7",
 	"title": "Icon",
 	"category": "widgets",
 	"description": "Easily add custom vector icon to your content.",