react-undraw-illustrations
Version:
unDraw: MIT licensed illustrations for every project you can imagine and create...for React!
311 lines (306 loc) • 13.9 kB
JavaScript
import React from "react";
import PropTypes from "prop-types";
const UndrawSecurityOn = props => (
<svg
style={{height:props.height, width:'100%'}}
className={props.class}
id="4746a87b-e7ac-476a-abc6-e77b15a9a3dd"
data-name="Layer 1"
xmlnsXlink="http://www.w3.org/1999/xlink"
viewBox="0 0 859.4 751.86"
>
<defs>
<linearGradient
id="ffa92e83-5423-46bb-b0b7-be4f595991da"
x1={602}
y1={795.44}
x2={602}
y2={79.05}
gradientUnits="userSpaceOnUse"
>
<stop offset={0} stopColor="gray" stopOpacity={0.25} />
<stop offset={0.54} stopColor="gray" stopOpacity={0.12} />
<stop offset={1} stopColor="gray" stopOpacity={0.1} />
</linearGradient>
<linearGradient
id="328a37c3-c061-40b8-a437-8ad00042a7af"
x1={344.92}
y1={369.4}
x2={505.4}
y2={369.4}
xlinkHref="#ffa92e83-5423-46bb-b0b7-be4f595991da"
/>
<linearGradient
id="fc2dd6fa-1351-462e-8d09-f324f4c02728"
x1={445.92}
y1={830.86}
x2={445.92}
y2={392.54}
xlinkHref="#ffa92e83-5423-46bb-b0b7-be4f595991da"
/>
</defs>
<title>security on</title>
<g opacity={0.5}>
<path
d="M602,79.05,324,250.13S324,603,602,795.44C880,603,880,250.13,880,250.13Z"
transform="translate(-170.6 -79)"
fill="url(#ffa92e83-5423-46bb-b0b7-be4f595991da)"
/>
</g>
<path
d="M602,89.75l-269.7,166s0,342.31,269.7,529c269.7-186.72,269.7-529,269.7-529Z"
transform="translate(-170.6 -79)"
fill="#fff"
/>
<path
d="M603.61,89.75,599,92.58V781.51c1.53,1.08,3.06,2.17,4.61,3.24,269.7-186.72,269.7-529,269.7-529Z"
transform="translate(-170.6 -79)"
fill={props.primaryColor}
opacity={0.04}
/>
<g opacity={0.7}>
<polygon
points="366.11 347.07 416.95 393.67 479.98 302.75 505.4 323.94 416.95 436.04 344.92 355.54 366.11 347.07"
fill="url(#328a37c3-c061-40b8-a437-8ad00042a7af)"
/>
</g>
<polygon
points="378.11 349.87 419.35 387.67 477.78 301.75 498.4 318.94 419.35 422.04 360.92 356.74 378.11 349.87"
fill="#3ad29f"
/>
<g opacity={0.5}>
<path
d="M554.46,455A10.83,10.83,0,0,0,546,461.1c-3.47,7.19-10.35,19.79-16.67,21.77-4.11,1.28-10.1.2-15.38-1.34l-2.15-.66h0v-2.73S480.91,461,463.27,457V444.44a22.85,22.85,0,0,0,5.25-34c4.73-1.74,7.85-4.75,7.85-8.18,0-5.39-7.74-9.76-17.28-9.76-8.3,0-15.23,3.3-16.9,7.71a23.42,23.42,0,0,0-6.8,43.39v12.5c-9.48-.09-36.65,3.89-48.51,50.42,0,0,1.68,1.44,4.28,3.46h0l-.35.91-31.53,81.22s-25.09,6.69-12.27,19c0,0,0-.19-.06-.51l6.3,14.5,1.12,2.4h0l7.43,15.86h0l-.74,3.61h0l-9.52,46.72H338.43v7.41H350L323.6,830.86h8.34L357.38,701.1h31.48l16.93,36.15h-8v8.34h12L420.65,769c-1.32,1.33-1.46,3.37,3,6.32l3.46,7.38h-9.86v5.56h12.47l20,42.64h16.68l-20.17-42.64h9v-2.81c9.15,1.33,16.7,1.33,18.09-.06,2.79-2.79,2.23-14.5-1.67-20.07a7.16,7.16,0,0,0-1.5-1.61c.46-11.7,2.12-35,8.19-49.12,8.36-19.51-4.46-41.26-4.46-41.26l-.4-8.09V662c4.6-.88,7.65-1.53,7.65-1.53s-8.36-27.32,0-41.26c5.81-9.68,6.23-23.93,2.78-36.6h0l0-.09q-.26-.94-.54-1.86l0-.1h0a41.48,41.48,0,0,0,5.07-5.4s-11.71-54.64,0-71.93l23.42,1.67v-3.07h20.91l18.4-25.65s12.82-3.35,16.73-14.5C570.38,454.33,561.1,454.25,554.46,455ZM398.87,551.45s7.61-13.39,11.36-27.13h0v-.05q.28-1,.53-2.08v0h0c.6.22,1.18.42,1.75.57,0,0,5.58,50.18-3.35,52.41,0,0,1.79,1.16,4.88,2.84h0l-3.28,1.31h0l-18.88,7.55,1.21,4h0c-.68.13-1.44.28-2.25.45h0c-5.39,1.15-13.38,3.39-19.78,7.4h0S378.24,574.31,398.87,551.45ZM363.93,605a17.21,17.21,0,0,0-1.62,2.66l-2-5.29c.75.09,1.52.21,2.35.36C362.63,602.74,363.18,603.67,363.93,605Zm2.18,51.6.57-2.89h0l12.94,27.62a67.12,67.12,0,0,1-16.14,1.34,11.66,11.66,0,0,0-2.86,1.92l5.49-28Zm-7.27,37.07,1-5.29c1,1.34,3.43,2.75,8.56,4.07a59.62,59.62,0,0,0,6.27,1.22H358.84ZM426,745.59h9.74v-8.34H422.06L405,701.1h7.62v-7.41h-9.08c6.07-.79,10.48-2,11.28-3.26,2.07-3.22-.71-14-5.44-18.83-3.14-13.27-10.61-42-17.44-46.27l9.78-1.82h0l.1,0,1.26-.23,3.36,11a177.18,177.18,0,0,0,23.42-3.14v.12A184.09,184.09,0,0,1,410.23,634l.07.24a174.74,174.74,0,0,0,19.43-2.38c-1.41,12.47-2.62,33.93,5.66,34.72a36.75,36.75,0,0,0,4.56.09h0v2.81l.18,0c.6,7.6,2.22,17.74,6.41,26.12l5.38,72.66a67.28,67.28,0,0,1-14.89.66l-11-23.31Z"
transform="translate(-170.6 -79)"
fill="url(#fc2dd6fa-1351-462e-8d09-f324f4c02728)"
/>
</g>
<path
d="M398.6,590.94s-46.3,5.38-32.3,33.38a318,318,0,0,1,21.27,56.8l24.5-5.11s-9.69-45.76-18.31-51.15l23.15-4.31Z"
transform="translate(-170.6 -79)"
fill="#fda57d"
/>
<path
d="M393.76,624.86l23.15-4.31L398.6,590.94s-.54.06-1.49.21l18.18,29.4-23.15,4.31c8.61,5.38,18.31,51.15,18.31,51.15l-23,4.79.08.32,24.5-5.11S402.37,630.24,393.76,624.86Z"
transform="translate(-170.6 -79)"
opacity={0.05}
/>
<path
d="M402.28,670.82s-14.31,10.26-36,9.44c0,0-11.53,5.25,4.79,9.43s42.68,1.23,44.74-2-.86-14.14-5.68-18.6S402.28,670.82,402.28,670.82Z"
transform="translate(-170.6 -79)"
fill={props.primaryColor}
/>
<path
d="M440.06,656.62s-1.08,21,6.46,36.07l5.38,72.68h17.23s0-35.53,8.08-54.38-4.31-39.84-4.31-39.84l-1.08-21.54Z"
transform="translate(-170.6 -79)"
fill="#fda57d"
/>
<path
d="M431.44,622.7s-7,40.92,4.31,42,44.15-5.92,44.15-5.92-8.08-26.38,0-39.84,5.38-36.07-3.77-50.07-19.38,0-19.38,0Z"
transform="translate(-170.6 -79)"
fill="#47e6b1"
/>
<circle cx={280.23} cy={352.57} r={22.07} fill="#fda57d" />
<rect x={265.15} y={363.88} width={26.92} height={24.23} fill="#fda57d" />
<path
d="M462.67,760s-16.15,7-37.15,1.62c0,0-12.38,2.69,2.69,10.23s41.46,10.23,44.15,7.54,2.15-14-1.62-19.38S462.67,760,462.67,760Z"
transform="translate(-170.6 -79)"
fill={props.primaryColor}
/>
<path
d="M394,511l-31.77,81.84s-24.23,6.46-11.84,18.31c0,0-2.15-11.31,15.07-8.08,0,0,4.85,8.08,4.85,10.77s5.54-9,3.31-14.72a131.31,131.31,0,0,1,26.84-45.58s13.46-23.69,12.92-39.84Z"
transform="translate(-170.6 -79)"
fill="#fda57d"
/>
<path
d="M500.63,481.91s17.23,8.08,25.84,5.38c6.1-1.91,12.74-14.08,16.1-21a10.46,10.46,0,0,1,8.16-5.85c6.41-.77,15.38-.69,12.89,6.41-3.77,10.77-16.15,14-16.15,14L529.7,505.6H498.47Z"
transform="translate(-170.6 -79)"
fill="#fda57d"
/>
<circle cx={276.19} cy={350.69} r={22.61} fill="#3d213c" />
<ellipse cx={288.03} cy={330.5} rx={16.69} ry={9.42} fill="#3d213c" />
<polygon
points="269.55 585.78 269.55 588.49 301.91 584.35 301.91 581.26 269.55 585.78"
opacity={0.05}
/>
<path
d="M428.75,573.71l-35,14,14,45.76s42-2.15,57.61-18.31-25.84-48.46-25.84-48.46Z"
transform="translate(-170.6 -79)"
fill="#47e6b1"
/>
<path
d="M469.41,606a12.15,12.15,0,0,1-3.51,9.18c-13,13.47-44.4,17.21-54.45,18.07l.07.23s42-2.15,57.61-18.31a12.09,12.09,0,0,0,3.52-8.7"
transform="translate(-170.6 -79)"
opacity={0.05}
/>
<path
d="M439,461.72s-36.07-6.46-50.07,48.46c0,0,15.07,12.92,24.77,15.61,0,0,5.38,48.46-3.23,50.61,0,0,50.61,32.84,76.45,0,0,0-11.31-52.76,0-69.45l22.61,1.62V482.72s-33.92-18.84-50.07-21Z"
transform="translate(-170.6 -79)"
fill={props.primaryColor}
/>
<polygon
points="224.32 512.52 222.15 512.96 232.6 544.1 233.91 543.86 224.32 512.52"
opacity={0.05}
/>
<polygon
points="338.91 406.36 341.05 407.01 341.74 426.6 338.91 426.6 338.91 406.36"
opacity={0.05}
/>
<polygon
points="222.44 434.52 221.73 436.37 240.85 448.33 241.39 446.24 222.44 434.52"
opacity={0.05}
/>
<path
d="M415.16,579.15,412,580.41s53.09,25.72,70.59,3.18l-.58-2S465.91,603.16,415.16,579.15Z"
transform="translate(-170.6 -79)"
opacity={0.05}
/>
<rect x={171.52} y={611.87} width={71.6} height={7.16} fill="#b0bec5" />
<polygon
points="176.89 525.05 185.84 545.64 201.06 545.64 192.11 522.37 176.89 525.05"
fill="#b0bec5"
/>
<polygon
points="278.92 744.32 295.03 744.32 199.74 542.63 185.23 543.75 278.92 744.32"
fill="#b0bec5"
/>
<polygon
points="157.2 744.32 165.26 744.32 201.06 561.75 195.69 555.48 157.2 744.32"
fill="#b0bec5"
/>
<polygon
points="186.93 547.95 185.84 545.64 201.06 545.64 201.6 546.79 186.93 547.95"
fill="#eceff1"
/>
<polygon
points="186.93 547.95 185.84 545.64 201.06 545.64 201.6 546.79 186.93 547.95"
opacity={0.1}
/>
<polygon
points="194.1 563.26 198.8 573.28 198.25 576.07 193.39 566.75 194.1 563.26"
opacity={0.1}
/>
<polygon
points="191.23 611.87 189.83 619.02 192.26 619.02 193.39 611.87 191.23 611.87"
opacity={0.1}
/>
<rect x={228.8} y={653.93} width={36.69} height={8.05} fill="#b0bec5" />
<rect x={247.6} y={697.78} width={36.69} height={5.37} fill="#b0bec5" />
<polygon
points="252.28 653.93 256.09 661.99 258.11 661.99 255.2 653.93 252.28 653.93"
opacity={0.1}
/>
<polygon
points="273.02 697.78 275.56 703.15 277.8 703.15 275.41 697.78 273.02 697.78"
opacity={0.1}
/>
<polygon
points="232.38 611.87 235.77 619.02 237.6 619.02 234.02 611.87 232.38 611.87"
opacity={0.1}
/>
<path
d="M335.89,127a3.67,3.67,0,0,1-2-4.44,1.77,1.77,0,0,0,.08-.41h0a1.84,1.84,0,0,0-3.31-1.22h0a1.77,1.77,0,0,0-.2.36,3.67,3.67,0,0,1-4.44,2,1.77,1.77,0,0,0-.41-.08h0a1.84,1.84,0,0,0-1.22,3.31h0a1.77,1.77,0,0,0,.36.2,3.67,3.67,0,0,1,2,4.44,1.77,1.77,0,0,0-.08.41h0A1.84,1.84,0,0,0,330,132.8h0a1.77,1.77,0,0,0,.2-.36,3.67,3.67,0,0,1,4.44-2,1.77,1.77,0,0,0,.41.08h0a1.84,1.84,0,0,0,1.22-3.31h0A1.77,1.77,0,0,0,335.89,127Z"
transform="translate(-170.6 -79)"
fill="#4d8af0"
opacity={0.5}
/>
<path
d="M189.89,452a3.67,3.67,0,0,1-2-4.44,1.77,1.77,0,0,0,.08-.41h0a1.84,1.84,0,0,0-3.31-1.22h0a1.77,1.77,0,0,0-.2.36,3.67,3.67,0,0,1-4.44,2,1.77,1.77,0,0,0-.41-.08h0a1.84,1.84,0,0,0-1.22,3.31h0a1.77,1.77,0,0,0,.36.2,3.67,3.67,0,0,1,2,4.44,1.77,1.77,0,0,0-.08.41h0A1.84,1.84,0,0,0,184,457.8h0a1.77,1.77,0,0,0,.2-.36,3.67,3.67,0,0,1,4.44-2,1.77,1.77,0,0,0,.41.08h0a1.84,1.84,0,0,0,1.22-3.31h0A1.77,1.77,0,0,0,189.89,452Z"
transform="translate(-170.6 -79)"
fill="#4d8af0"
opacity={0.5}
/>
<circle cx={748.4} cy={254} r={6} fill="#f55f44" opacity={0.5} />
<circle cx={121.4} cy={683} r={6} fill="#f55f44" opacity={0.5} />
<circle cx={850.4} cy={485} r={6} fill="#f55f44" opacity={0.5} />
<path
d="M874.89,156a3.67,3.67,0,0,1-2-4.44,1.77,1.77,0,0,0,.08-.41h0a1.84,1.84,0,0,0-3.31-1.22h0a1.77,1.77,0,0,0-.2.36,3.67,3.67,0,0,1-4.44,2,1.77,1.77,0,0,0-.41-.08h0a1.84,1.84,0,0,0-1.22,3.31h0a1.77,1.77,0,0,0,.36.2,3.67,3.67,0,0,1,2,4.44,1.77,1.77,0,0,0-.08.41h0A1.84,1.84,0,0,0,869,161.8h0a1.77,1.77,0,0,0,.2-.36,3.67,3.67,0,0,1,4.44-2,1.77,1.77,0,0,0,.41.08h0a1.84,1.84,0,0,0,1.22-3.31h0A1.77,1.77,0,0,0,874.89,156Z"
transform="translate(-170.6 -79)"
fill="#4d8af0"
opacity={0.5}
/>
<path
d="M974.89,784a3.67,3.67,0,0,1-2-4.44,1.77,1.77,0,0,0,.08-.41h0a1.84,1.84,0,0,0-3.31-1.22h0a1.77,1.77,0,0,0-.2.36,3.67,3.67,0,0,1-4.44,2,1.77,1.77,0,0,0-.41-.08h0a1.84,1.84,0,0,0-1.22,3.31h0a1.77,1.77,0,0,0,.36.2,3.67,3.67,0,0,1,2,4.44,1.77,1.77,0,0,0-.08.41h0A1.84,1.84,0,0,0,969,789.8h0a1.77,1.77,0,0,0,.2-.36,3.67,3.67,0,0,1,4.44-2,1.77,1.77,0,0,0,.41.08h0a1.84,1.84,0,0,0,1.22-3.31h0A1.77,1.77,0,0,0,974.89,784Z"
transform="translate(-170.6 -79)"
fill="#4d8af0"
opacity={0.5}
/>
<path
d="M182.89,262a3.67,3.67,0,0,1-2-4.44,1.77,1.77,0,0,0,.08-.41h0a1.84,1.84,0,0,0-3.31-1.22h0a1.77,1.77,0,0,0-.2.36,3.67,3.67,0,0,1-4.44,2,1.77,1.77,0,0,0-.41-.08h0a1.84,1.84,0,0,0-1.22,3.31h0a1.77,1.77,0,0,0,.36.2,3.67,3.67,0,0,1,2,4.44,1.77,1.77,0,0,0-.08.41h0A1.84,1.84,0,0,0,177,267.8h0a1.77,1.77,0,0,0,.2-.36,3.67,3.67,0,0,1,4.44-2,1.77,1.77,0,0,0,.41.08h0a1.84,1.84,0,0,0,1.22-3.31h0A1.77,1.77,0,0,0,182.89,262Z"
transform="translate(-170.6 -79)"
fill="#4d8af0"
opacity={0.5}
/>
<circle cx={79.4} cy={284} r={6} fill="#47e6b1" opacity={0.5} />
<circle cx={853.4} cy={332} r={6} fill="#47e6b1" opacity={0.5} />
<g opacity={0.5}>
<rect x={583.4} width={3} height={17} fill="#47e6b1" />
<rect
x={754}
y={79}
width={3}
height={17}
transform="translate(672.4 -747) rotate(90)"
fill="#47e6b1"
/>
</g>
<g opacity={0.5}>
<rect x={594.4} y={666} width={3} height={17} fill="#47e6b1" />
<rect
x={765}
y={745}
width={3}
height={17}
transform="translate(1349.4 -92) rotate(90)"
fill="#47e6b1"
/>
</g>
<g opacity={0.5}>
<rect x={26.4} y={702} width={3} height={17} fill="#47e6b1" />
<rect
x={197}
y={781}
width={3}
height={17}
transform="translate(817.4 512) rotate(90)"
fill="#47e6b1"
/>
</g>
<g opacity={0.5}>
<rect x={709.4} y={396} width={3} height={17} fill="#47e6b1" />
<rect
x={880}
y={475}
width={3}
height={17}
transform="translate(1194.4 -477) rotate(90)"
fill="#47e6b1"
/>
</g>
<polygon
points="795.61 123.02 802.05 128.92 811.18 115.5 814.4 118.19 802.05 134.29 792.92 124.09 795.61 123.02"
fill="#47e6b1"
opacity={0.5}
/>
</svg>
);
UndrawSecurityOn.propTypes = {
/**
* Hex color
*/
primaryColor: PropTypes.string,
/**
* percentage
*/
height: PropTypes.string,
/**
* custom class for svg
*/
class: PropTypes.string
};
UndrawSecurityOn.defaultProps = {
primaryColor: "#6c68fb",
height: "250px",
class: ""
};
export default UndrawSecurityOn;