import React from 'react';

type SettingsIconProps = {
    color?: string
    width?: string
    height?: string
}

const SettingsIcon = ({color,width,height}: SettingsIconProps) => {

    return (
        <svg xmlns="http://www.w3.org/2000/svg" width={width} height={height} viewBox="0 0 41.982 37.021">
            <g id="control" transform="translate(0.5 0.5)">
                <g id="Group_23639" data-name="Group 23639">
                <g id="Group_23638" data-name="Group 23638">
                    <path id="Path_22886" data-name="Path 22886" d="M39.782,4.8h-6.2a6,6,0,0,0-11.765,0H1.2a1.2,1.2,0,0,0,0,2.4H21.813a6,6,0,0,0,11.765,0h6.2a1.2,1.2,0,0,0,0-2.4ZM27.7,9.605a3.606,3.606,0,0,1-3.6-3.6h0a3.6,3.6,0,1,1,3.6,3.6Z" fill={color} stroke="#fff" strokeWidth="1"/>
                </g>
                </g>
                <g id="Group_23641" data-name="Group 23641" transform="translate(0 12.007)">
                <g id="Group_23640" data-name="Group 23640">
                    <path id="Path_22887" data-name="Path 22887" d="M39.782,185.8H19.17a6,6,0,0,0-11.765,0H1.2a1.2,1.2,0,1,0,0,2.4H7.4a6,6,0,0,0,11.765,0H39.782a1.2,1.2,0,1,0,0-2.4Zm-26.494,4.8a3.606,3.606,0,0,1-3.6-3.6h0a3.6,3.6,0,1,1,3.6,3.6Z" transform="translate(0 -181)" fill={color} stroke="#fff" strokeWidth="1"/>
                </g>
                </g>
                <g id="Group_23643" data-name="Group 23643" transform="translate(0 24.014)">
                <g id="Group_23642" data-name="Group 23642">
                    <path id="Path_22888" data-name="Path 22888" d="M39.782,366.8h-6.2a6,6,0,0,0-11.765,0H1.2a1.2,1.2,0,0,0,0,2.4H21.813a6,6,0,0,0,11.765,0h6.2a1.2,1.2,0,0,0,0-2.4Zm-12.087,4.8a3.606,3.606,0,0,1-3.6-3.6h0a3.6,3.6,0,1,1,3.6,3.6Z" transform="translate(0 -362)" fill={color} stroke="#fff" strokeWidth="1"/>
                </g>
                </g>
            </g>
        </svg>


    );
}

export default SettingsIcon;