mirror of
https://github.com/supabase/supabase.git
synced 2026-10-06 01:45:10 +03:00
functions card animation polish
This commit is contained in:
Francesco Sansalvadore committed
1 parent
f81111cca9
commit
ca32a67501
3 files changed
+114
-96
No files matched your search
@@ -70,9 +70,8 @@ const Panel = ({
|
||||
!trackCursor && hasActiveOnHover ? 'hover:bg-none hover:!bg-brand' : '',
|
||||
outerClassName,
|
||||
].join(' ')}
|
||||
initial="rest"
|
||||
whileHover="hover"
|
||||
animate="hover"
|
||||
animate="initial"
|
||||
>
|
||||
<div
|
||||
className={[
|
||||
|
||||
@@ -2,72 +2,49 @@ import Image from 'next/image'
|
||||
import React from 'react'
|
||||
import { motion } from 'framer-motion'
|
||||
|
||||
const FunctionsVisual = ({ isHovered }: { isHovered?: boolean }) => {
|
||||
const FunctionsVisual = () => {
|
||||
const initial = { x1: [0, 0], x2: [0, 0], y1: [0, 0], y2: [0, 0] }
|
||||
const gradientVariant1 = {
|
||||
rest: {
|
||||
x1: [0],
|
||||
x2: [0],
|
||||
y1: [0],
|
||||
y2: [0],
|
||||
},
|
||||
out: {
|
||||
x1: [0],
|
||||
x2: [0],
|
||||
y1: [0],
|
||||
y2: [0],
|
||||
},
|
||||
initial,
|
||||
hover: {
|
||||
x1: [30, 200, 400],
|
||||
x2: [0, 0, 348],
|
||||
x1: [30, 200, 450],
|
||||
x2: [0, 50, 350],
|
||||
y1: [40, 0, 0],
|
||||
y2: [0, 0, 0],
|
||||
},
|
||||
}
|
||||
const gradientVariant2 = {
|
||||
rest: {
|
||||
x1: [0],
|
||||
x2: [0],
|
||||
y1: [0],
|
||||
y2: [0],
|
||||
},
|
||||
out: {
|
||||
x1: [0],
|
||||
x2: [0],
|
||||
y1: [0],
|
||||
y2: [0],
|
||||
},
|
||||
initial,
|
||||
hover: {
|
||||
x1: [400, 200, 0],
|
||||
x2: [348, 150, 0],
|
||||
y1: [0, 0, 0],
|
||||
y2: [0, 0, 0],
|
||||
x1: [400, 50],
|
||||
x2: [300, -100],
|
||||
y1: [0, 0],
|
||||
y2: [0, 0],
|
||||
},
|
||||
}
|
||||
return (
|
||||
<div className="absolute inset-0 z-0">
|
||||
<svg
|
||||
width="100%"
|
||||
height="100%"
|
||||
viewBox="0 0 289 430"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
className="absolute w-full h-auto inset-0 top-auto z-10 object-cover"
|
||||
className="absolute w-full aspect-[1/1.44] inset-0 z-10 m-auto"
|
||||
>
|
||||
<g clip-path="url(#clip0_444_4697)">
|
||||
<g clipPath="url(#clip0_444_4697)">
|
||||
<g filter="url(#filter0_f_444_4697)">
|
||||
<path
|
||||
d="M462.953 432.967C455.894 423.713 447.268 414.516 437.138 405.444C418.384 388.658 395.412 373.157 368.855 359.372C341.364 345.102 311.219 333.302 279.251 324.302C247.283 315.302 215.41 309.639 184.514 307.472C154.664 305.377 126.978 306.617 102.223 311.153C77.4525 315.692 56.8624 323.305 41.0193 333.781C24.5938 344.646 14.0196 358.124 9.59228 373.851C2.83761 397.848 11.1094 425.026 33.5152 452.463C44.2949 465.66 58.0947 478.584 74.5322 490.879C91.1154 503.28 110.072 514.809 130.89 525.145L131.149 524.624C89.3866 503.882 55.7825 478.803 33.9689 452.094C11.691 424.819 3.45077 397.815 10.1533 374.011C18.8422 343.145 51.5773 321.027 102.325 311.728C153.144 302.415 215.919 307.081 279.089 324.865C342.258 342.649 398.246 371.421 436.743 405.879C475.185 440.288 491.571 476.235 482.882 507.101C476.303 530.473 455.771 549.003 423.514 560.688L423.71 561.236C456.153 549.485 476.808 530.819 483.441 507.257C487.868 491.53 485.883 474.515 477.535 456.678C473.835 448.765 468.957 440.843 462.946 432.963L462.953 432.967Z"
|
||||
stroke="url(#paint0_linear_444_4697)"
|
||||
stroke-width="1.48"
|
||||
stroke-linejoin="bevel"
|
||||
strokeWidth="1.48"
|
||||
strokeLinejoin="bevel"
|
||||
/>
|
||||
</g>
|
||||
<g filter="url(#filter1_f_444_4697)">
|
||||
<path
|
||||
d="M432.417 493.767C435.614 506.985 437.501 519.452 438.065 531.078L438.061 531.071C438.541 540.97 438.064 550.261 436.623 558.876C433.38 578.301 425.363 593.44 412.795 603.88C393.967 619.521 366.368 623.177 332.984 614.451L333.134 613.888C366.327 622.564 393.747 618.95 412.424 603.434C437.088 582.944 443.985 544.045 431.846 493.902C419.688 443.686 389.902 388.232 347.967 337.752C306.033 287.273 256.983 247.82 209.848 226.662C162.78 205.533 123.275 205.179 98.6104 225.669C82.4897 239.06 73.9031 260.43 73.4076 288L72.8153 288.5C73.2177 260.504 81.8831 238.808 98.2388 225.22C110.806 214.779 127.16 209.677 146.851 210.047C165.841 210.407 187.116 215.818 210.091 226.131C233.05 236.438 256.554 251.122 279.948 269.78C304.162 289.091 327.199 311.835 348.421 337.381C369.642 362.926 387.774 389.745 402.319 417.091C416.37 443.508 426.495 469.305 432.417 493.767Z"
|
||||
stroke="url(#paint1_linear_444_4697)"
|
||||
stroke-width="1.48"
|
||||
stroke-linejoin="bevel"
|
||||
strokeWidth="1.48"
|
||||
strokeLinejoin="bevel"
|
||||
/>
|
||||
</g>
|
||||
</g>
|
||||
@@ -79,11 +56,11 @@ const FunctionsVisual = ({ isHovered }: { isHovered?: boolean }) => {
|
||||
width="485.675"
|
||||
height="261.952"
|
||||
filterUnits="userSpaceOnUse"
|
||||
color-interpolation-filters="sRGB"
|
||||
colorInterpolationFilters="sRGB"
|
||||
>
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix" />
|
||||
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape" />
|
||||
<feGaussianBlur stdDeviation="1.44088" result="effect1_foregroundBlur_444_4697" />
|
||||
<feGaussianBlur stdDeviation="0.44088" result="effect1_foregroundBlur_444_4697" />
|
||||
</filter>
|
||||
<filter
|
||||
id="filter1_f_444_4697"
|
||||
@@ -92,56 +69,51 @@ const FunctionsVisual = ({ isHovered }: { isHovered?: boolean }) => {
|
||||
width="372.67"
|
||||
height="416.295"
|
||||
filterUnits="userSpaceOnUse"
|
||||
color-interpolation-filters="sRGB"
|
||||
colorInterpolationFilters="sRGB"
|
||||
>
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix" />
|
||||
<feFlood floodOpacity="0" result="BackgroundImageFix" />
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape" />
|
||||
<feGaussianBlur stdDeviation="1.44088" result="effect1_foregroundBlur_444_4697" />
|
||||
<feGaussianBlur stdDeviation="0.44088" result="effect1_foregroundBlur_444_4697" />
|
||||
</filter>
|
||||
<motion.linearGradient
|
||||
id="paint0_linear_444_4697"
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="0"
|
||||
y2="0"
|
||||
// x2="348"
|
||||
// y2="300"
|
||||
x2="348"
|
||||
y2="300"
|
||||
variants={gradientVariant1}
|
||||
transition={{
|
||||
duration: 1,
|
||||
// repeat: Infinity,
|
||||
duration: 0.75,
|
||||
ease: 'linear',
|
||||
}}
|
||||
gradientUnits="userSpaceOnUse"
|
||||
>
|
||||
<stop offset="0" stop-color="#4B4B4B" stop-opacity="0" />
|
||||
<stop offset="0.2" stop-color="#3ECF8E" />
|
||||
<stop offset="0.8" stop-color="#3ECF8E" stop-opacity="0.3" />
|
||||
<stop offset="1" stop-color="#4B4B4B" stop-opacity="0" />
|
||||
<stop offset="0" stopColor="#4B4B4B" stopOpacity="0" />
|
||||
<stop offset="0.2" stopColor="#3ECF8E" />
|
||||
<stop offset="0.8" stopColor="#3ECF8E" stopOpacity="0.0" />
|
||||
<stop offset="1" stopColor="#4B4B4B" stopOpacity="0" />
|
||||
</motion.linearGradient>
|
||||
<motion.linearGradient
|
||||
id="paint1_linear_444_4697"
|
||||
x1="0"
|
||||
y1="0"
|
||||
x2="0"
|
||||
// x2="348"
|
||||
x2="348"
|
||||
y2="0"
|
||||
variants={gradientVariant2}
|
||||
transition={{
|
||||
duration: 0.9,
|
||||
// ease: 'linear',
|
||||
type: 'spring',
|
||||
// delay: 0.9,
|
||||
duration: 0.75,
|
||||
ease: 'easeOut',
|
||||
delay: 0.25,
|
||||
}}
|
||||
gradientUnits="userSpaceOnUse"
|
||||
>
|
||||
<stop offset="0" stop-color="#4B4B4B" stop-opacity="0" />
|
||||
<stop offset="0.1" stop-color="#3ECF8E" />
|
||||
<stop offset="0.9" stop-color="#3ECF8E" />
|
||||
<stop offset="1" stop-color="#4B4B4B" stop-opacity="0" />
|
||||
<stop offset="0" stopColor="#4B4B4B" stopOpacity="0" />
|
||||
<stop offset="0.1" stopColor="#3ECF8E" stopOpacity="0.0" />
|
||||
<stop offset="0.9" stopColor="#3ECF8E" />
|
||||
<stop offset="1" stopColor="#4B4B4B" stopOpacity="0" />
|
||||
</motion.linearGradient>
|
||||
<clipPath id="clip0_444_4697">
|
||||
<rect width="289" height="430" fill="white" />
|
||||
<rect width="289" height="430" fill="none" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
@@ -1,53 +1,100 @@
|
||||
<svg width="290" height="431" viewBox="0 0 290 431" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_410_1776)">
|
||||
<rect width="289" height="430" transform="translate(0.5 0.046875)" fill="#1C1C1C"/>
|
||||
<g filter="url(#filter0_f_410_1776)">
|
||||
<ellipse cx="63.6697" cy="65.9652" rx="63.6697" ry="65.9652" transform="matrix(0.978344 0.206986 0.206986 -0.978344 7.5459 362.219)" fill="#85E0B7"/>
|
||||
<svg width="289" height="431" viewBox="0 0 289 431" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_444_4609)">
|
||||
<rect width="289" height="430" transform="translate(0 0.046875)" fill="#1C1C1C"/>
|
||||
<g filter="url(#filter0_f_444_4609)">
|
||||
<ellipse cx="63.6697" cy="65.9652" rx="63.6697" ry="65.9652" transform="matrix(0.978344 0.206986 0.206986 -0.978344 7.0459 362.219)" fill="#85E0B7"/>
|
||||
</g>
|
||||
<g filter="url(#filter1_b_410_1776)">
|
||||
<circle cx="191.986" cy="191.986" r="191.986" transform="matrix(-0.978344 -0.206986 -0.206986 0.978344 443.938 268.734)" fill="#1C1C1C"/>
|
||||
<g filter="url(#filter1_b_444_4609)">
|
||||
<circle cx="191.986" cy="191.986" r="191.986" transform="matrix(-0.978344 -0.206986 -0.206986 0.978344 443.438 268.734)" fill="#1C1C1C"/>
|
||||
</g>
|
||||
<path d="M116.405 582.836C114.746 581.825 117.768 573.229 125.144 557.898C132.52 542.567 144.001 521.047 158.426 495.493C172.851 469.939 189.714 441.261 207.323 412.347C224.94 383.419 242.677 355.281 258.748 330.731C274.832 306.189 288.687 286.114 298.92 272.531C309.161 258.935 315.418 252.317 317.077 253.328M92.1721 565.397C85.2811 559.567 84.2622 547.03 89.2093 529.05C94.1702 511.078 104.936 488.276 120.418 462.966C135.899 437.655 155.57 410.717 177.434 384.87C199.306 359.009 222.596 335.146 244.968 315.666C267.354 296.194 288.031 281.785 304.934 273.91C321.837 266.036 334.368 264.96 341.267 270.777M68.535 541.592C58.601 529.667 55.7015 512.258 60.1007 491.103C64.4998 469.948 76.0735 445.789 93.6355 421.056C111.198 396.323 134.138 371.887 160.153 350.205C186.168 328.523 214.34 310.368 241.822 297.553C269.319 284.746 295.158 277.718 316.774 277.191C338.382 276.678 354.989 282.668 364.909 294.586M45.6763 507.274C35.994 488.718 34.383 466.355 41.0139 442.449C47.6447 418.543 62.2831 393.938 83.4376 371.092C104.606 348.253 131.549 327.989 161.571 312.324C191.593 296.658 223.644 286.182 254.481 281.893C285.332 277.611 313.886 279.709 337.277 287.95C360.668 296.191 378.081 310.32 387.763 328.877M27.58 455.991C22.6815 431.55 26.6091 405.782 38.9677 381.283C51.3262 356.784 71.676 334.412 97.9828 316.431C124.29 298.449 155.616 285.476 188.816 278.816C222.017 272.156 255.922 272.062 287.127 278.521C318.333 284.98 345.731 297.775 366.573 315.614C387.415 333.453 400.97 355.731 405.869 380.172M26.9388 383.523C31.8152 356.729 45.3772 332.013 66.2671 311.855C87.1431 291.688 114.61 276.788 145.91 268.64C177.203 260.505 211.216 259.406 244.529 265.483C277.85 271.546 309.294 284.566 335.697 303.217C362.1 321.869 382.564 345.493 394.988 371.728C407.411 397.964 411.397 425.87 406.52 452.664M60.6537 304.714C85.2296 270.894 125.233 250.39 171.883 247.732C218.533 245.074 267.991 260.477 309.381 290.539C350.771 320.6 380.715 362.885 392.608 408.055C404.494 453.239 397.38 497.622 372.818 531.449M120.325 250.992C154.645 231.196 197.721 229.803 240.072 247.145C282.422 264.488 320.576 299.108 346.136 343.436C371.704 387.749 382.588 438.119 376.386 483.46C370.184 528.801 347.424 565.398 313.104 585.194M178.815 228.938C212.885 222.11 249.549 235.483 280.753 266.135C311.957 296.788 335.125 342.171 345.185 392.335C355.244 442.499 351.341 493.323 334.363 533.619C317.385 573.915 288.703 600.399 254.634 607.227M225.286 225.372C252.754 226.596 278.201 248.075 296.023 285.073C313.845 322.07 322.569 371.583 320.314 422.691C318.038 473.805 304.958 522.331 283.922 557.612C262.886 592.892 235.646 612.034 208.178 610.809M261.482 230.447C279.357 234.705 291.777 258.573 296.024 296.771C300.27 334.968 295.99 384.392 284.113 434.164C272.244 483.923 253.752 529.969 232.724 562.147C211.695 594.326 189.84 610.013 171.972 605.742M291.118 240.091C298.502 243.18 297.732 264.888 289 300.447C280.268 336.005 264.286 382.505 244.557 429.705C224.829 476.905 202.982 520.961 183.798 552.16C164.635 583.352 149.72 599.156 142.336 596.066M150.675 599.349C131.846 592.485 113.561 582.332 97.7809 569.976M221.021 610.951C191.309 611.622 156.519 601.962 124.49 584.176C92.4602 566.39 65.8907 541.958 50.7323 516.388M266.995 604.342C229.211 614.541 176.439 604.357 128.182 577.559C79.9238 550.762 43.3829 511.35 32.0673 473.885M305.205 589.504C285.287 599.785 258.257 603.137 227.702 599.115C197.147 595.093 164.472 583.9 134.044 567.003C103.615 550.106 76.8333 528.3 57.275 504.476C37.709 480.665 26.2655 455.948 24.4628 433.606M337.587 568.451C318.123 584.093 288.201 591.057 252.678 588.212C217.154 585.368 178.12 572.881 141.923 552.781C105.726 532.681 74.4925 506.147 53.299 477.496C32.1054 448.846 22.2003 419.766 25.1883 394.974M364.393 542.224C346.879 563.066 315.491 573.875 276.255 572.579C237.011 571.297 192.648 558.001 151.677 535.249C110.705 512.498 75.9673 481.869 54.1337 449.234C32.3001 416.599 24.8827 384.242 33.3085 358.372M385.383 511.74C375.95 528.727 358.896 541.068 335.934 547.564C312.958 554.052 284.897 554.448 254.544 548.697C224.191 542.946 192.632 531.271 163.018 514.826C133.404 498.381 106.81 477.764 85.8832 455.039C64.956 432.314 50.4448 408.277 43.8203 385.352C37.182 362.418 38.6636 341.413 48.0892 324.439M385.383 511.74C360.547 556.465 318.948 589.498 269.756 603.564C220.563 617.629 167.811 611.572 123.072 586.729C78.3468 561.893 45.3133 520.294 31.2404 471.115C17.1751 421.922 23.2316 369.17 48.0754 324.431C72.9114 279.706 114.51 246.673 163.689 232.6C212.882 218.534 265.634 224.591 310.373 249.435C355.098 274.271 388.131 315.869 402.204 365.048C416.27 414.241 410.219 467.015 385.383 511.74ZM400.164 477.807C393.725 497.595 378.312 512.67 355.696 521.308C333.086 529.931 304.207 531.769 272.367 526.582C240.52 521.41 207.003 509.424 175.677 492.029C144.338 474.626 116.46 452.518 95.2333 428.219C74.0069 403.92 60.2788 378.44 55.661 354.697C51.0295 330.946 55.6923 309.902 69.0797 293.954M408.249 441.203C405.573 463.352 392.742 480.962 371.446 491.741C350.142 50Line truncated
|
||||
<g filter="url(#filter2_f_410_1776)">
|
||||
<circle cx="187.13" cy="187.13" r="187.13" transform="matrix(-0.978344 -0.206986 -0.206986 0.978344 426.761 289.816)" fill="#161616"/>
|
||||
<path d="M115.905 582.836C114.246 581.825 117.268 573.229 124.644 557.898C132.02 542.567 143.501 521.047 157.926 495.493C172.351 469.939 189.214 441.261 206.823 412.347C224.44 383.419 242.177 355.281 258.248 330.731C274.332 306.189 288.187 286.114 298.42 272.531C308.661 258.935 314.918 252.317 316.577 253.328M91.6721 565.397C84.7811 559.567 83.7622 547.03 88.7093 529.05C93.6702 511.078 104.436 488.276 119.918 462.966C135.399 437.655 155.07 410.717 176.934 384.87C198.806 359.009 222.096 335.146 244.468 315.666C266.854 296.194 287.531 281.785 304.434 273.91C321.337 266.036 333.868 264.96 340.767 270.777M68.035 541.592C58.101 529.667 55.2015 512.258 59.6007 491.103C63.9998 469.948 75.5735 445.789 93.1355 421.056C110.698 396.323 133.638 371.887 159.653 350.205C185.668 328.523 213.84 310.368 241.322 297.553C268.819 284.746 294.658 277.718 316.274 277.191C337.882 276.678 354.489 282.668 364.409 294.586M45.1763 507.274C35.494 488.718 33.883 466.355 40.5139 442.449C47.1447 418.543 61.7831 393.938 82.9376 371.092C104.106 348.253 131.049 327.989 161.071 312.324C191.093 296.658 223.144 286.182 253.981 281.893C284.832 277.611 313.386 279.709 336.777 287.95C360.168 296.191 377.581 310.32 387.263 328.877M27.08 455.991C22.1815 431.55 26.1091 405.782 38.4677 381.283C50.8262 356.784 71.176 334.412 97.4828 316.431C123.79 298.449 155.116 285.476 188.316 278.816C221.517 272.156 255.422 272.062 286.627 278.521C317.833 284.98 345.231 297.775 366.073 315.614C386.915 333.453 400.47 355.731 405.369 380.172M26.4388 383.523C31.3152 356.729 44.8772 332.013 65.7671 311.855C86.6431 291.688 114.11 276.788 145.41 268.64C176.703 260.505 210.716 259.406 244.029 265.483C277.35 271.546 308.794 284.566 335.197 303.217C361.6 321.869 382.064 345.493 394.488 371.728C406.911 397.964 410.897 425.87 406.02 452.664M60.1537 304.714C84.7296 270.894 124.733 250.39 171.383 247.732C218.033 245.074 267.491 260.477 308.881 290.539C350.271 320.6 380.215 362.885 392.108 408.055C403.994 453.239 396.88 497.622 372.318 531.449M119.825 250.992C154.145 231.196 197.221 229.803 239.572 247.145C281.922 264.488 320.076 299.108 345.636 343.436C371.204 387.749 382.088 438.119 375.886 483.46C369.684 528.801 346.924 565.398 312.604 585.194M178.315 228.938C212.385 222.11 249.049 235.483 280.253 266.135C311.457 296.788 334.625 342.171 344.685 392.335C354.744 442.499 350.841 493.323 333.863 533.619C316.885 573.915 288.203 600.399 254.134 607.227M224.786 225.372C252.254 226.596 277.701 248.075 295.523 285.073C313.345 322.07 322.069 371.583 319.814 422.691C317.538 473.805 304.458 522.331 283.422 557.612C262.386 592.892 235.146 612.034 207.678 610.809M260.982 230.447C278.857 234.705 291.277 258.573 295.524 296.771C299.77 334.968 295.49 384.392 283.613 434.164C271.744 483.923 253.252 529.969 232.224 562.147C211.195 594.326 189.34 610.013 171.472 605.742M290.618 240.091C298.002 243.18 297.232 264.888 288.5 300.447C279.768 336.005 263.786 382.505 244.057 429.705C224.329 476.905 202.482 520.961 183.298 552.16C164.135 583.352 149.22 599.156 141.836 596.066M150.175 599.349C131.346 592.485 113.061 582.332 97.2809 569.976M220.521 610.951C190.809 611.622 156.019 601.962 123.99 584.176C91.9602 566.39 65.3907 541.958 50.2323 516.388M266.495 604.342C228.711 614.541 175.939 604.357 127.682 577.559C79.4238 550.762 42.8829 511.35 31.5673 473.885M304.705 589.504C284.787 599.785 257.757 603.137 227.202 599.115C196.647 595.093 163.972 583.9 133.544 567.003C103.115 550.106 76.3333 528.3 56.775 504.476C37.209 480.665 25.7655 455.948 23.9628 433.606M337.087 568.451C317.623 584.093 287.701 591.057 252.178 588.212C216.654 585.368 177.62 572.881 141.423 552.781C105.226 532.681 73.9925 506.147 52.799 477.496C31.6054 448.846 21.7003 419.766 24.6883 394.974M363.893 542.224C346.379 563.066 314.991 573.875 275.755 572.579C236.511 571.297 192.148 558.001 151.177 535.249C110.205 512.498 75.4673 481.869 53.6337 449.234C31.8001 416.599 24.3827 384.242 32.8085 358.372M384.883 511.74C375.45 528.727 358.396 541.068 335.434 547.564C312.458 554.052 284.397 554.448 254.044 548.697C223.691 542.946 192.132 531.271 162.518 514.826C132.904 498.381 106.31 477.764 85.3832 455.039C64.456 432.314 49.9448 408.277 43.3203 385.352C36.682 362.418 38.1636 341.413 47.5892 324.439M384.883 511.74C360.047 556.465 318.448 589.498 269.256 603.564C220.063 617.629 167.311 611.572 122.572 586.729C77.8468 561.893 44.8133 520.294 30.7404 471.115C16.6751 421.922 22.7316 369.17 47.5754 324.431C72.4114 279.706 114.01 246.673 163.189 232.6C212.382 218.534 265.134 224.591 309.873 249.435C354.598 274.271 387.631 315.869 401.704 365.048C415.77 414.241 409.719 467.015 384.883 511.74ZM399.664 477.807C393.225 497.595 377.812 512.67 355.196 521.308C332.586 529.931 303.707 531.769 271.867 526.582C240.02 521.41 206.503 509.424 175.177 492.029C143.838 474.626 115.96 452.518 94.7333 428.219C73.5069 403.92 59.7788 378.44 55.161 354.697C50.5295 330.946 55.1923 309.902 68.5797 293.954M407.749 441.203C405.073 463.352 392.242 480.962 370.946 491.741C349.642 Line truncated
|
||||
<g filter="url(#filter2_f_444_4609)">
|
||||
<circle cx="187.13" cy="187.13" r="187.13" transform="matrix(-0.978344 -0.206986 -0.206986 0.978344 426.261 289.816)" fill="#161616"/>
|
||||
</g>
|
||||
<g filter="url(#filter3_f_410_1776)">
|
||||
<path d="M115.743 271.843C133.993 259.232 152.144 253.148 150.819 251.23C149.493 249.312 130.12 252.593 111.87 265.204C93.6205 277.815 83.4051 294.98 84.7305 296.898C86.0559 298.816 97.493 284.454 115.743 271.843Z" fill="#707070"/>
|
||||
<g filter="url(#filter3_f_444_4609)">
|
||||
<path d="M115.243 271.843C133.493 259.232 151.644 253.149 150.319 251.231C148.993 249.312 129.62 252.594 111.37 265.205C93.1205 277.816 82.9051 294.98 84.2305 296.898C85.5559 298.817 96.993 284.454 115.243 271.843Z" fill="#707070"/>
|
||||
</g>
|
||||
<circle cx="30.9958" cy="190.902" r="51.738" fill="#1C1C1C"/>
|
||||
<g filter="url(#filter4_f_410_1776)">
|
||||
<path d="M56.3599 220.28C47.4137 227.025 37.7807 229.679 38.7528 230.968C39.725 232.257 50.3718 231.442 59.318 224.697C68.2642 217.952 72.1222 207.832 71.15 206.542C70.1778 205.253 65.3062 213.535 56.3599 220.28Z" fill="#707070"/>
|
||||
<g opacity="0.5">
|
||||
<g filter="url(#filter4_b_444_4609)">
|
||||
<path d="M423.822 560.731C423.823 560.731 423.823 560.731 423.823 560.731L423.822 560.731ZM130.843 524.632C130.843 524.632 130.842 524.632 130.842 524.632L130.843 524.632Z" stroke="#EDEDED" stroke-width="0.960585"/>
|
||||
</g>
|
||||
<g filter="url(#filter5_f_444_4609)">
|
||||
<path d="M462.953 433.014C455.894 423.76 447.268 414.563 437.138 405.491C418.384 388.705 395.412 373.204 368.855 359.419C341.364 345.149 311.219 333.348 279.251 324.349C247.283 315.349 215.41 309.686 184.514 307.519C154.664 305.424 126.978 306.664 102.223 311.2C77.4525 315.739 56.8624 323.351 41.0193 333.828C24.5938 344.693 14.0196 358.171 9.59228 373.898C2.83761 397.895 11.1094 425.073 33.5152 452.51C44.2949 465.707 58.0947 478.631 74.5322 490.926C91.1154 503.327 110.072 514.856 130.89 525.192L131.149 524.67C89.3866 503.928 55.7825 478.85 33.9689 452.141C11.691 424.865 3.45077 397.862 10.1533 374.058C18.8422 343.192 51.5773 321.074 102.325 311.775C153.144 302.462 215.919 307.128 279.089 324.912C342.258 342.696 398.246 371.467 436.743 405.926C475.185 440.335 491.571 476.282 482.882 507.147C476.303 530.52 455.771 549.05 423.514 560.735L423.71 561.283C456.153 549.532 476.808 530.866 483.441 507.304C487.868 491.577 485.883 474.562 477.535 456.725C473.835 448.812 468.957 440.89 462.946 433.01L462.953 433.014Z" stroke="url(#paint0_linear_444_4609)" stroke-width="1.48" stroke-linejoin="bevel"/>
|
||||
</g>
|
||||
<g filter="url(#filter6_b_444_4609)">
|
||||
<mask id="path-8-inside-1_444_4609" fill="white">
|
||||
<path d="M432.417 493.814C435.614 507.03 437.5 519.496 438.065 531.12C438.065 531.121 438.063 531.122 438.063 531.121C438.062 531.12 438.061 531.12 438.061 531.121C438.541 541.019 438.064 550.308 436.623 558.923C433.38 578.347 425.363 593.486 412.795 603.927C394.02 619.524 366.525 623.203 333.269 614.572C333.113 614.531 333.018 614.371 333.059 614.215C333.1 614.06 333.261 613.968 333.417 614.008C366.483 622.59 393.8 618.953 412.424 603.481C437.088 582.991 443.985 544.092 431.846 493.949C419.688 443.732 389.902 388.278 347.967 337.799C306.033 287.32 256.983 247.867 209.848 226.709C162.78 205.58 123.275 205.226 98.6104 225.716C82.513 239.087 73.928 260.415 73.4098 287.927C73.4083 288.003 73.3773 288.076 73.3233 288.13C73.1371 288.315 72.8209 288.177 72.8258 287.915C73.3487 260.224 82.0063 238.752 98.2388 225.266C110.806 214.826 127.16 209.724 146.851 210.094C165.841 210.453 187.116 215.864 210.091 226.178C233.05 236.484 256.554 251.168 279.948 269.827C304.162 289.137 327.199 311.881 348.421 337.427C369.642 362.973 387.774 389.792 402.319 417.138C416.37 443.555 426.495 469.352 432.417 493.814Z"/>
|
||||
</mask>
|
||||
<path d="M438.065 531.12L439.024 531.074L439.024 531.074L438.065 531.12ZM432.417 493.814L433.351 493.588L433.351 493.588L432.417 493.814ZM402.319 417.138L401.471 417.589L401.471 417.589L402.319 417.138ZM348.421 337.427L347.682 338.041L348.421 337.427ZM279.948 269.827L279.349 270.578L279.349 270.578L279.948 269.827ZM210.091 226.178L210.484 225.301L210.484 225.301L210.091 226.178ZM146.851 210.094L146.869 209.133L146.869 209.133L146.851 210.094ZM98.2388 225.266L97.625 224.527L97.625 224.527L98.2388 225.266ZM98.6104 225.716L99.2242 226.455L99.2242 226.455L98.6104 225.716ZM209.848 226.709L209.454 227.585L209.454 227.585L209.848 226.709ZM347.967 337.799L348.706 337.185L347.967 337.799ZM431.846 493.949L432.78 493.722L432.78 493.723L431.846 493.949ZM412.424 603.481L411.81 602.742L411.81 602.742L412.424 603.481ZM333.417 614.008L333.175 614.938L333.175 614.938L333.417 614.008ZM333.269 614.572L333.51 613.642L333.511 613.642L333.269 614.572ZM412.795 603.927L413.409 604.666L412.795 603.927ZM436.623 558.923L435.676 558.765L435.676 558.764L436.623 558.923ZM438.061 531.121L439.02 531.075L439.02 531.075L438.061 531.121ZM72.8258 287.915L71.8654 287.897L72.8258 287.915ZM73.4098 287.927L72.4494 287.909L72.4494 287.909L73.4098 287.927ZM73.3233 288.13L72.6463 287.449L72.6463 287.449L73.3233 288.13ZM438.063 531.121L438.894 530.639L438.9 530.65L438.063 531.121ZM333.059 614.215L332.131 613.969L332.131 613.969L333.059 614.215ZM437.105 531.167C436.544 519.612 434.668 507.206 431.484 494.04L433.351 493.588C436.559 506.853 438.456 519.38 439.024 531.074L437.105 531.167ZM431.484 494.04C425.584 469.669 415.491 443.948 401.471 417.589L403.167 416.687C417.249 443.162 427.407 469.034 433.351 493.588L431.484 494.04ZM401.471 417.589C386.958 390.305 368.864 363.54 347.682 338.041L349.16 336.813C370.42 362.406 388.589 389.279 403.167 416.687L401.471 417.589ZM347.682 338.041C326.499 312.542 303.509 289.845 279.349 270.578L280.547 269.076C304.816 288.43 327.899 311.221 349.16 336.813L347.682 338.041ZM279.349 270.578C256.006 251.96 232.571 237.322 209.697 227.054L210.484 225.301C233.529 235.647 257.101 250.376 280.547 269.076L279.349 270.578ZM209.697 227.054C186.804 216.777 165.658 211.411 146.832 211.054L146.869 209.133C166.023 209.496 187.428 214.951 210.484 225.301L209.697 227.054ZM146.833 211.054C127.323 210.688 111.208 215.741 98.8526 226.005L97.625 224.527C110.405 213.911 126.998 208.76 146.869 209.133L146.833 211.054ZM97.9966 224.977C123.091 204.13 163.061 204.653 210.241 225.832L209.454 227.585C162.5 206.507 123.459 206.322 99.2242 226.455L97.9966 224.977ZM210.241 225.832C257.541 247.065 306.703 286.623 348.706 337.185L347.229 338.413C305.363 288.017 256.425 248.669 209.454 227.585L210.241 225.832ZM348.706 337.185C390.71 387.748 420.58 443.331 432.78 493.722L430.912 494.175C418.797 444.134 389.094 388.809 347.229 338.413L348.706 337.185ZM432.78 493.723C444.948 543.986 438.132 583.372 413.037 604.22L411.81 602.742C436.044 582.609 443.022 544.197 430.912 494.175L432.78 493.723ZM413.037 604.22C394.088 619.963 366.409 623.563 333.175 614.938L333.658 613.078C366.557 621.617 393.513 617.943 411.81 602.742L413.037 604.22ZM333.511 613.642C366.598 622.229 393.732 618.514 412.181 603.188L413.409 604.666C394.309 620.533 366.452 624.176 333.028 615.502L333.511 613.642ZM412.181 603.188C424.537 592.923 432.462 578.011 435.676 558.765L437.571 559.081C434.297 578.684 426.188 594.049 413.409 604.666L412.181 603.188ZM435.676 558.764C437.104 550.226 437.579 541.007 437.102 531.168L439.02 531.075C439.503 541.032 439.024 550.39 437.571 559.081L435.676 558.764ZM98.8527 226.005C82.8988 239.259 74.3056 260.426 73.7862 287.933L71.8654 287.897C72.3917 260.022 81.1137 238.245 97.625 224.527L98.8527 226.005ZM72.4494 287.909C72.971 260.214 81.62 238.58 97.9966 224.977L99.2242 226.455C83.406 239.594 74.885 260.616 74.3702 287.945L72.4494 287.909ZM74.3702 287.945C74.3641 288.267 74.2336 288.58 74.0003 288.812L72.6463 287.449C72.521 287.573 72.4526 287.738 72.4494 287.909L74.3702 287.945ZM437.102 531.168C437.051 530.135 438.401 529.79 438.894 530.639L437.232 531.603C437.723 532.45 439.07 532.106 439.02 531.075L437.102 531.168ZM333.988 614.461C334.085 614.095 333.862 613.733 333.51 613.642L333.028 615.502C332.364 615.329 331.951 614.647 332.131 613.969L333.988 614.461ZM73.7862 287.933C73.7972 287.353 73.0867 287.011 72.6463 287.449L74.0003 288.812C73.1874 289.619 71.8445 289.001 71.8654 287.897L73.7862 287.933ZM333.175 614.938C333.522 615.028 333.891 614.827 333.988 614.461L332.131 613.969C332.31 613.293 333.001 612.908 333.658 613.078L333.175 614.938ZM439.024 531.074C439.078 532.177 437.678 532.397 437.225 531.592L438.9 530.65C438.659 530.221 438.183 530.094 437.813 530.194C437.442 530.295 437.08 530.654 437.105 531.167L439.024 531.074Z" fill="#EDEDED" mask="url(#path-8-inside-1_444_4609)"/>
|
||||
</g>
|
||||
<g filter="url(#filter7_f_444_4609)">
|
||||
<path d="M432.417 493.814C435.614 507.032 437.501 519.499 438.065 531.125L438.061 531.118C438.541 541.017 438.064 550.307 436.623 558.923C433.38 578.348 425.363 593.486 412.795 603.927C393.967 619.568 366.368 623.224 332.984 614.498L333.134 613.935C366.327 622.611 393.747 618.997 412.424 603.481C437.088 582.991 443.985 544.092 431.846 493.949C419.688 443.733 389.902 388.279 347.967 337.799C306.033 287.32 256.983 247.867 209.848 226.709C162.78 205.58 123.275 205.226 98.6104 225.716C82.4897 239.107 73.9031 260.477 73.4076 288.047L72.8153 288.547C73.2177 260.551 81.8831 238.855 98.2388 225.266C110.806 214.826 127.16 209.724 146.851 210.094C165.841 210.454 187.116 215.864 210.091 226.178C233.05 236.485 256.554 251.169 279.948 269.827C304.162 289.138 327.199 311.882 348.421 337.428C369.642 362.973 387.774 389.792 402.319 417.138C416.37 443.555 426.495 469.352 432.417 493.814Z" stroke="url(#paint1_linear_444_4609)" stroke-width="1.48" stroke-linejoin="bevel"/>
|
||||
</g>
|
||||
</g>
|
||||
<circle cx="30.4958" cy="190.902" r="51.738" fill="#1C1C1C"/>
|
||||
<g filter="url(#filter8_f_444_4609)">
|
||||
<path d="M55.8599 220.28C46.9137 227.025 37.2807 229.679 38.2528 230.968C39.225 232.257 49.8718 231.442 58.818 224.697C67.7642 217.952 71.6222 207.832 70.65 206.542C69.6778 205.253 64.8062 213.535 55.8599 220.28Z" fill="#707070"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<filter id="filter0_f_410_1776" x="-153.636" y="71.6361" width="474.253" height="478.449" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<filter id="filter0_f_444_4609" x="-154.136" y="71.6361" width="474.253" height="478.449" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
|
||||
<feGaussianBlur stdDeviation="86.6717" result="effect1_foregroundBlur_410_1776"/>
|
||||
<feGaussianBlur stdDeviation="86.6717" result="effect1_foregroundBlur_444_4609"/>
|
||||
</filter>
|
||||
<filter id="filter1_b_410_1776" x="15.4869" y="215.939" width="401.77" height="401.77" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<filter id="filter1_b_444_4609" x="14.9869" y="215.939" width="401.77" height="401.77" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feGaussianBlur in="BackgroundImageFix" stdDeviation="4.42994"/>
|
||||
<feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_410_1776"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_410_1776" result="shape"/>
|
||||
<feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_444_4609"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_444_4609" result="shape"/>
|
||||
</filter>
|
||||
<filter id="filter2_f_410_1776" x="-57.9759" y="171.234" width="525.852" height="525.852" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<filter id="filter2_f_444_4609" x="-58.4759" y="171.235" width="525.852" height="525.852" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
|
||||
<feGaussianBlur stdDeviation="37.8787" result="effect1_foregroundBlur_410_1776"/>
|
||||
<feGaussianBlur stdDeviation="37.8787" result="effect1_foregroundBlur_444_4609"/>
|
||||
</filter>
|
||||
<filter id="filter3_f_410_1776" x="64.1057" y="230.213" width="107.291" height="87.3686" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<filter id="filter3_f_444_4609" x="63.6057" y="230.213" width="107.291" height="87.3686" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
|
||||
<feGaussianBlur stdDeviation="10.255" result="effect1_foregroundBlur_410_1776"/>
|
||||
<feGaussianBlur stdDeviation="10.255" result="effect1_foregroundBlur_444_4609"/>
|
||||
</filter>
|
||||
<filter id="filter4_f_410_1776" x="27.1749" y="194.898" width="55.6316" height="48.0923" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<filter id="filter4_b_444_4609" x="-56.8612" y="242.364" width="606.762" height="383.002" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feGaussianBlur in="BackgroundImageFix" stdDeviation="32.083"/>
|
||||
<feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_444_4609"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_444_4609" result="shape"/>
|
||||
</filter>
|
||||
<filter id="filter5_f_444_4609" x="3.68233" y="302.909" width="485.675" height="261.952" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
|
||||
<feGaussianBlur stdDeviation="5.755" result="effect1_foregroundBlur_410_1776"/>
|
||||
<feGaussianBlur stdDeviation="1.44088" result="effect1_foregroundBlur_444_4609"/>
|
||||
</filter>
|
||||
<clipPath id="clip0_410_1776">
|
||||
<rect width="289" height="430" fill="white" transform="translate(0.5 0.046875)"/>
|
||||
<filter id="filter6_b_444_4609" x="8.65984" y="145.909" width="493.748" height="537.384" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feGaussianBlur in="BackgroundImageFix" stdDeviation="32.083"/>
|
||||
<feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_444_4609"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_444_4609" result="shape"/>
|
||||
</filter>
|
||||
<filter id="filter7_f_444_4609" x="69.1937" y="206.454" width="372.67" height="416.295" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
|
||||
<feGaussianBlur stdDeviation="1.44088" result="effect1_foregroundBlur_444_4609"/>
|
||||
</filter>
|
||||
<filter id="filter8_f_444_4609" x="26.6748" y="194.898" width="55.6317" height="48.0923" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
|
||||
<feGaussianBlur stdDeviation="5.755" result="effect1_foregroundBlur_444_4609"/>
|
||||
</filter>
|
||||
<linearGradient id="paint0_linear_444_4609" x1="36.5" y1="344.546" x2="348" y2="427.546" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#3ECF8E"/>
|
||||
<stop offset="1" stop-color="#4B4B4B" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="paint1_linear_444_4609" x1="137.049" y1="216.358" x2="346.498" y2="461.413" gradientUnits="userSpaceOnUse">
|
||||
<stop stop-color="#3ECF8E"/>
|
||||
<stop offset="1" stop-color="#4B4B4B" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<clipPath id="clip0_444_4609">
|
||||
<rect width="289" height="430" fill="white" transform="translate(0 0.046875)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 21 KiB |
Reference in new issue
Block a user