semi-design/packages/semi-ui/icons/_story/Others/index.jsx

import React from 'react';
import Icon from '../../index';

const Add = () => (
    <svg width="32" height="32" viewBox="0 0 32 32" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
        <g clipPath="url(#clip0)">
            <path fill="#9B9EA0" d="M23.0834 17.2498C23.7738 17.2498 24.3334 16.6902 24.3334 15.9998C24.3334 15.3095 23.7738 14.7498 23.0834 14.7498L17.2501 14.7498L17.2501 8.9165C17.2501 8.22615 16.6904 7.6665 16.0001 7.6665C15.3097 7.6665 14.7501 8.22615 14.7501 8.9165L14.7501 14.7498L8.91675 14.7498C8.22639 14.7498 7.66675 15.3095 7.66675 15.9998C7.66675 16.6902 8.22639 17.2498 8.91675 17.2498L14.7501 17.2498V23.0832C14.7501 23.7735 15.3097 24.3332 16.0001 24.3332C16.6904 24.3332 17.2501 23.7735 17.2501 23.0832V17.2498L23.0834 17.2498Z" />
        </g>
        <defs>
            <clipPath id="clip0">
                <path d="M6 6H26V26H6V6Z" fill="white" />
            </clipPath>
        </defs>
    </svg>
);


export default function Demo() {
    return (
        <>
            <Icon svg={<Add />} style={{ color: '#f93920' }} />
        </>
    );
}