UNPKG

react-undraw-illustrations

Version:

unDraw: MIT licensed illustrations for every project you can imagine and create...for React!

646 lines (641 loc) 19.5 kB
import React from "react"; import PropTypes from "prop-types"; const UndrawOrganizingProjects = props => ( <svg style={{height:props.height, width:'100%'}} className={props.class} id="4771386c-1c5b-4872-9ac2-486c3b56cfa9" data-name="Layer 1" xmlnsXlink="http://www.w3.org/1999/xlink" viewBox="0 0 862.84 574" > <defs> <linearGradient id="3fbb5603-b968-4e5d-a6aa-a77eb8d45962" x1={491.81} y1={649.09} x2={491.81} y2={275.78} 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="6c5574c6-5e13-40e9-a921-c6483adbc5a4" x1={211.11} y1={639.3} x2={291.83} y2={639.3} xlinkHref="#3fbb5603-b968-4e5d-a6aa-a77eb8d45962" /> <linearGradient id="c1ae2d59-6f06-493e-bc67-bbe3f342ee9a" x1={743.56} y1={708.81} x2={743.56} y2={647.8} xlinkHref="#3fbb5603-b968-4e5d-a6aa-a77eb8d45962" /> <linearGradient id="42210206-7031-48fa-9019-94a74cadb7f5" x1={322.8} y1={543.16} x2={322.8} y2={385.06} xlinkHref="#3fbb5603-b968-4e5d-a6aa-a77eb8d45962" /> <linearGradient id="2e549cc1-e889-41b4-bd8b-1808acd7f7a6" x1={519.12} y1={123.68} x2={519.12} y2={29.32} xlinkHref="#3fbb5603-b968-4e5d-a6aa-a77eb8d45962" /> <linearGradient id="ece8db58-989d-4dce-a503-1d13bb16c502" x1={534.56} y1={145.48} x2={534.56} y2={51.12} xlinkHref="#3fbb5603-b968-4e5d-a6aa-a77eb8d45962" /> <linearGradient id="96b33426-4479-4a92-ae42-6df6d6acfbfd" x1={656.13} y1={119.52} x2={656.13} y2={65.4} xlinkHref="#3fbb5603-b968-4e5d-a6aa-a77eb8d45962" /> <linearGradient id="d6fd8f6a-b8f7-4221-8d65-1bd626dc6feb" x1={824.71} y1={251.81} x2={824.71} y2={236.13} xlinkHref="#3fbb5603-b968-4e5d-a6aa-a77eb8d45962" /> <linearGradient id="76cd2d1a-7d71-47e8-b096-b841f2959633" x1={771.51} y1={162.36} x2={771.51} y2={18.04} xlinkHref="#3fbb5603-b968-4e5d-a6aa-a77eb8d45962" /> <linearGradient id="f14a0f0c-b82f-439a-aed6-6e59cdf167fc" x1={940.67} y1={222.57} x2={940.67} y2={201.95} xlinkHref="#3fbb5603-b968-4e5d-a6aa-a77eb8d45962" /> <linearGradient id="d3ea7720-6544-4ce6-a000-7190b224f6d3" x1={674.92} y1={262.9} x2={674.92} y2={202.96} xlinkHref="#3fbb5603-b968-4e5d-a6aa-a77eb8d45962" /> <linearGradient id="109d6f30-2103-4397-8d77-cdd3434d033d" x1={637.96} y1={255.27} x2={637.96} y2={180.97} xlinkHref="#3fbb5603-b968-4e5d-a6aa-a77eb8d45962" /> </defs> <title>organizing projects1</title> <path d="M592.51,559.45c-6.7-24.31-43.89-42.23-72.91-46.86V500.91l1.6-.62a25.8,25.8,0,0,0-1.39-6.84A70.43,70.43,0,0,0,550.67,469,79.36,79.36,0,0,0,535,346.7,15.57,15.57,0,0,0,528,318a30.39,30.39,0,0,0-47.31-35.31,30.38,30.38,0,0,1,44.65,26.83c0,.27,0,.53,0,.79a30.39,30.39,0,1,0-58.9,11.37A15.19,15.19,0,0,0,456.4,344,79.36,79.36,0,0,0,437,470.18a70.45,70.45,0,0,0,28.62,22.68v19.47c-29.33,4.19-67.95,22.44-74.69,47.35-5.88,21.71-12.16,45.55-15.28,59.55,26.77,18.81,82.94,29.86,118.15,29.86,33.45,0,88.12-10,114.1-27.1C605.12,606.61,598.65,581.72,592.51,559.45ZM538.89,334.87c0,.28,0,.55,0,.82a15.2,15.2,0,0,0-12.62-14.11q.44-.75.84-1.52A15.2,15.2,0,0,1,538.89,334.87Z" transform="translate(-168.58 -163)" fill="url(#3fbb5603-b968-4e5d-a6aa-a77eb8d45962)" /> <path d="M493.78,643.77c32.5,0,85.61-9.69,110.85-26.33-2.73-14.94-9-39.12-15-60.76-7.59-27.56-55.51-46.66-84.1-46.66H478c-28.67,0-76.66,19.22-84.16,46.89C388.13,578,382,601.17,379,614.77,405,633,459.58,643.77,493.78,643.77Z" transform="translate(-168.58 -163)" fill={props.primaryColor} /> <circle cx={324.68} cy={252.59} r={77.09} fill="#f55f44" /> <path d="M303.87,306.18H344.2a6,6,0,0,1,6,6v41.24a24.78,24.78,0,0,1-24.78,24.78h-2.85a24.78,24.78,0,0,1-24.78-24.78V312.22a6,6,0,0,1,6-6Z" fill="#fda57d" /> <path d="M495,504.1a68,68,0,0,0,25.34-4.88,25.11,25.11,0,0,0-25-23.48h-2.15a25.12,25.12,0,0,0-25,22.86A68,68,0,0,0,495,504.1Z" transform="translate(-168.58 -163)" opacity={0.05} /> <circle cx={324.82} cy={266.34} r={68.2} fill="#fda57d" /> <circle cx={301.72} cy={177.14} r={14.76} fill="#f55f44" /> <circle cx={354.2} cy={177.14} r={14.76} fill="#f55f44" /> <circle cx={326.32} cy={152.54} r={29.52} fill="#f55f44" /> <path d="M526.06,322.1a14.69,14.69,0,0,0-8.24,2.51A14.76,14.76,0,0,1,531,350.75a14.75,14.75,0,0,0-5-28.65Z" transform="translate(-168.58 -163)" fill="#f55f44" /> <path d="M499.82,281.09A29.4,29.4,0,0,0,481,287.83a29.52,29.52,0,0,1,32.63,48.85,29.52,29.52,0,0,0-13.86-55.59Z" transform="translate(-168.58 -163)" fill="#f55f44" /> <path d="M444.05,368s8.2,54.13,111.54,24.6l-50.85-44.29Z" transform="translate(-168.58 -163)" fill="#f55f44" /> <g opacity={0.7}> <path d="M291.35,619.44a15.67,15.67,0,0,0-6.21-16.62,46.3,46.3,0,0,1-4.16-2.69,15.13,15.13,0,0,1-4.17-7c-2.09-6.26-2.74-13.29-6.4-18.95-3.33-5.15-9.81-6.66-15.56-7.17a12.35,12.35,0,0,0-6.21.58c-3.2,1.45-4.73,5.23-4.88,8.75s.77,7,1,10.49-.4,7.37-3,9.75-6.3,2.66-9.73,3.14A64.42,64.42,0,0,0,218.86,603c-3.58,1.3-7.57,3.66-7.74,7.47-.14,3.11,2.37,5.6,4.26,8.07A20.65,20.65,0,0,1,219.47,635c-1.22,5.8-5.29,10.77-6,16.65A7.23,7.23,0,0,0,214,656a8,8,0,0,0,2.23,2.36c2.21,1.71,4.68,3.08,6.78,4.94,4.37,3.87,6.73,9.48,8.55,15,.18.53.33,1.07.5,1.61h-4.29a15.92,15.92,0,0,0-15.88,15.88h0a15.92,15.92,0,0,0,15.88,15.88h42.86a15.92,15.92,0,0,0,15.88-15.88h0A15.92,15.92,0,0,0,270.66,680H258.91c2.78-3.72,5.68-7.22,10-8.65s9.48-.59,12.84-3.58a10.07,10.07,0,0,0,2.91-5.77,17.2,17.2,0,0,0-1.88-11.42c-1.35-2.41-3.33-4.6-3.76-7.33a10.87,10.87,0,0,1,1.62-6.77C283.86,630.52,289.6,625.95,291.35,619.44Z" transform="translate(-168.58 -163)" fill="url(#6c5574c6-5e13-40e9-a921-c6483adbc5a4)" /> </g> <path d="M254.68,570.47a11.76,11.76,0,0,0-5.91.55c-3.05,1.38-4.5,5-4.64,8.33s.73,6.65,1,10-.38,7-2.84,9.28-6,2.53-9.27,3a61.35,61.35,0,0,0-12.56,3.12c-3.41,1.24-7.21,3.48-7.37,7.11-.13,3,2.26,5.33,4.06,7.69a19.67,19.67,0,0,1,3.9,15.65c-1.16,5.52-5,10.26-5.74,15.86a6.88,6.88,0,0,0,.56,4.19,7.66,7.66,0,0,0,2.12,2.25c2.11,1.63,4.46,2.94,6.45,4.7,4.16,3.68,6.41,9,8.15,14.31a115.87,115.87,0,0,1,4,15.87c3.58-2.3,8.21-2.27,12-4.15,8.14-4,10.88-15.55,19.47-18.43,4.07-1.36,9-.56,12.23-3.41a9.59,9.59,0,0,0,2.78-5.5A16.38,16.38,0,0,0,281.26,650c-1.29-2.3-3.17-4.38-3.58-7a10.35,10.35,0,0,1,1.54-6.45c3.09-5.62,8.55-10,10.22-16.17a14.93,14.93,0,0,0-5.92-15.82,44.09,44.09,0,0,1-4-2.56,14.41,14.41,0,0,1-4-6.66c-2-6-2.61-12.65-6.1-18C266.33,572.39,260.16,571,254.68,570.47Z" transform="translate(-168.58 -163)" fill="#4db6ac" /> <path d="M254.62,570.67S262.18,672,242.53,689.35" transform="translate(-168.58 -163)" fill="none" stroke="#535461" strokeMiterlimit={10} opacity={0.6} /> <rect x={45.23} y={515.01} width={71.05} height={30.24} rx={14.3} ry={14.3} fill={props.primaryColor} /> <path d="M213,610s19.33-2.26,42.92,12.1" transform="translate(-168.58 -163)" fill="none" stroke="#535461" strokeMiterlimit={10} opacity={0.6} /> <path d="M255.6,634.17A49.93,49.93,0,0,1,289.39,613" transform="translate(-168.58 -163)" fill="none" stroke="#535461" strokeMiterlimit={10} opacity={0.6} /> <path d="M214.94,651.18s26.79-4.54,39.1,3" transform="translate(-168.58 -163)" fill="none" stroke="#535461" strokeMiterlimit={10} opacity={0.6} /> <path d="M252.51,664.59s14-6.36,29.8-1.19" transform="translate(-168.58 -163)" fill="none" stroke="#535461" strokeMiterlimit={10} opacity={0.6} /> <g opacity={0.7}> <path d="M763.71,658.7V647.8H709.24v50.39a10.62,10.62,0,0,0,10.62,10.62h33.23a10.62,10.62,0,0,0,10.62-10.62V687a14.16,14.16,0,1,0,0-28.33Zm0,22.88V664.14a8.72,8.72,0,1,1,0,17.43Z" transform="translate(-168.58 -163)" fill="url(#c1ae2d59-6f06-493e-bc67-bbe3f342ee9a)" /> </g> <path d="M762,660.4a12.93,12.93,0,1,0,12.93,12.93A12.93,12.93,0,0,0,762,660.4Zm0,20.89a8,8,0,1,1,8-8A8,8,0,0,1,762,681.29Z" transform="translate(-168.58 -163)" fill={props.primaryColor} /> <path d="M762,660.4a12.93,12.93,0,1,0,12.93,12.93A12.93,12.93,0,0,0,762,660.4Zm0,20.89a8,8,0,1,1,8-8A8,8,0,0,1,762,681.29Z" transform="translate(-168.58 -163)" opacity={0.1} /> <path d="M543.64,487.45h49.74a0,0,0,0,1,0,0v46a9.75,9.75,0,0,1-9.75,9.75H553.39a9.75,9.75,0,0,1-9.75-9.75v-46A0,0,0,0,1,543.64,487.45Z" fill={props.primaryColor} /> <rect y={543.16} width={645.61} height={21.88} fill="#e0e0e0" /> <g opacity={0.7}> <rect x={185.52} y={385.06} width={274.56} height={158.1} rx={14.5} ry={14.5} fill="url(#42210206-7031-48fa-9019-94a74cadb7f5)" /> </g> <rect x={190.5} y={387.98} width={264.61} height={155.18} rx={26.84} ry={26.84} fill="#535461" /> <circle cx={322.8} cy={465.57} r={8.95} fill="#fff" /> <rect x={27.36} y={565.05} width={590.89} height={8.95} fill="#e0e0e0" /> <rect x={27.36} y={565.05} width={590.89} height={2.98} opacity={0.1} /> <path d="M753,650.45v46a9.7,9.7,0,0,1-9.7,9.7h5a9.7,9.7,0,0,0,9.7-9.7v-46Z" transform="translate(-168.58 -163)" opacity={0.1} /> <path d="M722,613.37a2.9,2.9,0,0,0-2.2,1.12c-.65,1.18.53,2.52,1.61,3.33,2,1.5,4.09,3,5.45,5.07s1.78,5,.3,7c-1.93,2.62-6.55,3.19-7,6.41-.29,2.07,1.5,3.84,3.32,4.88,4.48,2.57,10.26,3.25,13.5,7.27,1.34-2.76,4.35-4.36,7.34-5s6.1-.63,9.14-1.09A3.16,3.16,0,0,0,756,641c.85-1.72-1.57-3.79-.73-5.51.64-1.32,2.5-1.21,3.86-1.74,2.22-.86,3.13-3.71,2.5-6s-2.41-4.09-4.28-5.56c-5-4-11.1-6.29-17.23-8-2.85-.78-6.2-2-9.16-2.12S724.86,612.89,722,613.37Z" transform="translate(-168.58 -163)" fill="#eee" /> <rect x={428.37} width={434.48} height={297.67} fill="#535461" opacity={0.1} /> <g opacity={0.5}> <rect x={467.98} y={29.32} width={102.28} height={94.36} rx={4.5} ry={4.5} fill="url(#2e549cc1-e889-41b4-bd8b-1808acd7f7a6)" /> </g> <rect x={469.23} y={30.05} width={99.92} height={92.07} rx={4.5} ry={4.5} fill="#f5f5f5" /> <rect x={476.93} y={45.21} width={16.85} height={15.17} rx={4.5} ry={4.5} fill={props.primaryColor} /> <rect x={498.84} y={45.21} width={66.99} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={498.84} y={50.27} width={66.99} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={475.25} y={68.62} width={90.58} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={475.25} y={73.67} width={90.58} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={475.25} y={80.41} width={90.58} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={475.25} y={85.47} width={52.24} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={475.25} y={92.19} width={90.58} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={475.25} y={97.25} width={90.58} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={475.25} y={103.99} width={90.58} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={475.25} y={109.04} width={52.24} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <g opacity={0.5}> <rect x={483.42} y={51.12} width={102.28} height={94.36} rx={4.5} ry={4.5} fill="url(#ece8db58-989d-4dce-a503-1d13bb16c502)" /> </g> <rect x={484.67} y={51.85} width={99.92} height={92.07} rx={4.5} ry={4.5} fill="#fff" /> <rect x={492.37} y={67.02} width={16.85} height={15.17} rx={4.5} ry={4.5} fill={props.primaryColor} /> <rect x={514.27} y={67.02} width={66.99} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={514.27} y={72.07} width={66.99} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={490.68} y={90.42} width={90.58} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={490.68} y={95.48} width={90.58} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={490.68} y={102.22} width={90.58} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={490.68} y={107.27} width={52.24} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={490.68} y={114} width={90.58} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={490.68} y={119.05} width={90.58} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={490.68} y={125.79} width={90.58} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={490.68} y={130.85} width={52.24} height={1.69} rx={0.8} ry={0.8} fill="#e0e0e0" /> <rect x={627.96} y={65.4} width={56.33} height={54.12} fill="url(#96b33426-4479-4a92-ae42-6df6d6acfbfd)" /> <rect x={628.85} y={66.72} width={54.56} height={51.69} fill="#f5f5f5" /> <g opacity={0.5}> <path d="M829.53,238.78v-2.65h-9.65v2.65h-6.76v13h23.16v-13Zm-8.45-1.69h7.24v1.69h-7.24Z" transform="translate(-168.58 -163)" fill="url(#d6fd8f6a-b8f7-4221-8d65-1bd626dc6feb)" /> </g> <rect x={645.53} y={76.22} width={21.21} height={11.93} fill={props.primaryColor} opacity={0.6} /> <polygon points="651.71 73.79 651.71 76.88 652.82 76.88 652.82 74.67 659.44 74.67 659.44 76.88 660.55 76.88 660.55 73.79 651.71 73.79" fill={props.primaryColor} opacity={0.6} /> <g opacity={0.6}> <rect x={646.74} y={97.43} width={19.66} height={2.65} fill={props.primaryColor} /> </g> <rect x={639.34} y={102.29} width={33.58} height={2.65} fill="#bdbdbd" /> <g opacity={0.5}> <rect x={710.1} y={18.04} width={122.84} height={144.32} fill="url(#76cd2d1a-7d71-47e8-b096-b841f2959633)" /> </g> <rect x={713.87} y={20.36} width={116.45} height={138.81} fill="#fff" /> <g opacity={0.5}> <path d="M947,205.44v-3.49H934.33v3.49h-8.88v17.13H955.9V205.44Zm-11.1-2.22h9.52v2.22h-9.52Z" transform="translate(-168.58 -163)" fill="url(#f14a0f0c-b82f-439a-aed6-6e59cdf167fc)" /> </g> <rect x={758.16} y={43.01} width={27.88} height={15.68} fill={props.primaryColor} /> <polygon points="766.29 39.82 766.29 43.88 767.74 43.88 767.74 40.98 776.45 40.98 776.45 43.88 777.9 43.88 777.9 39.82 766.29 39.82" fill={props.primaryColor} /> <rect x={731.29} y={81.26} width={81.89} height={3.48} fill="#e0e0e0" /> <rect x={731.29} y={104.2} width={81.89} height={3.48} fill="#e0e0e0" /> <rect x={731.29} y={110.3} width={81.89} height={3.48} fill="#e0e0e0" /> <rect x={731.29} y={98.11} width={34.56} height={3.48} fill="#e0e0e0" /> <rect x={787.34} y={98.11} width={25.84} height={3.48} fill="#3ad29f" opacity={0.6} /> <rect x={760.04} y={124.53} width={25.84} height={3.48} fill={props.primaryColor} /> <g opacity={0.5}> <rect x={638.43} y={202.96} width={72.99} height={59.95} fill="url(#d3ea7720-6544-4ce6-a000-7190b224f6d3)" /> </g> <rect x={639.28} y={204.09} width={71.14} height={57.82} fill="#f2f2f2" /> <rect x={639.28} y={204.09} width={71.14} height={12.9} fill={props.primaryColor} /> <rect x={639.28} y={204.09} width={71.14} height={12.9} opacity={0.1} /> <rect x={644.95} y={221.66} width={59.81} height={7.51} fill="#e0e0e0" /> <rect x={644.95} y={234.84} width={43.65} height={2.55} fill="#e0e0e0" /> <rect x={644.95} y={239.24} width={28.34} height={2.55} fill="#e0e0e0" /> <rect x={644.95} y={243.63} width={37.41} height={2.55} fill="#e0e0e0" /> <rect x={644.95} y={248.02} width={43.65} height={2.55} fill="#e0e0e0" /> <rect x={644.95} y={252.42} width={14.6} height={2.55} fill="#e0e0e0" /> <g opacity={0.5}> <rect x={592.73} y={180.97} width={90.46} height={74.3} fill="url(#109d6f30-2103-4397-8d77-cdd3434d033d)" /> </g> <rect x={593.78} y={182.37} width={88.18} height={71.67} fill="#fff" /> <rect x={593.78} y={182.37} width={88.18} height={15.98} fill={props.primaryColor} /> <rect x={600.81} y={204.16} width={74.13} height={9.31} fill="#f5f5f5" /> <rect x={600.81} y={220.49} width={54.1} height={3.16} fill="#e0e0e0" /> <rect x={600.81} y={225.94} width={35.13} height={3.16} fill="#e0e0e0" /> <rect x={600.81} y={231.38} width={46.37} height={3.16} fill="#e0e0e0" /> <rect x={600.81} y={236.83} width={54.1} height={3.16} fill="#e0e0e0" /> <rect x={600.81} y={242.27} width={18.09} height={3.16} fill="#e0e0e0" /> <rect x={604.67} y={207.32} width={21.08} height={2.81} fill="#69f0ae" /> <circle cx={469.37} cy={366.07} r={12.21} fill="#535461" opacity={0.1} /> <circle cx={492.06} cy={326.81} r={12.21} fill="#535461" opacity={0.1} /> </svg> ); UndrawOrganizingProjects.propTypes = { /** * Hex color */ primaryColor: PropTypes.string, /** * percentage */ height: PropTypes.string, /** * custom class for svg */ class: PropTypes.string }; UndrawOrganizingProjects.defaultProps = { primaryColor: "#6c68fb", height: "250px", class: "" }; export default UndrawOrganizingProjects;