@winplaybox/icons 0.0.0-stage → 0.2.0

package/src/generated/twotone/av.tsx

@@ -0,0 +1,1010 @@
+import React from 'react';
+import { IconProps } from '../../types';
+
+export const TwoToneIcon10kIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M10 10.5h1.5v3H10zm9 4.5V9l-2.25 3z"/><path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 9h2.5v6H6v-4.5H5V19h14v-4h-1.75l-1.75-2.25V15H14V9h1.5v2.25L17.25 9H19V5H5v4zm3.5 1c0-.55.45-1 1-1H12c.55 0 1 .45 1 1v4c0 .55-.45 1-1 1H9.5c-.55 0-1-.45-1-1v-4z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 6v10H5v-8.5h1V15h1.5V9H5V5h14v4z"/><path fill={color || 'currentColor'} d="M15.5 11.25V9H14v6h1.5v-2.25L17.25 15H19l-2.25-3L19 9h-1.75zM9.5 15H12c.55 0 1-.45 1-1v-4c0-.55-.45-1-1-1H9.5c-.55 0-1 .45-1 1v4c0 .55.45 1 1 1zm.5-4.5h1.5v3H10v-3z"/>
+  </svg>
+);
+TwoToneIcon10kIcon.displayName = 'TwoToneIcon10kIcon';
+export const Icon10kTwoToneIcon = TwoToneIcon10kIcon;
+
+export const TwoToneIcon1kIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14V5H5v14zm7-10h1.5v2.25L15.25 9H17l-2.25 3L17 15h-1.75l-1.75-2.25V15H12V9zM7 9h3v6H8.5v-4.5H7V9z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V5h14v14z"/><path fill={color || 'currentColor'} d="M8.5 15H10V9H7v1.5h1.5zm5-2.25L15.25 15H17l-2.25-3L17 9h-1.75l-1.75 2.25V9H12v6h1.5z"/>
+  </svg>
+);
+TwoToneIcon1kIcon.displayName = 'TwoToneIcon1kIcon';
+export const Icon1kTwoToneIcon = TwoToneIcon1kIcon;
+
+export const TwoToneIcon1kPlusIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14v-6.5h-1.5V14h-1v-1.5H15v-1h1.5V10h1v1.5H19V5H5v14zm5.5-10H12v2.25L13.75 9h1.75l-2.25 3l2.25 3h-1.75L12 12.75V15h-1.5V9zM6 9h3v6H7.5v-4.5H6V9z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 8.5h-1.5V10h-1v1.5H15v1h1.5V14h1v-1.5H19V19H5V5h14v6.5z"/><path fill={color || 'currentColor'} d="M7.5 15H9V9H6v1.5h1.5zm4.5-2.25L13.75 15h1.75l-2.25-3l2.25-3h-1.75L12 11.25V9h-1.5v6H12z"/>
+  </svg>
+);
+TwoToneIcon1kPlusIcon.displayName = 'TwoToneIcon1kPlusIcon';
+export const Icon1kPlusTwoToneIcon = TwoToneIcon1kPlusIcon;
+
+export const TwoToneIcon2kIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14V5H5v14zm8-10h1.5v2.25L16.25 9H18l-2.25 3L18 15h-1.75l-1.75-2.25V15H13V9zm-6.5 3.5c0-.55.45-1 1-1h2v-1h-3V9H10c.55 0 1 .45 1 1v1.5c0 .55-.45 1-1 1H8v1h3V15H6.5v-2.5z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V5h14v14z"/><path fill={color || 'currentColor'} d="M11 13.5H8v-1h2c.55 0 1-.45 1-1V10c0-.55-.45-1-1-1H6.5v1.5h3v1h-2c-.55 0-1 .45-1 1V15H11v-1.5zm3.5-.75L16.25 15H18l-2.25-3L18 9h-1.75l-1.75 2.25V9H13v6h1.5z"/>
+  </svg>
+);
+TwoToneIcon2kIcon.displayName = 'TwoToneIcon2kIcon';
+export const Icon2kTwoToneIcon = TwoToneIcon2kIcon;
+
+export const TwoToneIcon2kPlusIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14v-6.5h-1.5V14h-1v-1.5H15v-1h1.5V10h1v1.5H19V5H5v14zm6-10h1.5v2.25L14.25 9H16l-2.25 3L16 15h-1.75l-1.75-2.25V15H11V9zm-5 3.5c0-.55.45-1 1-1h1.5v-1H6V9h3c.55 0 1 .45 1 1v1.5c0 .55-.45 1-1 1H7.5v1H10V15H6v-2.5z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 8.5h-1.5V10h-1v1.5H15v1h1.5V14h1v-1.5H19V19H5V5h14v6.5z"/><path fill={color || 'currentColor'} d="M10 13.5H7.5v-1H9c.55 0 1-.45 1-1V10c0-.55-.45-1-1-1H6v1.5h2.5v1H7c-.55 0-1 .45-1 1V15h4v-1.5zm2.5-.75L14.25 15H16l-2.25-3L16 9h-1.75l-1.75 2.25V9H11v6h1.5z"/>
+  </svg>
+);
+TwoToneIcon2kPlusIcon.displayName = 'TwoToneIcon2kPlusIcon';
+export const Icon2kPlusTwoToneIcon = TwoToneIcon2kPlusIcon;
+
+export const TwoToneIcon3kIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14V5H5v14zm8-10h1.5v2.25L16.25 9H18l-2.25 3L18 15h-1.75l-1.75-2.25V15H13V9zm-6.5 4.5h3v-1h-2v-1h2v-1h-3V9H10c.55 0 1 .45 1 1v4c0 .55-.45 1-1 1H6.5v-1.5z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V5h14v14z"/><path fill={color || 'currentColor'} d="M11 14v-4c0-.55-.45-1-1-1H6.5v1.5h3v1h-2v1h2v1h-3V15H10c.55 0 1-.45 1-1zm3.5-1.25L16.25 15H18l-2.25-3L18 9h-1.75l-1.75 2.25V9H13v6h1.5z"/>
+  </svg>
+);
+TwoToneIcon3kIcon.displayName = 'TwoToneIcon3kIcon';
+export const Icon3kTwoToneIcon = TwoToneIcon3kIcon;
+
+export const TwoToneIcon3kPlusIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14v-6.5h-1.5V14h-1v-1.5H15v-1h1.5V10h1v1.5H19V5H5v14zm6-10h1.5v2.25L14.25 9H16l-2.25 3L16 15h-1.75l-1.75-2.25V15H11V9zm-5.5 4.5h3v-1h-2v-1h2v-1h-3V9H9c.55 0 1 .45 1 1v4c0 .55-.45 1-1 1H5.5v-1.5z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 8.5h-1.5V10h-1v1.5H15v1h1.5V14h1v-1.5H19V19H5V5h14v6.5z"/><path fill={color || 'currentColor'} d="M10 14v-4c0-.55-.45-1-1-1H5.5v1.5h3v1h-2v1h2v1h-3V15H9c.55 0 1-.45 1-1zm2.5-1.25L14.25 15H16l-2.25-3L16 9h-1.75l-1.75 2.25V9H11v6h1.5z"/>
+  </svg>
+);
+TwoToneIcon3kPlusIcon.displayName = 'TwoToneIcon3kPlusIcon';
+export const Icon3kPlusTwoToneIcon = TwoToneIcon3kPlusIcon;
+
+export const TwoToneIcon4kIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M19 5H5v14h14V5zm-7 8.51h-1V15H9.5v-1.5h-3V9H8v3h1.5V9H11v3h1v1.51zM18.2 15h-1.7l-2-3v3H13V9h1.5v3l2-3h1.7l-2 3l2 3z"/><path fill={color || 'currentColor'} d="M5 21h14c1.1 0 2-.9 2-2V5a2 2 0 0 0-2-2H5c-1.1 0-2 .9-2 2v14a2 2 0 0 0 2 2zM5 5h14v14H5V5zm6 4H9.5v3H8V9H6.5v4.5h3V15H11v-1.49h1V12h-1zm5.5 0l-2 3l2 3h1.7l-2-3l2-3zM13 9v6h1.5V9z"/>
+  </svg>
+);
+TwoToneIcon4kIcon.displayName = 'TwoToneIcon4kIcon';
+export const Icon4kTwoToneIcon = TwoToneIcon4kIcon;
+
+export const TwoToneIcon4kPlusIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14v-6.5h-1.5V14h-1v-1.5H15v-1h1.5V10h1v1.5H19V5H5v14zm6.5-10H13v2.25L14.75 9h1.75l-2.25 3l2.25 3h-1.75L13 12.75V15h-1.5V9zm-6 0H7v3h1.5V9H10v3h1v1.5h-1V15H8.5v-1.5h-3V9z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 8.5h-1.5V10h-1v1.5H15v1h1.5V14h1v-1.5H19V19H5V5h14v6.5z"/><path fill={color || 'currentColor'} d="M8.5 15H10v-1.5h1V12h-1V9H8.5v3H7V9H5.5v4.5h3zm4.5-2.25L14.75 15h1.75l-2.25-3l2.25-3h-1.75L13 11.25V9h-1.5v6H13z"/>
+  </svg>
+);
+TwoToneIcon4kPlusIcon.displayName = 'TwoToneIcon4kPlusIcon';
+export const Icon4kPlusTwoToneIcon = TwoToneIcon4kPlusIcon;
+
+export const TwoToneIcon5gIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M16.5 13H19v2h-5V9h7c0-1.1-.9-2-2-2h-5c-1.1 0-2 .9-2 2v6c0 1.1.9 2 2 2h5c1.1 0 2-.9 2-2v-4h-4.5v2zM3 13h5v2H3v2h5c1.1 0 2-.9 2-2v-2c0-1.1-.9-2-2-2H5V9h5V7H3v6z"/>
+  </svg>
+);
+TwoToneIcon5gIcon.displayName = 'TwoToneIcon5gIcon';
+export const Icon5gTwoToneIcon = TwoToneIcon5gIcon;
+
+export const TwoToneIcon5kIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14V5H5v14zm8-10h1.5v2.25L16.25 9H18l-2.25 3L18 15h-1.75l-1.75-2.25V15H13V9zm-6.5 4.5h3v-1h-3V9H11v1.5H8v1h2c.55 0 1 .45 1 1V14c0 .55-.45 1-1 1H6.5v-1.5z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V5h14v14z"/><path fill={color || 'currentColor'} d="M11 14v-1.5c0-.55-.45-1-1-1H8v-1h3V9H6.5v3.5h3v1h-3V15H10c.55 0 1-.45 1-1zm3.5-1.25L16.25 15H18l-2.25-3L18 9h-1.75l-1.75 2.25V9H13v6h1.5z"/>
+  </svg>
+);
+TwoToneIcon5kIcon.displayName = 'TwoToneIcon5kIcon';
+export const Icon5kTwoToneIcon = TwoToneIcon5kIcon;
+
+export const TwoToneIcon5kPlusIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14v-6.5h-1.5V14h-1v-1.5H15v-1h1.5V10h1v1.5H19V5H5v14zm6-10h1.5v2.25L14.25 9H16l-2.25 3L16 15h-1.75l-1.75-2.25V15H11V9zm-5 4.5h2.5v-1H6V9h4v1.5H7.5v1H9c.55 0 1 .45 1 1V14c0 .55-.45 1-1 1H6v-1.5z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 8.5h-1.5V10h-1v1.5H15v1h1.5V14h1v-1.5H19V19H5V5h14v6.5z"/><path fill={color || 'currentColor'} d="M10 14v-1.5c0-.55-.45-1-1-1H7.5v-1H10V9H6v3.5h2.5v1H6V15h3c.55 0 1-.45 1-1zm2.5-1.25L14.25 15H16l-2.25-3L16 9h-1.75l-1.75 2.25V9H11v6h1.5z"/>
+  </svg>
+);
+TwoToneIcon5kPlusIcon.displayName = 'TwoToneIcon5kPlusIcon';
+export const Icon5kPlusTwoToneIcon = TwoToneIcon5kPlusIcon;
+
+export const TwoToneIcon6kIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M8 12.5h1.5V14H8z"/><path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14V5H5v14zm8-10h1.5v2.25L16.25 9H18l-2.25 3L18 15h-1.75l-1.75-2.25V15H13V9zm-6.5 1c0-.55.45-1 1-1H11v1.5H8v1h2c.55 0 1 .45 1 1V14c0 .55-.45 1-1 1H7.5c-.55 0-1-.45-1-1v-4z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V5h14v14z"/><path fill={color || 'currentColor'} d="M14.5 12.75L16.25 15H18l-2.25-3L18 9h-1.75l-1.75 2.25V9H13v6h1.5zM7.5 15H10c.55 0 1-.45 1-1v-1.5c0-.55-.45-1-1-1H8v-1h3V9H7.5c-.55 0-1 .45-1 1v4c0 .55.45 1 1 1zm.5-2.5h1.5V14H8v-1.5z"/>
+  </svg>
+);
+TwoToneIcon6kIcon.displayName = 'TwoToneIcon6kIcon';
+export const Icon6kTwoToneIcon = TwoToneIcon6kIcon;
+
+export const TwoToneIcon6kPlusIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M7.5 12.5h1V14h-1z"/><path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14v-6.5h-1.5V14h-1v-1.5H15v-1h1.5V10h1v1.5H19V5H5v14zm6-10h1.5v2.25L14.25 9H16l-2.25 3L16 15h-1.75l-1.75-2.25V15H11V9zm-5 1c0-.55.45-1 1-1h3v1.5H7.5v1H9c.55 0 1 .45 1 1V14c0 .55-.45 1-1 1H7c-.55 0-1-.45-1-1v-4z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 8.5h-1.5V10h-1v1.5H15v1h1.5V14h1v-1.5H19V19H5V5h14v6.5z"/><path fill={color || 'currentColor'} d="M12.5 12.75L14.25 15H16l-2.25-3L16 9h-1.75l-1.75 2.25V9H11v6h1.5zM7 15h2c.55 0 1-.45 1-1v-1.5c0-.55-.45-1-1-1H7.5v-1H10V9H7c-.55 0-1 .45-1 1v4c0 .55.45 1 1 1zm.5-2.5h1V14h-1v-1.5z"/>
+  </svg>
+);
+TwoToneIcon6kPlusIcon.displayName = 'TwoToneIcon6kPlusIcon';
+export const Icon6kPlusTwoToneIcon = TwoToneIcon6kPlusIcon;
+
+export const TwoToneIcon7kIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14V5H5v14zm8-10h1.5v2.25L16.25 9H18l-2.25 3L18 15h-1.75l-1.75-2.25V15H13V9zM6.5 9H10c.67 0 1.15.65.96 1.29L9.5 15H7.75l1.38-4.5H6.5V9z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V5h14v14z"/><path fill={color || 'currentColor'} d="M7.75 15H9.5l1.46-4.71C11.15 9.65 10.67 9 10 9H6.5v1.5h2.63L7.75 15zm6.75-2.25L16.25 15H18l-2.25-3L18 9h-1.75l-1.75 2.25V9H13v6h1.5z"/>
+  </svg>
+);
+TwoToneIcon7kIcon.displayName = 'TwoToneIcon7kIcon';
+export const Icon7kTwoToneIcon = TwoToneIcon7kIcon;
+
+export const TwoToneIcon7kPlusIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14v-6.5h-1.5V14h-1v-1.5H15v-1h1.5V10h1v1.5H19V5H5v14zm6-10h1.5v2.25L14.25 9H16l-2.25 3L16 15h-1.75l-1.75-2.25V15H11V9zM5.5 9H9c.67 0 1.15.65.96 1.29L8.5 15H6.75l1.38-4.5H5.5V9z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 8.5h-1.5V10h-1v1.5H15v1h1.5V14h1v-1.5H19V19H5V5h14v6.5z"/><path fill={color || 'currentColor'} d="M6.75 15H8.5l1.46-4.71C10.15 9.65 9.67 9 9 9H5.5v1.5h2.63L6.75 15zm5.75-2.25L14.25 15H16l-2.25-3L16 9h-1.75l-1.75 2.25V9H11v6h1.5z"/>
+  </svg>
+);
+TwoToneIcon7kPlusIcon.displayName = 'TwoToneIcon7kPlusIcon';
+export const Icon7kPlusTwoToneIcon = TwoToneIcon7kPlusIcon;
+
+export const TwoToneIcon8kIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M8 10h1.5v1.5H8zm0 2.5h1.5V14H8z"/><path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14V5H5v14zm8-10h1.5v2.25L16.25 9H18l-2.25 3L18 15h-1.75l-1.75-2.25V15H13V9zm-6.5 1c0-.55.45-1 1-1H10c.55 0 1 .45 1 1v4c0 .55-.45 1-1 1H7.5c-.55 0-1-.45-1-1v-4z"/><path fill={color || 'currentColor'} d="M7.5 15H10c.55 0 1-.45 1-1v-4c0-.55-.45-1-1-1H7.5c-.55 0-1 .45-1 1v4c0 .55.45 1 1 1zm.5-5h1.5v1.5H8V10zm0 2.5h1.5V14H8v-1.5z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V5h14v14z"/><path fill={color || 'currentColor'} d="M14.5 12.75L16.25 15H18l-2.25-3L18 9h-1.75l-1.75 2.25V9H13v6h1.5z"/>
+  </svg>
+);
+TwoToneIcon8kIcon.displayName = 'TwoToneIcon8kIcon';
+export const Icon8kTwoToneIcon = TwoToneIcon8kIcon;
+
+export const TwoToneIcon8kPlusIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M7.5 12.5h1V14h-1zm0-2.5h1v1.5h-1z"/><path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14v-6.5h-1.5V14h-1v-1.5H15v-1h1.5V10h1v1.5H19V5H5v14zm6-10h1.5v2.25L14.25 9H16l-2.25 3L16 15h-1.75l-1.75-2.25V15H11V9zm-5 1c0-.55.45-1 1-1h2c.55 0 1 .45 1 1v4c0 .55-.45 1-1 1H7c-.55 0-1-.45-1-1v-4z"/><path fill={color || 'currentColor'} d="M7 15h2c.55 0 1-.45 1-1v-4c0-.55-.45-1-1-1H7c-.55 0-1 .45-1 1v4c0 .55.45 1 1 1zm.5-5h1v1.5h-1V10zm0 2.5h1V14h-1v-1.5z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 8.5h-1.5V10h-1v1.5H15v1h1.5V14h1v-1.5H19V19H5V5h14v6.5z"/><path fill={color || 'currentColor'} d="M12.5 12.75L14.25 15H16l-2.25-3L16 9h-1.75l-1.75 2.25V9H11v6h1.5z"/>
+  </svg>
+);
+TwoToneIcon8kPlusIcon.displayName = 'TwoToneIcon8kPlusIcon';
+export const Icon8kPlusTwoToneIcon = TwoToneIcon8kPlusIcon;
+
+export const TwoToneIcon9kIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14V5H5v14zm8-10h1.5v2.25L16.25 9H18l-2.25 3L18 15h-1.75l-1.75-2.25V15H13V9zm-6.5 4.5h3v-1h-2c-.55 0-1-.45-1-1V10c0-.55.45-1 1-1H10c.55 0 1 .45 1 1v4c0 .55-.45 1-1 1H6.5v-1.5z"/><path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M8 10h1.5v1.5H8z"/><path fill={color || 'currentColor'} d="M11 14v-4c0-.55-.45-1-1-1H7.5c-.55 0-1 .45-1 1v1.5c0 .55.45 1 1 1h2v1h-3V15H10c.55 0 1-.45 1-1zm-1.5-2.5H8V10h1.5v1.5z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V5h14v14z"/><path fill={color || 'currentColor'} d="M14.5 12.75L16.25 15H18l-2.25-3L18 9h-1.75l-1.75 2.25V9H13v6h1.5z"/>
+  </svg>
+);
+TwoToneIcon9kIcon.displayName = 'TwoToneIcon9kIcon';
+export const Icon9kTwoToneIcon = TwoToneIcon9kIcon;
+
+export const TwoToneIcon9kPlusIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M7.5 10h1v1.5h-1z"/><path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14v-6.5h-1.5V14h-1v-1.5H15v-1h1.5V10h1v1.5H19V5H5v14zm6-10h1.5v2.25L14.25 9H16l-2.25 3L16 15h-1.75l-1.75-2.25V15H11V9zm-5 4.5h2.5v-1H7c-.55 0-1-.45-1-1V10c0-.55.45-1 1-1h2c.55 0 1 .45 1 1v4c0 .55-.45 1-1 1H6v-1.5z"/><path fill={color || 'currentColor'} d="M10 14v-4c0-.55-.45-1-1-1H7c-.55 0-1 .45-1 1v1.5c0 .55.45 1 1 1h1.5v1H6V15h3c.55 0 1-.45 1-1zm-1.5-2.5h-1V10h1v1.5z"/><path fill={color || 'currentColor'} d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 8.5h-1.5V10h-1v1.5H15v1h1.5V14h1v-1.5H19V19H5V5h14v6.5z"/><path fill={color || 'currentColor'} d="M12.5 12.75L14.25 15H16l-2.25-3L16 9h-1.75l-1.75 2.25V9H11v6h1.5z"/>
+  </svg>
+);
+TwoToneIcon9kPlusIcon.displayName = 'TwoToneIcon9kPlusIcon';
+export const Icon9kPlusTwoToneIcon = TwoToneIcon9kPlusIcon;
+
+export const TwoToneAddToQueueIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M3 17h18V5H3v12zm5-7h3V7h2v3h3v2h-3v3h-2v-3H8v-2z"/><path fill={color || 'currentColor'} d="M11 15h2v-3h3v-2h-3V7h-2v3H8v2h3zM21 3H3c-1.11 0-2 .89-2 2v12a2 2 0 0 0 2 2h5v2h8v-2h5c1.1 0 2-.9 2-2V5a2 2 0 0 0-2-2zm0 14H3V5h18v12z"/>
+  </svg>
+);
+TwoToneAddToQueueIcon.displayName = 'TwoToneAddToQueueIcon';
+export const AddToQueueTwoToneIcon = TwoToneAddToQueueIcon;
+
+export const TwoToneAirplayIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M6 22h12l-6-6z"/><path fill={color || 'currentColor'} d="M21 3H3c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h4v-2H3V5h18v12h-4v2h4c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"/>
+  </svg>
+);
+TwoToneAirplayIcon.displayName = 'TwoToneAirplayIcon';
+export const AirplayTwoToneIcon = TwoToneAirplayIcon;
+
+export const TwoToneAlbumIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M12 4c-4.41 0-8 3.59-8 8s3.59 8 8 8s8-3.59 8-8s-3.59-8-8-8zm0 12.5c-2.49 0-4.5-2.01-4.5-4.5S9.51 7.5 12 7.5s4.5 2.01 4.5 4.5s-2.01 4.5-4.5 4.5z"/><path fill={color || 'currentColor'} d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8s8 3.59 8 8s-3.59 8-8 8zm0-12.5c-2.49 0-4.5 2.01-4.5 4.5s2.01 4.5 4.5 4.5s4.5-2.01 4.5-4.5s-2.01-4.5-4.5-4.5zm0 5.5c-.55 0-1-.45-1-1s.45-1 1-1s1 .45 1 1s-.45 1-1 1z"/>
+  </svg>
+);
+TwoToneAlbumIcon.displayName = 'TwoToneAlbumIcon';
+export const AlbumTwoToneIcon = TwoToneAlbumIcon;
+
+export const TwoToneArtTrackIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M14 7h8v2h-8zm0 4h8v2h-8zm0 4h8v2h-8zM4 17h6c1.1 0 2-.9 2-2V9c0-1.1-.9-2-2-2H4c-1.1 0-2 .9-2 2v6c0 1.1.9 2 2 2zm1.25-4.25l1.25 1.51L8.25 12l2.25 3h-7l1.75-2.25z"/>
+  </svg>
+);
+TwoToneArtTrackIcon.displayName = 'TwoToneArtTrackIcon';
+export const ArtTrackTwoToneIcon = TwoToneArtTrackIcon;
+
+export const TwoToneAudioFileIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M13 4H6v16h12V9h-5V4zm3 7v2h-3v3.75c0 1.24-1.01 2.25-2.25 2.25S8.5 17.99 8.5 16.75s1.01-2.25 2.25-2.25c.46 0 .89.14 1.25.38V11h4z"/><path fill={color || 'currentColor'} d="M14 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V8l-6-6zm4 18H6V4h7v5h5v11z"/><path fill={color || 'currentColor'} d="M12 14.88a2.247 2.247 0 0 0-3.5 1.87c0 1.24 1.01 2.25 2.25 2.25S13 17.99 13 16.75V13h3v-2h-4v3.88z"/>
+  </svg>
+);
+TwoToneAudioFileIcon.displayName = 'TwoToneAudioFileIcon';
+export const AudioFileTwoToneIcon = TwoToneAudioFileIcon;
+
+export const TwoToneAvTimerIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M12 21a9 9 0 0 0 0-18h-1v4h2V5.08c3.39.49 6 3.39 6 6.92c0 3.87-3.13 7-7 7s-7-3.13-7-7c0-1.68.59-3.22 1.58-4.42L12 13l1.41-1.41l-6.8-6.8v.02C4.42 6.45 3 9.05 3 12c0 4.97 4.02 9 9 9z"/><circle cx="12" cy="17" r="1"/><circle cx="17" cy="12" r="1"/><circle cx="7" cy="12" r="1"/>
+  </svg>
+);
+TwoToneAvTimerIcon.displayName = 'TwoToneAvTimerIcon';
+export const AvTimerTwoToneIcon = TwoToneAvTimerIcon;
+
+export const TwoToneBrandingWatermarkIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M3 19h18V5H3v14zm8-7h9v6h-9v-6z"/><path fill={color || 'currentColor'} d="M21 3H3c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H3V5h18v14zm-10-7h9v6h-9z"/>
+  </svg>
+);
+TwoToneBrandingWatermarkIcon.displayName = 'TwoToneBrandingWatermarkIcon';
+export const BrandingWatermarkTwoToneIcon = TwoToneBrandingWatermarkIcon;
+
+export const TwoToneCallToActionIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M3 19h18V5H3v14zm2-4h14v3H5v-3z"/><path fill={color || 'currentColor'} d="M21 3H3c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H3V5h18v14zM5 15h14v3H5z"/>
+  </svg>
+);
+TwoToneCallToActionIcon.displayName = 'TwoToneCallToActionIcon';
+export const CallToActionTwoToneIcon = TwoToneCallToActionIcon;
+
+export const TwoToneClosedCaptionIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M19 6H5v12h14V6zm-8 5H9.5v-.5h-2v3h2V13H11v1c0 .55-.45 1-1 1H7c-.55 0-1-.45-1-1v-4c0-.55.45-1 1-1h3c.55 0 1 .45 1 1v1zm7 0h-1.5v-.5h-2v3h2V13H18v1c0 .55-.45 1-1 1h-3c-.55 0-1-.45-1-1v-4c0-.55.45-1 1-1h3c.55 0 1 .45 1 1v1z"/><path fill={color || 'currentColor'} d="M5 20h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2H5a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2zM5 6h14v12H5V6zm5 3H7c-.55 0-1 .45-1 1v4c0 .55.45 1 1 1h3c.55 0 1-.45 1-1v-1H9.5v.5h-2v-3h2v.5H11v-1c0-.55-.45-1-1-1zm7 0h-3c-.55 0-1 .45-1 1v4c0 .55.45 1 1 1h3c.55 0 1-.45 1-1v-1h-1.5v.5h-2v-3h2v.5H18v-1c0-.55-.45-1-1-1z"/>
+  </svg>
+);
+TwoToneClosedCaptionIcon.displayName = 'TwoToneClosedCaptionIcon';
+export const ClosedCaptionTwoToneIcon = TwoToneClosedCaptionIcon;
+
+export const TwoToneClosedCaptionDisabledIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M8.83 6H19v10.17l-1.4-1.4c.24-.18.4-.45.4-.77v-1h-1.5v.5h-.17l-1.83-1.83V10.5h2v.5H18v-1c0-.55-.45-1-1-1h-3c-.55 0-1 .45-1 1v.17L8.83 6zM7.5 13.5h2V13h.67l-2.5-2.5H7.5v3zm3.5.5c0 .55-.45 1-1 1H7c-.55 0-1-.45-1-1v-4c0-.32.16-.59.4-.78L5 7.83V18h10.17L11 13.83V14z"/><path fill={color || 'currentColor'} d="M6.83 4H19c1.1 0 2 .9 2 2v12c0 .05-.01.1-.02.16L19 16.17V6H8.83l-2-2zm12.95 18.61L17.17 20H5a2 2 0 0 1-2-2V6c0-.05.02-.1.02-.15L1.39 4.22L2.8 2.81L18 18l1.82 1.82l1.37 1.37l-1.41 1.42zM7.5 13.5h2V13h.67l-2.5-2.5H7.5v3zm7.67 4.5L11 13.83V14c0 .55-.45 1-1 1H7c-.55 0-1-.45-1-1v-4c0-.32.16-.59.4-.78L5 7.83V18h10.17zM18 14v-1h-1.5v.5h-.17l1.28 1.28c.23-.19.39-.46.39-.78zm-3.5-2.33V10.5h2v.5H18v-1c0-.55-.45-1-1-1h-3c-.55 0-1 .45-1 1v.17l1.5 1.5z"/>
+  </svg>
+);
+TwoToneClosedCaptionDisabledIcon.displayName = 'TwoToneClosedCaptionDisabledIcon';
+export const ClosedCaptionDisabledTwoToneIcon = TwoToneClosedCaptionDisabledIcon;
+
+export const TwoToneClosedCaptionOffIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M19 6H5v12h14V6zm-8 5H9.5v-.5h-2v3h2V13H11v1c0 .55-.45 1-1 1H7c-.55 0-1-.45-1-1v-4c0-.55.45-1 1-1h3c.55 0 1 .45 1 1v1zm7 0h-1.5v-.5h-2v3h2V13H18v1c0 .55-.45 1-1 1h-3c-.55 0-1-.45-1-1v-4c0-.55.45-1 1-1h3c.55 0 1 .45 1 1v1z"/><path fill={color || 'currentColor'} d="M5 20h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2H5a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2zM5 6h14v12H5V6z"/><path fill={color || 'currentColor'} d="M10 9H7c-.55 0-1 .45-1 1v4c0 .55.45 1 1 1h3c.55 0 1-.45 1-1v-1H9.5v.5h-2v-3h2v.5H11v-1c0-.55-.45-1-1-1zm7 0h-3c-.55 0-1 .45-1 1v4c0 .55.45 1 1 1h3c.55 0 1-.45 1-1v-1h-1.5v.5h-2v-3h2v.5H18v-1c0-.55-.45-1-1-1z"/>
+  </svg>
+);
+TwoToneClosedCaptionOffIcon.displayName = 'TwoToneClosedCaptionOffIcon';
+export const ClosedCaptionOffTwoToneIcon = TwoToneClosedCaptionOffIcon;
+
+export const TwoToneControlCameraIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M7.3 13.77L5.54 12l1.76-1.77l-1.76-1.77L2 12l3.54 3.54zm8.24 4.69l-1.77-1.76L12 18.46l-1.77-1.76l-1.77 1.76L12 22zm2.92-2.92L22 12l-3.54-3.54l-1.76 1.77L18.46 12l-1.76 1.77zM12 5.54l1.77 1.76l1.77-1.76L12 2L8.46 5.54l1.77 1.76z"/><circle cx="12" cy="12" r="3"/>
+  </svg>
+);
+TwoToneControlCameraIcon.displayName = 'TwoToneControlCameraIcon';
+export const ControlCameraTwoToneIcon = TwoToneControlCameraIcon;
+
+export const TwoToneEqualizerIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M16 9h4v11h-4zm-6-5h4v16h-4zm-6 8h4v8H4z"/>
+  </svg>
+);
+TwoToneEqualizerIcon.displayName = 'TwoToneEqualizerIcon';
+export const EqualizerTwoToneIcon = TwoToneEqualizerIcon;
+
+export const TwoToneExplicitIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 19h14V5H5v14zM9 7h6v2h-4v2h4v2h-4v2h4v2H9V7z"/><path fill={color || 'currentColor'} d="M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zm-2 0H5V5h14v14zm-4-4h-4v-2h4v-2h-4V9h4V7H9v10h6z"/>
+  </svg>
+);
+TwoToneExplicitIcon.displayName = 'TwoToneExplicitIcon';
+export const ExplicitTwoToneIcon = TwoToneExplicitIcon;
+
+export const TwoToneFastForwardIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M15 9.86v4.28L18.03 12zm-9 0v4.28L9.03 12z"/><path fill={color || 'currentColor'} d="M4 18l8.5-6L4 6v12zm2-8.14L9.03 12L6 14.14V9.86zM21.5 12L13 6v12l8.5-6zM15 9.86L18.03 12L15 14.14V9.86z"/>
+  </svg>
+);
+TwoToneFastForwardIcon.displayName = 'TwoToneFastForwardIcon';
+export const FastForwardTwoToneIcon = TwoToneFastForwardIcon;
+
+export const TwoToneFastRewindIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M9 14.14V9.86L5.97 12zm9 0V9.86L14.97 12z"/><path fill={color || 'currentColor'} d="M11 6l-8.5 6l8.5 6V6zm-2 8.14L5.97 12L9 9.86v4.28zM20 6l-8.5 6l8.5 6V6zm-2 8.14L14.97 12L18 9.86v4.28z"/>
+  </svg>
+);
+TwoToneFastRewindIcon.displayName = 'TwoToneFastRewindIcon';
+export const FastRewindTwoToneIcon = TwoToneFastRewindIcon;
+
+export const TwoToneFeaturedPlayListIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M3 19h18V5H3v14zM5 7h9v2H5V7zm0 3h9v2H5v-2z"/><path fill={color || 'currentColor'} d="M21 3H3c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H3V5h18v14zM5 10h9v2H5zm0-3h9v2H5z"/>
+  </svg>
+);
+TwoToneFeaturedPlayListIcon.displayName = 'TwoToneFeaturedPlayListIcon';
+export const FeaturedPlayListTwoToneIcon = TwoToneFeaturedPlayListIcon;
+
+export const TwoToneFeaturedVideoIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M3 19h18V5H3v14zM4 6h9v7H4V6z"/><path fill={color || 'currentColor'} d="M21 3H3c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H3V5h18v14zM4 6h9v7H4z"/>
+  </svg>
+);
+TwoToneFeaturedVideoIcon.displayName = 'TwoToneFeaturedVideoIcon';
+export const FeaturedVideoTwoToneIcon = TwoToneFeaturedVideoIcon;
+
+export const TwoToneFiberDvrIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M20 11.56v-.89c0-.76-.58-1.33-1.33-1.33h-3.11v5.33h1.33v-1.78h1.02l.76 1.78H20l-.8-1.87c.44-.22.8-.71.8-1.24zm-1.33 0h-1.78v-.89h1.78v.89zM7.11 9.33H4v5.33h3.11c.76 0 1.33-.58 1.33-1.33v-2.67c0-.75-.57-1.33-1.33-1.33zm0 4H5.33v-2.67h1.78v2.67zm7-4h-1.34l-.89 3.05L11 9.33H9.66l1.56 5.34h1.33z"/><path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M3 5h18v14H3z"/><path fill={color || 'currentColor'} d="M21 3H3c-1.11 0-2 .89-2 2v14a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V5c0-1.11-.89-2-2-2zm0 16H3V5h18v14z"/>
+  </svg>
+);
+TwoToneFiberDvrIcon.displayName = 'TwoToneFiberDvrIcon';
+export const FiberDvrTwoToneIcon = TwoToneFiberDvrIcon;
+
+export const TwoToneFiberManualRecordIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M12 18c3.31 0 6-2.69 6-6s-2.69-6-6-6s-6 2.69-6 6s2.69 6 6 6z"/><path fill={color || 'currentColor'} d="M12 20c4.42 0 8-3.58 8-8s-3.58-8-8-8s-8 3.58-8 8s3.58 8 8 8zm0-14c3.31 0 6 2.69 6 6s-2.69 6-6 6s-6-2.69-6-6s2.69-6 6-6z"/>
+  </svg>
+);
+TwoToneFiberManualRecordIcon.displayName = 'TwoToneFiberManualRecordIcon';
+export const FiberManualRecordTwoToneIcon = TwoToneFiberManualRecordIcon;
+
+export const TwoToneFiberNewIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M9.12 14.47V9.53H8.09v2.88L6.03 9.53H5v4.94h1.03v-2.88l2.1 2.88zm4.12-3.9V9.53h-3.3v4.94h3.3v-1.03h-2.06v-.91h2.06v-1.04h-2.06v-.92zm.82-1.04v4.12c0 .45.37.82.82.82h3.29c.45 0 .82-.37.82-.82V9.53h-1.03v3.71h-.92v-2.89h-1.03v2.9h-.93V9.53h-1.02z"/><path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M4 6h16v12H4z"/><path fill={color || 'currentColor'} d="M20 4H4c-1.11 0-1.99.89-1.99 2L2 18c0 1.11.89 2 2 2h16c1.11 0 2-.89 2-2V6c0-1.11-.89-2-2-2zm0 14H4V6h16v12z"/>
+  </svg>
+);
+TwoToneFiberNewIcon.displayName = 'TwoToneFiberNewIcon';
+export const FiberNewTwoToneIcon = TwoToneFiberNewIcon;
+
+export const TwoToneFiberPinIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M5 14.62h1.31v-1.75h1.75c.74 0 1.31-.57 1.31-1.31v-.88c0-.74-.57-1.31-1.31-1.31H5v5.25zm1.31-3.93h1.75v.88H6.31v-.88zm5.03-1.31h1.31v5.25h-1.31zm3.28 5.24h1.1v-3.06l2.23 3.06H19V9.38h-1.09v3.06l-2.19-3.06h-1.1z"/><path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M4 6h16v12H4z"/><path fill={color || 'currentColor'} d="M20 4H4c-1.11 0-1.99.89-1.99 2L2 18c0 1.11.89 2 2 2h16c1.11 0 2-.89 2-2V6c0-1.11-.89-2-2-2zm0 14H4V6h16v12z"/>
+  </svg>
+);
+TwoToneFiberPinIcon.displayName = 'TwoToneFiberPinIcon';
+export const FiberPinTwoToneIcon = TwoToneFiberPinIcon;
+
+export const TwoToneFiberSmartRecordIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M9 18c3.31 0 6-2.69 6-6s-2.69-6-6-6s-6 2.69-6 6s2.69 6 6 6z"/><path fill={color || 'currentColor'} d="M9 20c4.42 0 8-3.58 8-8s-3.58-8-8-8s-8 3.58-8 8s3.58 8 8 8zM9 6c3.31 0 6 2.69 6 6s-2.69 6-6 6s-6-2.69-6-6s2.69-6 6-6zm8-1.74v2.09a5.99 5.99 0 0 1 0 11.3v2.09c3.45-.89 6-4.01 6-7.74c0-3.73-2.55-6.85-6-7.74z"/>
+  </svg>
+);
+TwoToneFiberSmartRecordIcon.displayName = 'TwoToneFiberSmartRecordIcon';
+export const FiberSmartRecordTwoToneIcon = TwoToneFiberSmartRecordIcon;
+
+export const TwoToneForward10Icon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M18 13c0 3.31-2.69 6-6 6s-6-2.69-6-6s2.69-6 6-6v4l5-5l-5-5v4c-4.42 0-8 3.58-8 8s3.58 8 8 8s8-3.58 8-8h-2z"/><path fill={color || 'currentColor'} d="M10.9 16v-4.27h-.09l-1.77.63v.69l1.01-.31V16zm3.42-4.22c-.18-.07-.37-.1-.59-.1s-.41.03-.59.1s-.33.18-.45.33s-.23.34-.29.57s-.1.5-.1.82v.74c0 .32.04.6.11.82s.17.42.3.57s.28.26.46.33s.37.1.59.1s.41-.03.59-.1s.33-.18.45-.33s.22-.34.29-.57s.1-.5.1-.82v-.74c0-.32-.04-.6-.11-.82s-.17-.42-.3-.57s-.29-.26-.46-.33zm.01 2.57c0 .19-.01.35-.04.48s-.06.24-.11.32s-.11.14-.19.17s-.16.05-.25.05s-.18-.02-.25-.05s-.14-.09-.19-.17s-.09-.19-.12-.32s-.04-.29-.04-.48v-.97c0-.19.01-.35.04-.48s.06-.23.12-.31s.11-.14.19-.17s.16-.05.25-.05s.18.02.25.05s.14.09.19.17s.09.18.12.31s.04.29.04.48v.97z"/>
+  </svg>
+);
+TwoToneForward10Icon.displayName = 'TwoToneForward10Icon';
+export const Forward10TwoToneIcon = TwoToneForward10Icon;
+
+export const TwoToneForward30Icon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M18 13c0 3.31-2.69 6-6 6s-6-2.69-6-6s2.69-6 6-6v4l5-5l-5-5v4c-4.42 0-8 3.58-8 8s3.58 8 8 8s8-3.58 8-8h-2zm-7.46 2.22c-.06.05-.12.09-.2.12s-.17.04-.27.04a.69.69 0 0 1-.45-.15c-.06-.05-.1-.1-.13-.17s-.05-.14-.05-.22h-.85c0 .21.04.39.12.55s.19.28.33.38s.29.18.46.23s.35.07.53.07c.21 0 .41-.03.6-.08s.34-.14.48-.24s.24-.24.32-.39s.12-.33.12-.53c0-.23-.06-.44-.18-.61s-.3-.3-.54-.39c.1-.05.2-.1.28-.17s.15-.14.2-.22s.1-.16.13-.25s.04-.18.04-.27c0-.2-.04-.37-.11-.53s-.17-.28-.3-.38s-.28-.18-.46-.23s-.37-.08-.59-.08c-.19 0-.38.03-.54.08s-.32.13-.44.23s-.23.22-.3.37s-.11.3-.11.48h.85a.455.455 0 0 1 .17-.35c.05-.04.11-.07.18-.1s.14-.03.22-.03c.1 0 .18.01.25.04s.13.06.18.11s.08.11.11.17s.04.14.04.22c0 .18-.05.32-.16.43s-.26.16-.48.16h-.43v.66h.45c.11 0 .2.01.29.04s.16.06.22.11s.11.12.14.2s.05.18.05.29c0 .09-.01.17-.04.24s-.08.11-.13.17zm3.9-3.44c-.18-.07-.37-.1-.59-.1s-.41.03-.59.1s-.33.18-.45.33s-.23.34-.29.57s-.1.5-.1.82v.74c0 .32.04.6.11.82s.17.42.3.57s.28.26.46.33s.37.1.59.1s.41-.03.59-.1s.33-.18.45-.33s.22-.34.29-.57s.1-.5.1-.82v-.74c0-.32-.04-.6-.11-.82s-.17-.42-.3-.57s-.28-.26-.46-.33zm.01 2.57c0 .19-.01.35-.04.48s-.06.24-.11.32s-.11.14-.19.17s-.16.05-.25.05s-.18-.02-.25-.05s-.14-.09-.19-.17s-.09-.19-.12-.32s-.04-.29-.04-.48v-.97c0-.19.01-.35.04-.48s.06-.23.12-.31s.11-.14.19-.17s.16-.05.25-.05s.18.02.25.05s.14.09.19.17s.09.18.12.31s.04.29.04.48v.97z"/>
+  </svg>
+);
+TwoToneForward30Icon.displayName = 'TwoToneForward30Icon';
+export const Forward30TwoToneIcon = TwoToneForward30Icon;
+
+export const TwoToneForward5Icon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M17.95 13c0 3.31-2.69 6-6 6s-6-2.69-6-6s2.69-6 6-6v4l5-5l-5-5v4c-4.42 0-8 3.58-8 8s3.58 8 8 8s8-3.58 8-8h-2zm-5.52 2.15c-.05.07-.11.13-.18.17s-.17.06-.27.06c-.17 0-.31-.05-.42-.15s-.17-.24-.19-.41h-.84c.01.2.05.37.13.53s.19.28.32.39s.29.19.46.24s.35.08.53.08c.24 0 .46-.04.64-.12s.33-.18.45-.31s.21-.28.27-.45s.09-.35.09-.54c0-.22-.03-.43-.09-.6s-.14-.33-.25-.45s-.25-.22-.41-.28s-.34-.1-.55-.1c-.07 0-.14.01-.2.02s-.13.02-.18.04s-.1.03-.15.05s-.08.04-.11.05l.11-.92h1.7v-.71H10.9l-.25 2.17l.67.17c.03-.03.06-.06.1-.09s.07-.05.12-.07s.1-.04.15-.05s.13-.02.2-.02c.12 0 .22.02.3.05s.16.09.21.15s.1.14.13.24s.04.19.04.31s-.01.22-.03.31s-.06.17-.11.24z"/>
+  </svg>
+);
+TwoToneForward5Icon.displayName = 'TwoToneForward5Icon';
+export const Forward5TwoToneIcon = TwoToneForward5Icon;
+
+export const TwoToneGamesIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M11 17.33V20h2v-2.67l-1-1zm2-10.66V4h-2v2.67l1 1zM16.33 12l1 1H20v-2h-2.67zM4 11v2h2.67l1-1l-1-1z"/><path fill={color || 'currentColor'} d="M2 9v6h5.5l3-3l-3-3H2zm4.67 4H4v-2h2.67l1 1l-1 1zM22 9h-5.5l-3 3l3 3H22V9zm-2 4h-2.67l-1-1l1-1H20v2zm-5 3.5l-3-3l-3 3V22h6v-5.5zM13 20h-2v-2.67l1-1l1 1V20zM9 7.5l3 3l3-3V2H9v5.5zM11 4h2v2.67l-1 1l-1-1V4z"/>
+  </svg>
+);
+TwoToneGamesIcon.displayName = 'TwoToneGamesIcon';
+export const GamesTwoToneIcon = TwoToneGamesIcon;
+
+export const TwoToneHdIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M14.5 10.5h2v3h-2zM19 5H5v14h14V5zm-8 10H9.5v-2h-2v2H6V9h1.5v2.5h2V9H11v6zm7-1c0 .55-.45 1-1 1h-4V9h4c.55 0 1 .45 1 1v4z"/><path fill={color || 'currentColor'} d="M5 21h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2zM5 5h14v14H5V5zm4.5 6.5h-2V9H6v6h1.5v-2h2v2H11V9H9.5zM17 9h-4v6h4c.55 0 1-.45 1-1v-4c0-.55-.45-1-1-1zm-.5 4.5h-2v-3h2v3z"/>
+  </svg>
+);
+TwoToneHdIcon.displayName = 'TwoToneHdIcon';
+export const HdTwoToneIcon = TwoToneHdIcon;
+
+export const TwoToneHearingIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M7.64 2.64L6.22 1.22C4.23 3.21 3 5.96 3 9s1.23 5.79 3.22 7.78l1.41-1.41C6.01 13.74 5 11.49 5 9s1.01-4.74 2.64-6.36z"/><circle cx="14" cy="9" r="2.5"/><path fill={color || 'currentColor'} d="M17 20c-.29 0-.56-.06-.76-.15c-.71-.37-1.21-.88-1.71-2.38c-.51-1.56-1.47-2.29-2.39-3c-.79-.61-1.61-1.24-2.32-2.53C9.29 10.98 9 9.93 9 9c0-2.8 2.2-5 5-5s5 2.2 5 5h2c0-3.93-3.07-7-7-7S7 5.07 7 9c0 1.26.38 2.65 1.07 3.9c.91 1.65 1.98 2.48 2.85 3.15c.81.62 1.39 1.07 1.71 2.05c.6 1.82 1.37 2.84 2.73 3.55A3.999 3.999 0 0 0 21 18h-2c0 1.1-.9 2-2 2z"/>
+  </svg>
+);
+TwoToneHearingIcon.displayName = 'TwoToneHearingIcon';
+export const HearingTwoToneIcon = TwoToneHearingIcon;
+
+export const TwoToneHearingDisabledIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M6.03 3.2C7.15 2.44 8.51 2 10 2c3.93 0 7 3.07 7 7c0 1.26-.38 2.65-1.07 3.9c-.02.04-.05.08-.08.13l-1.48-1.48c.4-.86.63-1.75.63-2.55c0-2.8-2.2-5-5-5c-.92 0-1.76.26-2.5.67L6.03 3.2zm11.18 11.18l1.43 1.43C20.11 13.93 21 11.57 21 9c0-3.04-1.23-5.79-3.22-7.78l-1.42 1.42A8.937 8.937 0 0 1 19 9c0 2.02-.67 3.88-1.79 5.38zM10 6.5c-.21 0-.4.03-.59.08l3.01 3.01c.05-.19.08-.38.08-.59A2.5 2.5 0 0 0 10 6.5zm11.19 14.69L2.81 2.81L1.39 4.22l2.13 2.13C3.19 7.16 3 8.05 3 9h2c0-.36.05-.71.12-1.05l6.61 6.61c-.88.68-1.78 1.41-2.27 2.9c-.5 1.5-1 2.01-1.71 2.38c-.19.1-.46.16-.75.16c-1.1 0-2-.9-2-2H3a3.999 3.999 0 0 0 5.64 3.65c1.36-.71 2.13-1.73 2.73-3.55c.32-.98.9-1.43 1.71-2.05c.03-.02.05-.04.08-.06l6.62 6.62l1.41-1.42z"/>
+  </svg>
+);
+TwoToneHearingDisabledIcon.displayName = 'TwoToneHearingDisabledIcon';
+export const HearingDisabledTwoToneIcon = TwoToneHearingDisabledIcon;
+
+export const TwoToneHighQualityIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M19 6H5v12h14V6zm-8 9H9.5v-2h-2v2H6V9h1.5v2.5h2V9H11v6zm7-1c0 .55-.45 1-1 1h-.75v1.5h-1.5V15H14c-.55 0-1-.45-1-1v-4c0-.55.45-1 1-1h3c.55 0 1 .45 1 1v4zm-3.5-3.5h2v3h-2z"/><path fill={color || 'currentColor'} d="M3 6v12a2 2 0 0 0 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2H5a2 2 0 0 0-2 2zm2 0h14v12H5V6zm4.5 5.5h-2V9H6v6h1.5v-2h2v2H11V9H9.5zM17 9h-3c-.55 0-1 .45-1 1v4c0 .55.45 1 1 1h.75v1.5h1.5V15H17c.55 0 1-.45 1-1v-4c0-.55-.45-1-1-1zm-.5 4.5h-2v-3h2v3z"/>
+  </svg>
+);
+TwoToneHighQualityIcon.displayName = 'TwoToneHighQualityIcon';
+export const HighQualityTwoToneIcon = TwoToneHighQualityIcon;
+
+export const TwoToneInterpreterModeIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M15.52 15.01C15.35 15 15.18 15 15 15c-2.37 0-4.29.73-5.48 1.34c-.32.16-.52.5-.52.88V18h7.17c-.43-.74-.77-1.76-.65-2.99zM13 8c0 1.1.9 2 2 2s2-.9 2-2s-.9-2-2-2s-2 .9-2 2z"/><path fill={color || 'currentColor'} d="M20.5 16.5c-.83 0-1.5-.67-1.5-1.5v-2.5c0-.83.67-1.5 1.5-1.5s1.5.67 1.5 1.5V15c0 .83-.67 1.5-1.5 1.5zM20 20h1v-1.54c1.69-.24 3-1.7 3-3.46h-1a2.5 2.5 0 0 1-5 0h-1c0 1.76 1.31 3.22 3 3.46V20zM9 12c-2.21 0-4-1.79-4-4a3.999 3.999 0 0 1 5.34-3.77A5.938 5.938 0 0 0 9 8c0 1.43.5 2.74 1.34 3.77c-.42.15-.87.23-1.34.23zm-1.89 1.13A4.965 4.965 0 0 0 5 17.22V20H1v-2.78c0-1.12.61-2.15 1.61-2.66c1.24-.64 2.76-1.19 4.5-1.43zM11 8c0-2.21 1.79-4 4-4s4 1.79 4 4s-1.79 4-4 4s-4-1.79-4-4zm2 0c0 1.1.9 2 2 2s2-.9 2-2s-.9-2-2-2s-2 .9-2 2zm2 7c-2.37 0-4.29.73-5.48 1.34c-.32.16-.52.5-.52.88V18h7.17c.5.86 1.25 1.56 2.15 2H7v-2.78c0-1.12.61-2.15 1.61-2.66C10.29 13.7 12.47 13 15 13c.39 0 .77.02 1.14.05c-.33.59-.55 1.26-.62 1.96c-.17-.01-.34-.01-.52-.01z"/>
+  </svg>
+);
+TwoToneInterpreterModeIcon.displayName = 'TwoToneInterpreterModeIcon';
+export const InterpreterModeTwoToneIcon = TwoToneInterpreterModeIcon;
+
+export const TwoToneLibraryAddIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M8 16h12V4H8v12zm2-7h3V6h2v3h3v2h-3v3h-2v-3h-3V9z"/><path fill={color || 'currentColor'} d="M4 22h14v-2H4V6H2v14c0 1.1.9 2 2 2zM8 2c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2H8zm12 14H8V4h12v12zm-7-2h2v-3h3V9h-3V6h-2v3h-3v2h3z"/>
+  </svg>
+);
+TwoToneLibraryAddIcon.displayName = 'TwoToneLibraryAddIcon';
+export const LibraryAddTwoToneIcon = TwoToneLibraryAddIcon;
+
+export const TwoToneLibraryAddCheckIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M8 16h12V4H8v12zm2.4-6.91l2.07 2.08L17.6 6L19 7.41L12.47 14L9 10.5l1.4-1.41z"/><path fill={color || 'currentColor'} d="M20 2H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H8V4h12v12zm-7.53-2L9 10.5l1.4-1.41l2.07 2.08L17.6 6L19 7.41L12.47 14zM4 20h14v2H4c-1.1 0-2-.9-2-2V6h2v14z"/>
+  </svg>
+);
+TwoToneLibraryAddCheckIcon.displayName = 'TwoToneLibraryAddCheckIcon';
+export const LibraryAddCheckTwoToneIcon = TwoToneLibraryAddCheckIcon;
+
+export const TwoToneLibraryBooksIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M8 16h12V4H8v12zm2-10h8v2h-8V6zm0 3h8v2h-8V9zm0 3h4v2h-4v-2z"/><path fill={color || 'currentColor'} d="M4 22h14v-2H4V6H2v14c0 1.1.9 2 2 2zM6 4v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2H8c-1.1 0-2 .9-2 2zm14 12H8V4h12v12zM10 9h8v2h-8zm0 3h4v2h-4zm0-6h8v2h-8z"/>
+  </svg>
+);
+TwoToneLibraryBooksIcon.displayName = 'TwoToneLibraryBooksIcon';
+export const LibraryBooksTwoToneIcon = TwoToneLibraryBooksIcon;
+
+export const TwoToneLibraryMusicIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M8 16h12V4H8v12zm4.5-6c.57 0 1.08.19 1.5.51V5h4v2h-3v5.5a2.5 2.5 0 0 1-5 0a2.5 2.5 0 0 1 2.5-2.5z"/><path fill={color || 'currentColor'} d="M20 2H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H8V4h12v12zm-7.5-1a2.5 2.5 0 0 0 2.5-2.5V7h3V5h-4v5.51c-.42-.32-.93-.51-1.5-.51a2.5 2.5 0 0 0 0 5zM2 6v14c0 1.1.9 2 2 2h14v-2H4V6H2z"/>
+  </svg>
+);
+TwoToneLibraryMusicIcon.displayName = 'TwoToneLibraryMusicIcon';
+export const LibraryMusicTwoToneIcon = TwoToneLibraryMusicIcon;
+
+export const TwoToneLoopIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M12 18c-3.31 0-6-2.69-6-6c0-1.01.25-1.97.7-2.8L5.24 7.74A7.93 7.93 0 0 0 4 12c0 4.42 3.58 8 8 8v3l4-4l-4-4v3zm0-14V1L8 5l4 4V6c3.31 0 6 2.69 6 6c0 1.01-.25 1.97-.7 2.8l1.46 1.46A7.93 7.93 0 0 0 20 12c0-4.42-3.58-8-8-8z"/>
+  </svg>
+);
+TwoToneLoopIcon.displayName = 'TwoToneLoopIcon';
+export const LoopTwoToneIcon = TwoToneLoopIcon;
+
+export const TwoToneLyricsIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M4 4v14l2-2h9v-4.03c-.62-.83-1-1.85-1-2.97s.38-2.14 1-2.97V4H4zm6 10H6v-2h4v2zm3-3H6V9h7v2zm0-3H6V6h7v2z"/><path fill={color || 'currentColor'} d="M6 12h4v2H6zm0-6h7v2H6z"/><path fill={color || 'currentColor'} d="M15 11.97V16H6l-2 2V4h11v2.03c.52-.69 1.2-1.25 2-1.6V4c0-1.1-.9-2-2-2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h9c1.1 0 2-.9 2-2v-2.42a5.16 5.16 0 0 1-2-1.61z"/><path fill={color || 'currentColor'} d="M6 9h7v2H6zm14-2.82c-.31-.11-.65-.18-1-.18c-1.66 0-3 1.34-3 3s1.34 3 3 3s3-1.34 3-3V3h2V1h-4v5.18z"/>
+  </svg>
+);
+TwoToneLyricsIcon.displayName = 'TwoToneLyricsIcon';
+export const LyricsTwoToneIcon = TwoToneLyricsIcon;
+
+export const TwoToneMicIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M12 12c.55 0 1-.45 1-1V5c0-.55-.45-1-1-1s-1 .45-1 1v6c0 .55.45 1 1 1z"/><path fill={color || 'currentColor'} d="M12 14c1.66 0 3-1.34 3-3V5c0-1.66-1.34-3-3-3S9 3.34 9 5v6c0 1.66 1.34 3 3 3zm-1-9c0-.55.45-1 1-1s1 .45 1 1v6c0 .55-.45 1-1 1s-1-.45-1-1V5z"/><path fill={color || 'currentColor'} d="M17 11c0 2.76-2.24 5-5 5s-5-2.24-5-5H5c0 3.53 2.61 6.43 6 6.92V21h2v-3.08c3.39-.49 6-3.39 6-6.92h-2z"/>
+  </svg>
+);
+TwoToneMicIcon.displayName = 'TwoToneMicIcon';
+export const MicTwoToneIcon = TwoToneMicIcon;
+
+export const TwoToneMicNoneIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M12 12c.55 0 1-.45 1-1V5c0-.55-.45-1-1-1s-1 .45-1 1v6c0 .55.45 1 1 1z"/><path fill={color || 'currentColor'} d="M12 14c1.66 0 3-1.34 3-3V5c0-1.66-1.34-3-3-3S9 3.34 9 5v6c0 1.66 1.34 3 3 3zm-1-9c0-.55.45-1 1-1s1 .45 1 1v6c0 .55-.45 1-1 1s-1-.45-1-1V5zm6 6c0 2.76-2.24 5-5 5s-5-2.24-5-5H5c0 3.53 2.61 6.43 6 6.92V21h2v-3.08c3.39-.49 6-3.39 6-6.92h-2z"/>
+  </svg>
+);
+TwoToneMicNoneIcon.displayName = 'TwoToneMicNoneIcon';
+export const MicNoneTwoToneIcon = TwoToneMicNoneIcon;
+
+export const TwoToneMicOffIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M12 3.7c-.66 0-1.2.54-1.2 1.2v1.51l2.39 2.39l.01-3.9c0-.66-.54-1.2-1.2-1.2z"/><path fill={color || 'currentColor'} d="M19 11h-1.7c0 .58-.1 1.13-.27 1.64l1.27 1.27c.44-.88.7-1.87.7-2.91zM4.41 2.86L3 4.27l6 6V11c0 1.66 1.34 3 3 3c.23 0 .44-.03.65-.08l1.66 1.66c-.71.33-1.5.52-2.31.52c-2.76 0-5.3-2.1-5.3-5.1H5c0 3.41 2.72 6.23 6 6.72V21h2v-3.28a7.13 7.13 0 0 0 2.55-.9l4.2 4.2l1.41-1.41L4.41 2.86zM10.8 4.9c0-.66.54-1.2 1.2-1.2s1.2.54 1.2 1.2l-.01 3.91L15 10.6V5c0-1.66-1.34-3-3-3c-1.54 0-2.79 1.16-2.96 2.65l1.76 1.76V4.9z"/>
+  </svg>
+);
+TwoToneMicOffIcon.displayName = 'TwoToneMicOffIcon';
+export const MicOffTwoToneIcon = TwoToneMicOffIcon;
+
+export const TwoToneMissedVideoCallIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M15 13.5V8H5v8h10v-2.5zM11 15l-3.89-3.89v2.55H6V9.22h4.44v1.11H7.89l3.11 3.1l2.99-3.01l.78.79L11 15z"/><path fill={color || 'currentColor'} d="M3 17c0 .55.45 1 1 1h12c.55 0 1-.45 1-1v-3.5l4 4v-11l-4 4V7c0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1v10zm2-9h10v8H5V8zm6 5.43l-3.11-3.1h2.55V9.22H6v4.44h1.11v-2.55L11 15l3.77-3.79l-.78-.79z"/>
+  </svg>
+);
+TwoToneMissedVideoCallIcon.displayName = 'TwoToneMissedVideoCallIcon';
+export const MissedVideoCallTwoToneIcon = TwoToneMissedVideoCallIcon;
+
+export const TwoToneMovieIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M20 10H5.76L4 6.47V18h16z"/><path fill={color || 'currentColor'} d="M2.01 6L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V4h-4l2 4h-3l-2-4h-2l2 4h-3l-2-4H8l2 4H7L5 4H4c-1.1 0-1.99.9-1.99 2zM4 6.47L5.76 10H20v8H4V6.47z"/>
+  </svg>
+);
+TwoToneMovieIcon.displayName = 'TwoToneMovieIcon';
+export const MovieTwoToneIcon = TwoToneMovieIcon;
+
+export const TwoToneMusicVideoIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M3 19h18V5H3v14zm8-7c.35 0 .69.07 1 .18V6h5v2h-3v7.03A3.003 3.003 0 0 1 11 18c-1.66 0-3-1.34-3-3s1.34-3 3-3z"/><path fill={color || 'currentColor'} d="M21 3H3c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H3V5h18v14zm-10-1c1.65 0 2.98-1.33 3-2.97V8h3V6h-5v6.18c-.31-.11-.65-.18-1-.18c-1.66 0-3 1.34-3 3s1.34 3 3 3z"/>
+  </svg>
+);
+TwoToneMusicVideoIcon.displayName = 'TwoToneMusicVideoIcon';
+export const MusicVideoTwoToneIcon = TwoToneMusicVideoIcon;
+
+export const TwoToneNewReleasesIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M18.49 9.89l.26-2.79l-2.74-.62l-1.43-2.41L12 5.18L9.42 4.07L7.99 6.48l-2.74.62l.26 2.78L3.66 12l1.85 2.11l-.26 2.8l2.74.62l1.43 2.41L12 18.82l2.58 1.11l1.43-2.41l2.74-.62l-.26-2.79L20.34 12l-1.85-2.11zM13 17h-2v-2h2v2zm0-4h-2V7h2v6z"/><path fill={color || 'currentColor'} d="M20.9 5.54l-3.61-.82l-1.89-3.18L12 3L8.6 1.54L6.71 4.72l-3.61.81l.34 3.68L1 12l2.44 2.78l-.34 3.69l3.61.82l1.89 3.18L12 21l3.4 1.46l1.89-3.18l3.61-.82l-.34-3.68L23 12l-2.44-2.78l.34-3.68zM18.75 16.9l-2.74.62l-1.43 2.41L12 18.82l-2.58 1.11l-1.43-2.41l-2.74-.62l.26-2.8L3.66 12l1.85-2.12l-.26-2.78l2.74-.61l1.43-2.41L12 5.18l2.58-1.11l1.43 2.41l2.74.62l-.26 2.79L20.34 12l-1.85 2.11l.26 2.79zM11 15h2v2h-2zm0-8h2v6h-2z"/>
+  </svg>
+);
+TwoToneNewReleasesIcon.displayName = 'TwoToneNewReleasesIcon';
+export const NewReleasesTwoToneIcon = TwoToneNewReleasesIcon;
+
+export const TwoToneNotInterestedIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M12 22c5.52 0 10-4.48 10-10S17.52 2 12 2S2 6.48 2 12s4.48 10 10 10zm0-18c4.42 0 8 3.58 8 8c0 1.85-.63 3.55-1.69 4.9L7.1 5.69A7.902 7.902 0 0 1 12 4zM5.69 7.1L16.9 18.31A7.902 7.902 0 0 1 12 20c-4.42 0-8-3.58-8-8c0-1.85.63-3.55 1.69-4.9z"/>
+  </svg>
+);
+TwoToneNotInterestedIcon.displayName = 'TwoToneNotInterestedIcon';
+export const NotInterestedTwoToneIcon = TwoToneNotInterestedIcon;
+
+export const TwoToneNoteIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M15 6H4v12.01h16V11h-5z"/><path fill={color || 'currentColor'} d="M4 4c-1.1 0-2 .9-2 2v12.01c0 1.1.9 1.99 2 1.99h16c1.1 0 2-.9 2-2v-8l-6-6H4zm16 14.01H4V6h11v5h5v7.01z"/>
+  </svg>
+);
+TwoToneNoteIcon.displayName = 'TwoToneNoteIcon';
+export const NoteTwoToneIcon = TwoToneNoteIcon;
+
+export const TwoTonePauseIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M6 5h4v14H6zm8 0h4v14h-4z"/>
+  </svg>
+);
+TwoTonePauseIcon.displayName = 'TwoTonePauseIcon';
+export const PauseTwoToneIcon = TwoTonePauseIcon;
+
+export const TwoTonePauseCircleIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M12 4c-4.41 0-8 3.59-8 8s3.59 8 8 8s8-3.59 8-8s-3.59-8-8-8zm-1 12H9V8h2v8zm4 0h-2V8h2v8z"/><path fill={color || 'currentColor'} d="M13 8h2v8h-2zM9 8h2v8H9z"/><path fill={color || 'currentColor'} d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8s8 3.59 8 8s-3.59 8-8 8z"/>
+  </svg>
+);
+TwoTonePauseCircleIcon.displayName = 'TwoTonePauseCircleIcon';
+export const PauseCircleTwoToneIcon = TwoTonePauseCircleIcon;
+
+export const TwoTonePauseCircleFilledIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M12 4c-4.41 0-8 3.59-8 8s3.59 8 8 8s8-3.59 8-8s-3.59-8-8-8zm-1 12H9V8h2v8zm4 0h-2V8h2v8z"/><path fill={color || 'currentColor'} d="M13 8h2v8h-2zM9 8h2v8H9z"/><path fill={color || 'currentColor'} d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8s8 3.59 8 8s-3.59 8-8 8z"/>
+  </svg>
+);
+TwoTonePauseCircleFilledIcon.displayName = 'TwoTonePauseCircleFilledIcon';
+export const PauseCircleFilledTwoToneIcon = TwoTonePauseCircleFilledIcon;
+
+export const TwoTonePauseCircleOutlineIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M13 8h2v8h-2zM9 8h2v8H9zm3 14c5.52 0 10-4.48 10-10S17.52 2 12 2S2 6.48 2 12s4.48 10 10 10zm0-18c4.41 0 8 3.59 8 8s-3.59 8-8 8s-8-3.59-8-8s3.59-8 8-8z"/>
+  </svg>
+);
+TwoTonePauseCircleOutlineIcon.displayName = 'TwoTonePauseCircleOutlineIcon';
+export const PauseCircleOutlineTwoToneIcon = TwoTonePauseCircleOutlineIcon;
+
+export const TwoTonePlayArrowIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M10 8.64v6.72L15.27 12z"/><path fill={color || 'currentColor'} d="M8 19l11-7L8 5v14zm2-10.36L15.27 12L10 15.36V8.64z"/>
+  </svg>
+);
+TwoTonePlayArrowIcon.displayName = 'TwoTonePlayArrowIcon';
+export const PlayArrowTwoToneIcon = TwoTonePlayArrowIcon;
+
+export const TwoTonePlayCircleIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M12 4c-4.41 0-8 3.59-8 8s3.59 8 8 8s8-3.59 8-8s-3.59-8-8-8zM9.5 16.5v-9l7 4.5l-7 4.5z"/><path fill={color || 'currentColor'} d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8s8 3.59 8 8s-3.59 8-8 8z"/><path fill={color || 'currentColor'} d="M9.5 16.5l7-4.5l-7-4.5z"/>
+  </svg>
+);
+TwoTonePlayCircleIcon.displayName = 'TwoTonePlayCircleIcon';
+export const PlayCircleTwoToneIcon = TwoTonePlayCircleIcon;
+
+export const TwoTonePlayCircleFilledIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M12 20c4.41 0 8-3.59 8-8s-3.59-8-8-8s-8 3.59-8 8s3.59 8 8 8zM10 7.5l6 4.5l-6 4.5v-9z"/><path fill={color || 'currentColor'} d="M12 22c5.52 0 10-4.48 10-10S17.52 2 12 2S2 6.48 2 12s4.48 10 10 10zm0-18c4.41 0 8 3.59 8 8s-3.59 8-8 8s-8-3.59-8-8s3.59-8 8-8zm-2 3.5v9l6-4.5z"/>
+  </svg>
+);
+TwoTonePlayCircleFilledIcon.displayName = 'TwoTonePlayCircleFilledIcon';
+export const PlayCircleFilledTwoToneIcon = TwoTonePlayCircleFilledIcon;
+
+export const TwoTonePlayCircleFilledWhiteIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M12 20c4.41 0 8-3.59 8-8s-3.59-8-8-8s-8 3.59-8 8s3.59 8 8 8zM10 7.5l6 4.5l-6 4.5v-9z"/><path fill={color || 'currentColor'} d="M12 22c5.52 0 10-4.48 10-10S17.52 2 12 2S2 6.48 2 12s4.48 10 10 10zm0-18c4.41 0 8 3.59 8 8s-3.59 8-8 8s-8-3.59-8-8s3.59-8 8-8zm-2 3.5v9l6-4.5z"/>
+  </svg>
+);
+TwoTonePlayCircleFilledWhiteIcon.displayName = 'TwoTonePlayCircleFilledWhiteIcon';
+export const PlayCircleFilledWhiteTwoToneIcon = TwoTonePlayCircleFilledWhiteIcon;
+
+export const TwoTonePlayCircleOutlineIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M10 16.5l6-4.5l-6-4.5zM12 2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8s8 3.59 8 8s-3.59 8-8 8z"/>
+  </svg>
+);
+TwoTonePlayCircleOutlineIcon.displayName = 'TwoTonePlayCircleOutlineIcon';
+export const PlayCircleOutlineTwoToneIcon = TwoTonePlayCircleOutlineIcon;
+
+export const TwoTonePlayDisabledIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M10 12.83v2.53l1.55-.99z"/><path fill={color || 'currentColor'} d="M2.81 2.81L1.39 4.22L8 10.83V19l4.99-3.18l6.78 6.78l1.41-1.41L2.81 2.81zM10 15.36v-2.53l1.55 1.55l-1.55.98zM19 12L8 5v.17l8.45 8.45L19 12z"/>
+  </svg>
+);
+TwoTonePlayDisabledIcon.displayName = 'TwoTonePlayDisabledIcon';
+export const PlayDisabledTwoToneIcon = TwoTonePlayDisabledIcon;
+
+export const TwoTonePlaylistAddIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M14 10H3v2h11v-2zm0-4H3v2h11V6zm4 8v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zM3 16h7v-2H3v2z"/>
+  </svg>
+);
+TwoTonePlaylistAddIcon.displayName = 'TwoTonePlaylistAddIcon';
+export const PlaylistAddTwoToneIcon = TwoTonePlaylistAddIcon;
+
+export const TwoTonePlaylistAddCheckIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M3 10h11v2H3zm0-4h11v2H3zm0 8h7v2H3zm17.59-2.07l-4.25 4.24l-2.12-2.12l-1.41 1.41L16.34 19L22 13.34z"/>
+  </svg>
+);
+TwoTonePlaylistAddCheckIcon.displayName = 'TwoTonePlaylistAddCheckIcon';
+export const PlaylistAddCheckTwoToneIcon = TwoTonePlaylistAddCheckIcon;
+
+export const TwoTonePlaylistAddCheckCircleIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M12 4c-4.41 0-8 3.59-8 8s3.59 8 8 8s8-3.59 8-8s-3.59-8-8-8zM7 7h7v2H7V7zm0 3h7v2H7v-2zm3 5H7v-2h3v2zm4.05 3.36l-2.83-2.83l1.41-1.41l1.41 1.41L17.59 12L19 13.41l-4.95 4.95z"/><path fill={color || 'currentColor'} d="M12 4c4.41 0 8 3.59 8 8s-3.59 8-8 8s-8-3.59-8-8s3.59-8 8-8zm0-2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2zm2 8H7v2h7v-2zm0-3H7v2h7V7zm-7 8h3v-2H7v2zm12-1.59L17.59 12l-3.54 3.54l-1.41-1.41l-1.41 1.41l2.83 2.83L19 13.41z"/>
+  </svg>
+);
+TwoTonePlaylistAddCheckCircleIcon.displayName = 'TwoTonePlaylistAddCheckCircleIcon';
+export const PlaylistAddCheckCircleTwoToneIcon = TwoTonePlaylistAddCheckCircleIcon;
+
+export const TwoTonePlaylistAddCircleIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M12 4c-4.41 0-8 3.59-8 8s3.59 8 8 8s8-3.59 8-8s-3.59-8-8-8zM7 7h7v2H7V7zm3 8H7v-2h3v2zm-3-3v-2h7v2H7zm10 3v2h-2v-2h-2v-2h2v-2h2v2h2v2h-2z"/><path fill={color || 'currentColor'} d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8s8 3.59 8 8s-3.59 8-8 8zm2-10H7v2h7v-2zm0-3H7v2h7V7zm-7 8h3v-2H7v2zm12-2v2h-2v2h-2v-2h-2v-2h2v-2h2v2h2z"/>
+  </svg>
+);
+TwoTonePlaylistAddCircleIcon.displayName = 'TwoTonePlaylistAddCircleIcon';
+export const PlaylistAddCircleTwoToneIcon = TwoTonePlaylistAddCircleIcon;
+
+export const TwoTonePlaylistPlayIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M3 10h11v2H3zm0-4h11v2H3zm0 8h7v2H3zm13-1v8l6-4z"/>
+  </svg>
+);
+TwoTonePlaylistPlayIcon.displayName = 'TwoTonePlaylistPlayIcon';
+export const PlaylistPlayTwoToneIcon = TwoTonePlaylistPlayIcon;
+
+export const TwoTonePlaylistRemoveIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M14 10H3v2h11v-2zm0-4H3v2h11V6zM3 16h7v-2H3v2zm11.41 6L17 19.41L19.59 22L21 20.59L18.41 18L21 15.41L19.59 14L17 16.59L14.41 14L13 15.41L15.59 18L13 20.59L14.41 22z"/>
+  </svg>
+);
+TwoTonePlaylistRemoveIcon.displayName = 'TwoTonePlaylistRemoveIcon';
+export const PlaylistRemoveTwoToneIcon = TwoTonePlaylistRemoveIcon;
+
+export const TwoToneQueueIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M8 16h12V4H8v12zm1-7h4V5h2v4h4v2h-4v4h-2v-4H9V9z"/><path fill={color || 'currentColor'} d="M2 20c0 1.1.9 2 2 2h14v-2H4V6H2v14zM20 2H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H8V4h12v12zm-7-1h2v-4h4V9h-4V5h-2v4H9v2h4z"/>
+  </svg>
+);
+TwoToneQueueIcon.displayName = 'TwoToneQueueIcon';
+export const QueueTwoToneIcon = TwoToneQueueIcon;
+
+export const TwoToneQueueMusicIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <circle cx="16" cy="17" fillOpacity={fillOpacity ?? 0.3} r="1"/><path fill={color || 'currentColor'} d="M3 10h12v2H3v-2zm0 4h8v2H3v-2zm0-8h12v2H3V6zm14 8.18c-.31-.11-.65-.18-1-.18c-1.66 0-3 1.34-3 3s1.34 3 3 3s3-1.34 3-3V8h3V6h-5v8.18z"/>
+  </svg>
+);
+TwoToneQueueMusicIcon.displayName = 'TwoToneQueueMusicIcon';
+export const QueueMusicTwoToneIcon = TwoToneQueueMusicIcon;
+
+export const TwoToneQueuePlayNextIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M13 15v-3h3v-2h-3V7h-2v3H8v2h3v3zm5 0l3 3l-3 3l1.5 1.5L24 18l-4.5-4.5zM8 19v2h8v-2h2v-2H3V5h18v8h2V5a2 2 0 0 0-2-2H3c-1.11 0-2 .89-2 2v12a2 2 0 0 0 2 2h5z"/>
+  </svg>
+);
+TwoToneQueuePlayNextIcon.displayName = 'TwoToneQueuePlayNextIcon';
+export const QueuePlayNextTwoToneIcon = TwoToneQueuePlayNextIcon;
+
+export const TwoToneRadioIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M20 13H4v7h16v-7zM8 18.98a2.5 2.5 0 0 1 0-5a2.5 2.5 0 0 1 0 5z"/><path fill={color || 'currentColor'} d="M2 20a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V8c0-1.11-.89-2-2-2H8.3l8.26-3.34L15.88 1L3.24 6.15C2.51 6.43 2 7.17 2 8v12zM4 8h16v3h-2V9h-2v2H4V8zm0 5h16v7H4v-7z"/><circle cx="8" cy="16.48" r="2.5"/>
+  </svg>
+);
+TwoToneRadioIcon.displayName = 'TwoToneRadioIcon';
+export const RadioTwoToneIcon = TwoToneRadioIcon;
+
+export const TwoToneRecentActorsIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M13 7H3v10h10V7zM8 8c1.07 0 1.95.87 1.95 1.95c0 1.07-.87 1.95-1.95 1.95s-1.95-.87-1.95-1.95S6.93 8 8 8zm3.89 8H4.11v-.65c0-1.3 2.59-1.95 3.89-1.95s3.89.65 3.89 1.95V16z"/><path fill={color || 'currentColor'} d="M21 5h2v14h-2zm-4 0h2v14h-2zm-3 14c.55 0 1-.45 1-1V6c0-.55-.45-1-1-1H2c-.55 0-1 .45-1 1v12c0 .55.45 1 1 1h12zM3 7h10v10H3V7z"/><circle cx="8" cy="9.94" r="1.95"/><path fill={color || 'currentColor'} d="M8 13.4c-1.3 0-3.89.65-3.89 1.95V16h7.78v-.65c0-1.3-2.59-1.95-3.89-1.95z"/>
+  </svg>
+);
+TwoToneRecentActorsIcon.displayName = 'TwoToneRecentActorsIcon';
+export const RecentActorsTwoToneIcon = TwoToneRecentActorsIcon;
+
+export const TwoToneRemoveFromQueueIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M3 17h18V5H3v12zm5-7h8v2H8v-2z"/><path fill={color || 'currentColor'} d="M21 3H3c-1.11 0-2 .89-2 2v12a2 2 0 0 0 2 2h5v2h8v-2h5c1.1 0 2-.9 2-2V5a2 2 0 0 0-2-2zm0 14H3V5h18v12zM8 10h8v2H8z"/>
+  </svg>
+);
+TwoToneRemoveFromQueueIcon.displayName = 'TwoToneRemoveFromQueueIcon';
+export const RemoveFromQueueTwoToneIcon = TwoToneRemoveFromQueueIcon;
+
+export const TwoToneRepeatIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M7 22v-3h12v-6h-2v4H7v-3l-4 4zM21 6l-4-4v3H5v6h2V7h10v3z"/>
+  </svg>
+);
+TwoToneRepeatIcon.displayName = 'TwoToneRepeatIcon';
+export const RepeatTwoToneIcon = TwoToneRepeatIcon;
+
+export const TwoToneRepeatOnIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M21 1H3c-1.1 0-2 .9-2 2v18c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V3c0-1.1-.9-2-2-2zm-2 18H7v3l-4-4l4-4v3h10v-4h2v6zm-2-9V7H7v4H5V5h12V2l4 4l-4 4z"/>
+  </svg>
+);
+TwoToneRepeatOnIcon.displayName = 'TwoToneRepeatOnIcon';
+export const RepeatOnTwoToneIcon = TwoToneRepeatOnIcon;
+
+export const TwoToneRepeatOneIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M13 15V9h-1l-2 1v1h1.5v4zm6-2h-2v4H7v-3l-4 4l4 4v-3h12zM17 2v3H5v6h2V7h10v3l4-4z"/>
+  </svg>
+);
+TwoToneRepeatOneIcon.displayName = 'TwoToneRepeatOneIcon';
+export const RepeatOneTwoToneIcon = TwoToneRepeatOneIcon;
+
+export const TwoToneRepeatOneOnIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M21 1H3c-1.1 0-2 .9-2 2v18c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V3c0-1.1-.9-2-2-2zm-2 18H7v3l-4-4l4-4v3h10v-4h2v6zm-9-8.5V9h3v6h-1.5v-4.5H10zm7-.5V7H7v4H5V5h12V2l4 4l-4 4z"/>
+  </svg>
+);
+TwoToneRepeatOneOnIcon.displayName = 'TwoToneRepeatOneOnIcon';
+export const RepeatOneOnTwoToneIcon = TwoToneRepeatOneOnIcon;
+
+export const TwoToneReplayIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6s-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8s-3.58-8-8-8V1L7 6z"/>
+  </svg>
+);
+TwoToneReplayIcon.displayName = 'TwoToneReplayIcon';
+export const ReplayTwoToneIcon = TwoToneReplayIcon;
+
+export const TwoToneReplay10Icon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M11.99 5V1l-5 5l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6s-6-2.69-6-6h-2c0 4.42 3.58 8 8 8s8-3.58 8-8s-3.58-8-8-8zm-1.1 11h-.85v-3.26l-1.01.31v-.69l1.77-.63h.09V16zm4.28-1.76c0 .32-.03.6-.1.82s-.17.42-.29.57s-.28.26-.45.33s-.37.1-.59.1s-.41-.03-.59-.1s-.33-.18-.46-.33s-.23-.34-.3-.57s-.11-.5-.11-.82v-.74c0-.32.03-.6.1-.82s.17-.42.29-.57s.28-.26.45-.33s.37-.1.59-.1s.41.03.59.1s.33.18.46.33s.23.34.3.57s.11.5.11.82v.74zm-.85-.86c0-.19-.01-.35-.04-.48s-.07-.23-.12-.31s-.11-.14-.19-.17s-.16-.05-.25-.05s-.18.02-.25.05s-.14.09-.19.17s-.09.18-.12.31s-.04.29-.04.48v.97c0 .19.01.35.04.48s.07.24.12.32s.11.14.19.17s.16.05.25.05s.18-.02.25-.05s.14-.09.19-.17s.09-.19.11-.32s.04-.29.04-.48v-.97z"/>
+  </svg>
+);
+TwoToneReplay10Icon.displayName = 'TwoToneReplay10Icon';
+export const Replay10TwoToneIcon = TwoToneReplay10Icon;
+
+export const TwoToneReplay30Icon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6s-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8s-3.58-8-8-8zm-2.44 8.49h.45c.21 0 .37-.05.48-.16s.16-.25.16-.43a.538.538 0 0 0-.15-.39c-.05-.05-.11-.09-.18-.11s-.16-.04-.25-.04c-.08 0-.15.01-.22.03s-.13.05-.18.1s-.09.09-.12.15s-.05.13-.05.2h-.85a1.06 1.06 0 0 1 .41-.85c.13-.1.27-.18.44-.23s.35-.08.54-.08c.21 0 .41.03.59.08s.33.13.46.23s.23.23.3.38s.11.33.11.53a.842.842 0 0 1-.17.52a1.1 1.1 0 0 1-.48.39c.24.09.42.21.54.39s.18.38.18.61c0 .2-.04.38-.12.53s-.18.29-.32.39s-.29.19-.48.24s-.38.08-.6.08c-.18 0-.36-.02-.53-.07s-.33-.12-.46-.23s-.25-.23-.33-.38s-.12-.34-.12-.55h.85c0 .08.02.15.05.22s.07.12.13.17s.12.09.2.11s.16.04.25.04c.1 0 .19-.01.27-.04s.15-.07.2-.12s.1-.11.13-.18s.04-.15.04-.24c0-.11-.02-.21-.05-.29s-.08-.15-.14-.2s-.13-.09-.22-.11s-.18-.04-.29-.04h-.47v-.65zm5.74.75c0 .32-.03.6-.1.82s-.17.42-.29.57s-.28.26-.45.33s-.37.1-.59.1s-.41-.03-.59-.1s-.33-.18-.46-.33s-.23-.34-.3-.57s-.11-.5-.11-.82v-.74c0-.32.03-.6.1-.82s.17-.42.29-.57s.28-.26.45-.33s.37-.1.59-.1s.41.03.59.1s.33.18.46.33s.23.34.3.57s.11.5.11.82v.74zm-.85-.86c0-.19-.01-.35-.04-.48s-.07-.23-.12-.31s-.11-.14-.19-.17s-.16-.05-.25-.05s-.18.02-.25.05s-.14.09-.19.17s-.09.18-.12.31s-.04.29-.04.48v.97c0 .19.01.35.04.48s.07.24.12.32s.11.14.19.17s.16.05.25.05s.18-.02.25-.05s.14-.09.19-.17s.09-.19.11-.32c.03-.13.04-.29.04-.48v-.97z"/>
+  </svg>
+);
+TwoToneReplay30Icon.displayName = 'TwoToneReplay30Icon';
+export const Replay30TwoToneIcon = TwoToneReplay30Icon;
+
+export const TwoToneReplay5Icon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6s-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8s-3.58-8-8-8zm-1.31 8.9l.25-2.17h2.39v.71h-1.7l-.11.92c.03-.02.07-.03.11-.05s.09-.04.15-.05s.12-.03.18-.04s.13-.02.2-.02c.21 0 .39.03.55.1s.3.16.41.28s.2.27.25.45s.09.38.09.6c0 .19-.03.37-.09.54s-.15.32-.27.45s-.27.24-.45.31s-.39.12-.64.12c-.18 0-.36-.03-.53-.08s-.32-.14-.46-.24s-.24-.24-.32-.39s-.13-.33-.13-.53h.84c.02.18.08.32.19.41s.25.15.42.15a.49.49 0 0 0 .45-.23c.04-.07.08-.15.11-.25s.03-.2.03-.31s-.01-.21-.04-.31s-.07-.17-.13-.24s-.13-.12-.21-.15s-.19-.05-.3-.05c-.08 0-.15.01-.2.02s-.11.03-.15.05s-.08.05-.12.07s-.07.06-.1.09l-.67-.16z"/>
+  </svg>
+);
+TwoToneReplay5Icon.displayName = 'TwoToneReplay5Icon';
+export const Replay5TwoToneIcon = TwoToneReplay5Icon;
+
+export const TwoToneReplayCircleFilledIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2zm6 10.5c0 3.31-2.69 6-6 6s-6-2.69-6-6h2c0 2.21 1.79 4 4 4s4-1.79 4-4s-1.79-4-4-4v3l-4-4l4-4v3c3.31 0 6 2.69 6 6z"/>
+  </svg>
+);
+TwoToneReplayCircleFilledIcon.displayName = 'TwoToneReplayCircleFilledIcon';
+export const ReplayCircleFilledTwoToneIcon = TwoToneReplayCircleFilledIcon;
+
+export const TwoToneSdIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M4 18h16V6H4v12zm9-9h4c.55 0 1 .45 1 1v4c0 .55-.45 1-1 1h-4V9zm-7 4h1.5v.5h2v-1H7c-.55 0-1-.45-1-1V10c0-.55.45-1 1-1h3c.55 0 1 .45 1 1v1H9.5v-.5h-2v1H10c.55 0 1 .45 1 1V14c0 .55-.45 1-1 1H7c-.55 0-1-.45-1-1v-1z"/><path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M14.5 10.5h2v3h-2z"/><path fill={color || 'currentColor'} d="M7 15h3c.55 0 1-.45 1-1v-1.5c0-.55-.45-1-1-1H7.5v-1h2v.5H11v-1c0-.55-.45-1-1-1H7c-.55 0-1 .45-1 1v1.5c0 .55.45 1 1 1h2.5v1h-2V13H6v1c0 .55.45 1 1 1zm11-1v-4c0-.55-.45-1-1-1h-4v6h4c.55 0 1-.45 1-1zm-1.5-.5h-2v-3h2v3z"/><path fill={color || 'currentColor'} d="M20 4H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 14H4V6h16v12z"/>
+  </svg>
+);
+TwoToneSdIcon.displayName = 'TwoToneSdIcon';
+export const SdTwoToneIcon = TwoToneSdIcon;
+
+export const TwoToneShuffleIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M20 4h-5.5l2.04 2.04L4 18.59L5.41 20L17.96 7.46L20 9.5zM5.41 4L4 5.41l5.17 5.17l1.42-1.41zM20 20v-5.5l-2.04 2.04l-3.13-3.13l-1.41 1.41l3.13 3.13L14.5 20z"/>
+  </svg>
+);
+TwoToneShuffleIcon.displayName = 'TwoToneShuffleIcon';
+export const ShuffleTwoToneIcon = TwoToneShuffleIcon;
+
+export const TwoToneShuffleOnIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M21 1H3c-1.1 0-2 .9-2 2v18c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V3c0-1.1-.9-2-2-2zM5.41 4l5.18 5.17l-1.42 1.41L4 5.41L5.41 4zM20 20h-5.5l2.05-2.05l-3.13-3.13l1.41-1.41l3.13 3.13L20 14.5V20zm0-10.5l-2.04-2.04L5.41 20L4 18.59L16.54 6.04L14.5 4H20v5.5z"/>
+  </svg>
+);
+TwoToneShuffleOnIcon.displayName = 'TwoToneShuffleOnIcon';
+export const ShuffleOnTwoToneIcon = TwoToneShuffleOnIcon;
+
+export const TwoToneSkipNextIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M8 9.86v4.28L11.03 12z"/><path fill={color || 'currentColor'} d="M14.5 12L6 6v12l8.5-6zM8 9.86L11.03 12L8 14.14V9.86zM16 6h2v12h-2z"/>
+  </svg>
+);
+TwoToneSkipNextIcon.displayName = 'TwoToneSkipNextIcon';
+export const SkipNextTwoToneIcon = TwoToneSkipNextIcon;
+
+export const TwoToneSkipPreviousIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M16 14.14V9.86L12.97 12z"/><path fill={color || 'currentColor'} d="M6 6h2v12H6zm12 12V6l-8.5 6l8.5 6zm-2-3.86L12.97 12L16 9.86v4.28z"/>
+  </svg>
+);
+TwoToneSkipPreviousIcon.displayName = 'TwoToneSkipPreviousIcon';
+export const SkipPreviousTwoToneIcon = TwoToneSkipPreviousIcon;
+
+export const TwoToneSlowMotionVideoIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M4.26 18.32l1.43-1.43A7.868 7.868 0 0 1 4.07 13H2.05c.2 2.01 1 3.84 2.21 5.32zM7.1 5.69A7.941 7.941 0 0 1 11 4.07V2.05c-2.01.2-3.84 1-5.32 2.21L7.1 5.69zM2.05 11h2.02c.18-1.46.76-2.79 1.62-3.9L4.26 5.68A9.949 9.949 0 0 0 2.05 11zm11-8.95v2.02C16.97 4.59 20 7.95 20 12s-3.03 7.41-6.95 7.93v2.02C18.08 21.42 22 17.16 22 12c0-5.16-3.92-9.42-8.95-9.95zM16 12l-2.95-2.21L10 7.5v9l3.05-2.29zM5.68 19.74A9.981 9.981 0 0 0 11 21.95v-2.02a7.941 7.941 0 0 1-3.9-1.62l-1.42 1.43z"/>
+  </svg>
+);
+TwoToneSlowMotionVideoIcon.displayName = 'TwoToneSlowMotionVideoIcon';
+export const SlowMotionVideoTwoToneIcon = TwoToneSlowMotionVideoIcon;
+
+export const TwoToneSnoozeIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M9 11h3.63L9 15.2V17h6v-2h-3.63L15 10.8V9H9zm8.337-9.19l4.607 3.845l-1.28 1.535l-4.61-3.843zm-10.674 0l1.282 1.536L3.337 7.19l-1.28-1.536zM12 4a9 9 0 1 0 .001 18.001A9 9 0 0 0 12 4zm0 16c-3.86 0-7-3.14-7-7s3.14-7 7-7s7 3.14 7 7s-3.14 7-7 7z"/>
+  </svg>
+);
+TwoToneSnoozeIcon.displayName = 'TwoToneSnoozeIcon';
+export const SnoozeTwoToneIcon = TwoToneSnoozeIcon;
+
+export const TwoToneSortByAlphaIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M14.94 4.66L12.58 2.3l-2.36 2.36zm-4.55 13.07h1.84L7.74 6.27H6.1L1.6 17.73h1.84l.92-2.45h5.11l.92 2.45zm-5.42-4.09l1.94-5.18l1.94 5.18H4.97zm7.61 8.06l2.33-2.33h-4.66zm9.08-14.16V6.28h-8.3v1.6h5.88l-5.92 8.56v1.29h8.53v-1.59h-6.12z"/>
+  </svg>
+);
+TwoToneSortByAlphaIcon.displayName = 'TwoToneSortByAlphaIcon';
+export const SortByAlphaTwoToneIcon = TwoToneSortByAlphaIcon;
+
+export const TwoToneSpeedIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M20.38 8.57l-1.23 1.85a8 8 0 0 1-.22 7.58H5.07A8 8 0 0 1 15.58 6.85l1.85-1.23A10 10 0 0 0 3.35 19a2 2 0 0 0 1.72 1h13.85a2 2 0 0 0 1.74-1a10 10 0 0 0-.27-10.44z"/><path fill={color || 'currentColor'} d="M10.59 15.41a2 2 0 0 0 2.83 0l5.66-8.49l-8.49 5.66a2 2 0 0 0 0 2.83z"/>
+  </svg>
+);
+TwoToneSpeedIcon.displayName = 'TwoToneSpeedIcon';
+export const SpeedTwoToneIcon = TwoToneSpeedIcon;
+
+export const TwoToneStopIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M8 8h8v8H8z"/><path fill={color || 'currentColor'} d="M6 18h12V6H6v12zM8 8h8v8H8V8z"/>
+  </svg>
+);
+TwoToneStopIcon.displayName = 'TwoToneStopIcon';
+export const StopTwoToneIcon = TwoToneStopIcon;
+
+export const TwoToneStopCircleIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M12 4c-4.42 0-8 3.58-8 8s3.58 8 8 8s8-3.58 8-8s-3.58-8-8-8zm4 12H8V8h8v8z"/><path fill={color || 'currentColor'} d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10s10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8s8 3.58 8 8s-3.58 8-8 8zm4-4H8V8h8v8z"/>
+  </svg>
+);
+TwoToneStopCircleIcon.displayName = 'TwoToneStopCircleIcon';
+export const StopCircleTwoToneIcon = TwoToneStopCircleIcon;
+
+export const TwoToneSubscriptionsIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M4 20h16v-8H4v8zm6-7.27L16 16l-6 3.26v-6.53z"/><path fill={color || 'currentColor'} d="M4 6h16v2H4zm2-4h12v2H6zm14 8H4c-1.1 0-2 .9-2 2v8c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2v-8c0-1.1-.9-2-2-2zm0 10H4v-8h16v8zm-10-7.27v6.53L16 16z"/>
+  </svg>
+);
+TwoToneSubscriptionsIcon.displayName = 'TwoToneSubscriptionsIcon';
+export const SubscriptionsTwoToneIcon = TwoToneSubscriptionsIcon;
+
+export const TwoToneSubtitlesIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M4 18h16V6H4v12zm14-2h-2v-2h2v2zm-8-6h8v2h-8v-2zm-4 0h2v2H6v-2zm0 4h8v2H6v-2z"/><path fill={color || 'currentColor'} d="M20 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 14H4V6h16v12zM6 10h2v2H6zm0 4h8v2H6zm10 0h2v2h-2zm-6-4h8v2h-8z"/>
+  </svg>
+);
+TwoToneSubtitlesIcon.displayName = 'TwoToneSubtitlesIcon';
+export const SubtitlesTwoToneIcon = TwoToneSubtitlesIcon;
+
+export const TwoToneSurroundSoundIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M4 18h16V6H4v12zM16.94 7.06C18.32 8.41 19 10.21 19 12s-.68 3.59-2.05 4.95l-1.23-1.23A5.262 5.262 0 0 0 17.25 12c0-1.35-.52-2.69-1.54-3.71l1.23-1.23zM12 8.5c1.93 0 3.5 1.57 3.5 3.5s-1.57 3.5-3.5 3.5s-3.5-1.57-3.5-3.5s1.57-3.5 3.5-3.5zM7.05 7.05l1.23 1.23A5.305 5.305 0 0 0 6.75 12c0 1.35.52 2.69 1.54 3.71l-1.23 1.23C5.68 15.59 5 13.79 5 12s.68-3.59 2.05-4.95z"/><path fill={color || 'currentColor'} d="M20 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 14H4V6h16v12z"/><path fill={color || 'currentColor'} d="M8.29 15.71A5.233 5.233 0 0 1 6.75 12c0-1.35.52-2.69 1.53-3.72L7.05 7.05C5.68 8.41 5 10.21 5 12s.68 3.59 2.06 4.94l1.23-1.23zM12 15.5c1.93 0 3.5-1.57 3.5-3.5S13.93 8.5 12 8.5S8.5 10.07 8.5 12s1.57 3.5 3.5 3.5zm0-5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5s-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5zm3.72 5.22l1.23 1.23C18.32 15.59 19 13.79 19 12s-.68-3.59-2.06-4.94l-1.23 1.23A5.233 5.233 0 0 1 17.25 12c0 1.35-.52 2.69-1.53 3.72z"/>
+  </svg>
+);
+TwoToneSurroundSoundIcon.displayName = 'TwoToneSurroundSoundIcon';
+export const SurroundSoundTwoToneIcon = TwoToneSurroundSoundIcon;
+
+export const TwoToneVideoCallIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 16h10V8H5v8zm2-5h2V9h2v2h2v2h-2v2H9v-2H7v-2z"/><path fill={color || 'currentColor'} d="M17 7c0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.55 0 1-.45 1-1v-3.5l4 4v-11l-4 4V7zm-2 9H5V8h10v8zm-6-1h2v-2h2v-2h-2V9H9v2H7v2h2z"/>
+  </svg>
+);
+TwoToneVideoCallIcon.displayName = 'TwoToneVideoCallIcon';
+export const VideoCallTwoToneIcon = TwoToneVideoCallIcon;
+
+export const TwoToneVideoFileIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M13 9V4H6v16h12V9h-5zm3 8.06L14 16v1c0 .55-.45 1-1 1H9c-.55 0-1-.45-1-1v-4c0-.55.45-1 1-1h4c.55 0 1 .45 1 1v1l2-1.06v4.12z"/><path fill={color || 'currentColor'} d="M14 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V8l-6-6zM6 20V4h7v5h5v11H6zm8-6l2-1.06v4.12L14 16v1c0 .55-.45 1-1 1H9c-.55 0-1-.45-1-1v-4c0-.55.45-1 1-1h4c.55 0 1 .45 1 1v1z"/>
+  </svg>
+);
+TwoToneVideoFileIcon.displayName = 'TwoToneVideoFileIcon';
+export const VideoFileTwoToneIcon = TwoToneVideoFileIcon;
+
+export const TwoToneVideoLabelIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M3 5h18v11H3z"/><path fill={color || 'currentColor'} d="M21 3H3c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h18c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 13H3V5h18v11z"/>
+  </svg>
+);
+TwoToneVideoLabelIcon.displayName = 'TwoToneVideoLabelIcon';
+export const VideoLabelTwoToneIcon = TwoToneVideoLabelIcon;
+
+export const TwoToneVideoLibraryIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M8 16h12V4H8v12zm4-10.5l6 4.5l-6 4.5v-9z"/><path fill={color || 'currentColor'} d="M4 6H2v14c0 1.1.9 2 2 2h14v-2H4V6zm16-4H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H8V4h12v12zM12 5.5v9l6-4.5z"/>
+  </svg>
+);
+TwoToneVideoLibraryIcon.displayName = 'TwoToneVideoLibraryIcon';
+export const VideoLibraryTwoToneIcon = TwoToneVideoLibraryIcon;
+
+export const TwoToneVideoSettingsIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} d="M3 6h18v5h2V6c0-1.1-.9-2-2-2H3c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h9v-2H3V6z"/><path fill={color || 'currentColor'} d="M15 12L9 8v8zm7.71 6.43c.03-.29.04-.58.01-.86l1.07-.85c.1-.08.12-.21.06-.32l-1.03-1.79c-.06-.11-.19-.15-.31-.11l-1.28.5a3.44 3.44 0 0 0-.75-.42l-.2-1.36a.249.249 0 0 0-.25-.22h-2.07c-.12 0-.23.09-.25.21l-.2 1.36c-.26.11-.51.26-.74.42l-1.28-.5c-.12-.05-.25 0-.31.11l-1.03 1.79c-.06.11-.04.24.06.32l1.07.86c-.03.29-.04.58-.01.86l-1.07.85c-.1.08-.12.21-.06.32l1.03 1.79c.06.11.19.15.31.11l1.27-.5c.23.17.48.31.75.42l.2 1.36c.02.12.12.21.25.21h2.07c.12 0 .23-.09.25-.21l.2-1.36c.26-.11.51-.26.74-.42l1.28.5c.12.05.25 0 .31-.11l1.03-1.79c.06-.11.04-.24-.06-.32l-1.06-.85zM19 19.5c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5s1.5.67 1.5 1.5s-.67 1.5-1.5 1.5z"/>
+  </svg>
+);
+TwoToneVideoSettingsIcon.displayName = 'TwoToneVideoSettingsIcon';
+export const VideoSettingsTwoToneIcon = TwoToneVideoSettingsIcon;
+
+export const TwoToneVideocamIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 8h10v8H5z"/><path fill={color || 'currentColor'} d="M17 7c0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.55 0 1-.45 1-1v-3.5l4 4v-11l-4 4V7zm-2 9H5V8h10v8z"/>
+  </svg>
+);
+TwoToneVideocamIcon.displayName = 'TwoToneVideocamIcon';
+export const VideocamTwoToneIcon = TwoToneVideocamIcon;
+
+export const TwoToneVideocamOffIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M12.39 8L15 10.61V8zM5 8v8h9.73l-8-8z"/><path fill={color || 'currentColor'} d="M3.41 1.86L2 3.27L4.73 6H4c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.21 0 .39-.08.55-.18L19.73 21l1.41-1.41L3.41 1.86zM5 16V8h1.73l8 8H5zm10-8v2.61l6 6V6.5l-4 4V7c0-.55-.45-1-1-1h-5.61l2 2H15z"/>
+  </svg>
+);
+TwoToneVideocamOffIcon.displayName = 'TwoToneVideocamOffIcon';
+export const VideocamOffTwoToneIcon = TwoToneVideocamOffIcon;
+
+export const TwoToneVolumeDownIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M7 13h2.83L12 15.17V8.83L9.83 11H7z"/><path fill={color || 'currentColor'} d="M16 7.97v8.05c1.48-.73 2.5-2.25 2.5-4.02A4.5 4.5 0 0 0 16 7.97zM5 9v6h4l5 5V4L9 9H5zm7-.17v6.34L9.83 13H7v-2h2.83L12 8.83z"/>
+  </svg>
+);
+TwoToneVolumeDownIcon.displayName = 'TwoToneVolumeDownIcon';
+export const VolumeDownTwoToneIcon = TwoToneVolumeDownIcon;
+
+export const TwoToneVolumeMuteIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M9 13h2.83L14 15.17V8.83L11.83 11H9z"/><path fill={color || 'currentColor'} d="M7 9v6h4l5 5V4l-5 5H7zm7-.17v6.34L11.83 13H9v-2h2.83L14 8.83z"/>
+  </svg>
+);
+TwoToneVolumeMuteIcon.displayName = 'TwoToneVolumeMuteIcon';
+export const VolumeMuteTwoToneIcon = TwoToneVolumeMuteIcon;
+
+export const TwoToneVolumeOffIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M7.83 11H5v2h2.83L10 15.17v-3.76l-1.29-1.29z"/><path fill={color || 'currentColor'} d="M4.34 2.93L2.93 4.34L7.29 8.7L7 9H3v6h4l5 5v-6.59l4.18 4.18c-.65.49-1.38.88-2.18 1.11v2.06a8.94 8.94 0 0 0 3.61-1.75l2.05 2.05l1.41-1.41L4.34 2.93zM10 15.17L7.83 13H5v-2h2.83l.88-.88L10 11.41v3.76zM19 12c0 .82-.15 1.61-.41 2.34l1.53 1.53c.56-1.17.88-2.48.88-3.87c0-4.28-2.99-7.86-7-8.77v2.06c2.89.86 5 3.54 5 6.71zm-7-8l-1.88 1.88L12 7.76zm4.5 8A4.5 4.5 0 0 0 14 7.97v1.79l2.48 2.48c.01-.08.02-.16.02-.24z"/>
+  </svg>
+);
+TwoToneVolumeOffIcon.displayName = 'TwoToneVolumeOffIcon';
+export const VolumeOffTwoToneIcon = TwoToneVolumeOffIcon;
+
+export const TwoToneVolumeUpIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 13h2.83L10 15.17V8.83L7.83 11H5z"/><path fill={color || 'currentColor'} d="M3 9v6h4l5 5V4L7 9H3zm7-.17v6.34L7.83 13H5v-2h2.83L10 8.83zm4-.86v8.05c1.48-.73 2.5-2.25 2.5-4.02A4.5 4.5 0 0 0 14 7.97zm0-4.74v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77c0-4.28-2.99-7.86-7-8.77z"/>
+  </svg>
+);
+TwoToneVolumeUpIcon.displayName = 'TwoToneVolumeUpIcon';
+export const VolumeUpTwoToneIcon = TwoToneVolumeUpIcon;
+
+export const TwoToneWebIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M4 9h10.5v3.5H4zm0 5.5h10.5V18H4zM16.5 9H20v9h-3.5z"/><path fill={color || 'currentColor'} d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-5.5 14H4v-3.5h10.5V18zm0-5.5H4V9h10.5v3.5zM20 18h-3.5V9H20v9z"/>
+  </svg>
+);
+TwoToneWebIcon.displayName = 'TwoToneWebIcon';
+export const WebTwoToneIcon = TwoToneWebIcon;
+
+export const TwoToneWebAssetIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M5 8h14v10H5z"/><path fill={color || 'currentColor'} d="M19 4H5a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h14c1.1 0 2-.9 2-2V6a2 2 0 0 0-2-2zm0 14H5V8h14v10z"/>
+  </svg>
+);
+TwoToneWebAssetIcon.displayName = 'TwoToneWebAssetIcon';
+export const WebAssetTwoToneIcon = TwoToneWebAssetIcon;
+
+export const TwoToneWebAssetOffIcon: React.FC<IconProps> = ({ size = 24, color = 'currentColor', fillOpacity, className, ...props }) => (
+  <svg width={size} height={size} viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" className={className} {...props}>
+    <path fill={color || 'currentColor'} fillOpacity={fillOpacity ?? 0.3} d="M20 17.17V8h-9.17L20 17.17zM5.17 8H4v10h11.17l-10-10z"/><path fill={color || 'currentColor'} d="M6.83 4H20a2 2 0 0 1 2 2v12c0 .34-.09.66-.23.94L20 17.17V8h-9.17l-4-4zm13.66 19.31L17.17 20H4a2 2 0 0 1-2-2V6c0-.34.08-.66.23-.94L.69 3.51L2.1 2.1l19.8 19.8l-1.41 1.41zM15.17 18l-10-10H4v10h11.17z"/>
+  </svg>
+);
+TwoToneWebAssetOffIcon.displayName = 'TwoToneWebAssetOffIcon';
+export const WebAssetOffTwoToneIcon = TwoToneWebAssetOffIcon;