Try: Add new duotone filter icon.

packages/block-editor/src/components/duotone-control/index.js

@@ -10,6 +10,7 @@ import {
 } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { DOWN } from '@wordpress/keycodes';
+import { Icon, filter } from '@wordpress/icons';
 
 function DuotoneControl( {
 	colorPalette,
@@ -41,7 +42,13 @@ function DuotoneControl( {
 						aria-expanded={ isOpen }
 						onKeyDown={ openOnArrowDown }
 						label={ __( 'Apply duotone filter' ) }
-						icon={ <DuotoneSwatch values={ value } /> }
+						icon={
+							value ? (
+								<DuotoneSwatch values={ value } />
+							) : (
+								<Icon icon={ filter } />
+							)
+						}
 					/>
 				);
 			} }

packages/icons/CHANGELOG.md

@@ -1,6 +1,9 @@
 <!-- Learn how to maintain this file at https://github.com/WordPress/gutenberg/tree/HEAD/packages#maintaining-changelogs. -->
 
 ## Unreleased
+### New Features
+
+-   Add new `filter` icon. ([#40435](https://github.com/WordPress/gutenberg/pull/40435))
 
 ## 8.2.0 (2022-04-08)
 

packages/icons/src/index.js

@@ -67,6 +67,7 @@ export { default as download } from './library/download';
 export { default as edit } from './library/edit';
 export { default as external } from './library/external';
 export { default as file } from './library/file';
+export { default as filter } from './library/filter';
 export { default as flipHorizontal } from './library/flip-horizontal';
 export { default as flipVertical } from './library/flip-vertical';
 export { default as formatBold } from './library/format-bold';

packages/icons/src/library/filter.js

@@ -0,0 +1,12 @@
+/**
+ * WordPress dependencies
+ */
+import { Path, SVG } from '@wordpress/primitives';
+
+const filter = (
+	<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+		<Path d="M12 4 4 19h16L12 4zm0 3.2 5.5 10.3H12V7.2z" />
+	</SVG>
+);
+
+export default filter;