<Circle
    color="linear-gradient(135deg, #a5b4fc, #6366f1)"
    size={['150px', '150px', '180px', '180px']}
    zIndex={2}
/>

<Donut
    color="#f43f5e"
    size="180px"
    width={['40px', '40px', '60px', '60px']}
    zIndex={2}
/>

<CircleGrid
    position="relative"
    color="#10b981"
    size="175px"
    zIndex={2}
/>

<Square
    color="linear-gradient(135deg, #fdba74, #f97316)"
    size="150px"
    zIndex={2}
/>

<Diamond
    color="linear-gradient(135deg, #93c5fd, #3b82f6)"
    size="100px"
    zIndex={2}
/>

<PolygonCard
    height="200px"
    width="150px"
    zIndex={2}
    color="linear-gradient(135deg, #f9a8d4, #ec4899)"
/>

<Triangle
    size="150px"
    zIndex={2}
    color="linear-gradient(135deg, #fde047, #eab308)"
/>

<Hexagon
    height="150px"
    width="175px"
    zIndex={2}
    color="linear-gradient(135deg, #c4b5fd, #8b5cf6)"
/>

<Polygon
    height="180px"
    width="175px"
    zIndex={2}
    color="linear-gradient(220deg, #f97316 0%, #dc2626 100%)"
    sides={8}
/>