Visual improvements

main
Midnight 1 year ago
parent 38dbbe7a5b
commit 99935d9f78

@ -61,7 +61,7 @@
<div class="@container flex flex-col justify-center"> <div class="@container flex flex-col justify-center">
<div class="flex flex-col gap-2 whitepigeon text-white text-center bg-[#3A53FF]"> <div class="flex flex-col gap-2 whitepigeon text-white text-center bg-[#3A53FF]">
<h2 class="font-bold text-4xl lg:text-8xl">Portfolio</h2> <h2 class="font-bold text-4xl lg:text-8xl">Portfolio</h2>
<p class="lg:text-lg">A collection of some of my past and current projects and experiences</p> <p class="lg:text-lg">A collection of some of the projects and experiences I am most proud of</p>
</div> </div>
<div class="container px-5 my-5 lg:my-20 grid grid-cols-1 @2xl:grid-cols-2 @6xl:grid-cols-3 gap-5 justify-between"> <div class="container px-5 my-5 lg:my-20 grid grid-cols-1 @2xl:grid-cols-2 @6xl:grid-cols-3 gap-5 justify-between">

@ -15,14 +15,14 @@
</h3> </h3>
<div class="grid lg:grid-cols-5 gap-5"> <div class="grid lg:grid-cols-5 gap-5">
<div class="lg:col-span-3 flex flex-col gap-5"> <div class="lg:col-span-3 flex flex-col gap-5">
<div class="flex flex-wrap gap-2 bg-black bg-opacity-5 dark:bg-opacity-50 p-5"> <div class="flex flex-wrap gap-2 bg-black bg-opacity-5 dark:bg-opacity-40 p-5">
<p class="font-bold"> <p class="font-bold">
Hey there! I'm Pascal, but my internet name is Mid. Nice to have you here on my website. I'm a {calculateAge(new Date("2001-10-30"))} year old programmer and tech enthusiast from The Netherlands. Hey there! I'm Pascal, but my internet name is Mid. Nice to have you here on my website. I'm a {calculateAge(new Date("2001-10-30"))} year old programmer and tech enthusiast from The Netherlands.
If you wanna know a little more about me then here are some of the things I like to do. For my past experience and portfolio visit <a href="#portfolio" class="a">my portfolio section</a>. If you wanna know a little more about me then here are some of the things I like to do. For my past experience and portfolio visit <a href="#portfolio" class="a">my portfolio section</a>.
</p> </p>
</div> </div>
<div class="flex flex-col gap-5 relative text-sm p-5 border-black border-opacity-10 dark:border-opacity-60 border-4"> <div class="flex flex-col gap-5 relative text-sm p-5 border-black border-opacity-10 dark:border-opacity-20 border-4">
<span id="about-computers" class="absolute top-0 -mt-40"></span> <span id="about-computers" class="absolute top-0 -mt-40"></span>
<h4 class="text-lg font-bold">🖥 Computers</h4> <h4 class="text-lg font-bold">🖥 Computers</h4>
@ -37,7 +37,7 @@
<img src="/homepage/proxmox.png" alt="proxmox environment" /> <img src="/homepage/proxmox.png" alt="proxmox environment" />
</div> </div>
<div class="flex flex-col gap-5 relative text-sm p-5 border-black border-opacity-10 dark:border-opacity-60 border-4"> <div class="flex flex-col gap-5 relative text-sm p-5 border-black border-opacity-10 dark:border-opacity-20 border-4">
<span id="about-furry" class="absolute top-0 -mt-40"></span> <span id="about-furry" class="absolute top-0 -mt-40"></span>
<h4 class="text-lg font-bold">🦊 Furry</h4> <h4 class="text-lg font-bold">🦊 Furry</h4>
@ -55,7 +55,7 @@
</div> </div>
</div> </div>
<div class="flex flex-col gap-5 relative text-sm p-5 border-black border-opacity-10 dark:border-opacity-60 border-4"> <div class="flex flex-col gap-5 relative text-sm p-5 border-black border-opacity-10 dark:border-opacity-20 border-4">
<span id="about-drones" class="absolute top-0 -mt-40"></span> <span id="about-drones" class="absolute top-0 -mt-40"></span>
<h4 class="text-lg font-bold">🛩️ Drones</h4> <h4 class="text-lg font-bold">🛩️ Drones</h4>
@ -72,7 +72,7 @@
</div> </div>
<div class="lg:col-span-2 flex flex-col gap-5 overflow-x-hidden pt-10"> <div class="lg:col-span-2 flex flex-col gap-5 overflow-x-hidden pt-10">
<div class="flex flex-col gap-1 text-sm p-5 border-black border-opacity-20 dark:border-opacity-60 border-dashed border-4"> <div class="flex flex-col gap-1 text-sm p-5 border-black border-opacity-10 dark:border-opacity-20 border-dashed border-4">
<h4 class="-mt-12 lg:-mt-16 lg:text-lg bg-gray-200 dark:bg-gray-800 -mx-3 text-blue-500 overflow-x-hidden"> <h4 class="-mt-12 lg:-mt-16 lg:text-lg bg-gray-200 dark:bg-gray-800 -mx-3 text-blue-500 overflow-x-hidden">
<b>////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////</b><br/> <b>////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////</b><br/>
<b>//</b> user details<br/> <b>//</b> user details<br/>

@ -76,7 +76,7 @@
<img src="/homepage/vr/fancy.png" class="skew-x-3 object-cover @6xl:aspect-[1/1] w-full h-full" alt="couch" /> <img src="/homepage/vr/fancy.png" class="skew-x-3 object-cover @6xl:aspect-[1/1] w-full h-full" alt="couch" />
<div class="object-cover @6xl:aspect-[2/1] h-full w-full @6xl:col-span-2 flex flex-col gap-5 text-lg relative"> <div class="object-cover @6xl:aspect-[2/1] h-full w-full @6xl:col-span-2 flex flex-col gap-5 text-lg relative">
<div class="absolute inset-0 w-full h-full bg-white dark:bg-black skew-x-3"></div> <div class="absolute inset-0 w-full h-full dark:bg-black skew-x-3"></div>
<p class="absolute inset-0 w-full h-full lg:p-10"> <p class="absolute inset-0 w-full h-full lg:p-10">
VR is a world where anything is possible. A place where cities can be built with just a few button clicks. A place where friendships and communities are built on creativity and compassion. A place where anyone can be what they want to be without limitation. A place where freedom flourishes and humanity's light shines brighter than anywhere else. VR is a world where anything is possible. A place where cities can be built with just a few button clicks. A place where friendships and communities are built on creativity and compassion. A place where anyone can be what they want to be without limitation. A place where freedom flourishes and humanity's light shines brighter than anywhere else.
<br/><br/> <br/><br/>

@ -18,10 +18,9 @@
<Blog/> <Blog/>
</div> </div>
<img class="dark:hidden block scale-100" src="/homepage/topfadelight.svg" /> <div class="bg-gray-200 dark:bg-gray-800" style="height: 150px; overflow: hidden;"><svg viewBox="0 0 500 150" preserveAspectRatio="none" style="height: 100%; width: 100%;"><path d="M-65.62,-22.99 C146.87,168.99 238.74,166.00 589.37,-22.99 L543.74,181.99 L0.00,150.00 Z" style="stroke: none; fill: rgb(58, 83, 255);"></path></svg></div>
<img class="hidden dark:block scale-100" src="/homepage/topfadedark.svg" />
<div class="bg-[#3A53FF]"> <div class="bg-[#3A53FF] pt-20">
<Portfolio/> <Portfolio/>
</div> </div>

@ -1 +0,0 @@
<svg id="visual" viewBox="0 0 1000 200" width="1000" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"><path d="M0 13L83.3 13C166.7 13 333.3 13 500 13.3C666.7 13.7 833.3 14.3 916.7 14.7L1000 15L1000 0L916.7 0C833.3 0 666.7 0 500 0C333.3 0 166.7 0 83.3 0L0 0Z" fill="#3a53ff"></path><path d="M0 51L83.3 50.7C166.7 50.3 333.3 49.7 500 51.3C666.7 53 833.3 57 916.7 59L1000 61L1000 13L916.7 12.7C833.3 12.3 666.7 11.7 500 11.3C333.3 11 166.7 11 83.3 11L0 11Z" fill="#2950eb"></path><path d="M0 59L83.3 58.7C166.7 58.3 333.3 57.7 500 59.3C666.7 61 833.3 65 916.7 67L1000 69L1000 59L916.7 57C833.3 55 666.7 51 500 49.3C333.3 47.7 166.7 48.3 83.3 48.7L0 49Z" fill="#194bd7"></path><path d="M0 67L83.3 66.7C166.7 66.3 333.3 65.7 500 67C666.7 68.3 833.3 71.7 916.7 73.3L1000 75L1000 67L916.7 65C833.3 63 666.7 59 500 57.3C333.3 55.7 166.7 56.3 83.3 56.7L0 57Z" fill="#0847c2"></path><path d="M0 75L83.3 75C166.7 75 333.3 75 500 76.3C666.7 77.7 833.3 80.3 916.7 81.7L1000 83L1000 73L916.7 71.3C833.3 69.7 666.7 66.3 500 65C333.3 63.7 166.7 64.3 83.3 64.7L0 65Z" fill="#0042ae"></path><path d="M0 101L83.3 101C166.7 101 333.3 101 500 101.7C666.7 102.3 833.3 103.7 916.7 104.3L1000 105L1000 81L916.7 79.7C833.3 78.3 666.7 75.7 500 74.3C333.3 73 166.7 73 83.3 73L0 73Z" fill="#003d9a"></path><path d="M0 109L83.3 109C166.7 109 333.3 109 500 109.7C666.7 110.3 833.3 111.7 916.7 112.3L1000 113L1000 103L916.7 102.3C833.3 101.7 666.7 100.3 500 99.7C333.3 99 166.7 99 83.3 99L0 99Z" fill="#003786"></path><path d="M0 123L83.3 122.3C166.7 121.7 333.3 120.3 500 121C666.7 121.7 833.3 124.3 916.7 125.7L1000 127L1000 111L916.7 110.3C833.3 109.7 666.7 108.3 500 107.7C333.3 107 166.7 107 83.3 107L0 107Z" fill="#013172"></path><path d="M0 137L83.3 136C166.7 135 333.3 133 500 133.3C666.7 133.7 833.3 136.3 916.7 137.7L1000 139L1000 125L916.7 123.7C833.3 122.3 666.7 119.7 500 119C333.3 118.3 166.7 119.7 83.3 120.3L0 121Z" fill="#072b5f"></path><path d="M0 153L83.3 153C166.7 153 333.3 153 500 153.3C666.7 153.7 833.3 154.3 916.7 154.7L1000 155L1000 137L916.7 135.7C833.3 134.3 666.7 131.7 500 131.3C333.3 131 166.7 133 83.3 134L0 135Z" fill="#0d254c"></path><path d="M0 159L83.3 159C166.7 159 333.3 159 500 159.7C666.7 160.3 833.3 161.7 916.7 162.3L1000 163L1000 153L916.7 152.7C833.3 152.3 666.7 151.7 500 151.3C333.3 151 166.7 151 83.3 151L0 151Z" fill="#101e39"></path><path d="M0 201L83.3 201C166.7 201 333.3 201 500 201C666.7 201 833.3 201 916.7 201L1000 201L1000 161L916.7 160.3C833.3 159.7 666.7 158.3 500 157.7C333.3 157 166.7 157 83.3 157L0 157Z" fill="#111827"></path></svg>

Before

Width:  |  Height:  |  Size: 2.6 KiB

@ -1 +0,0 @@
<svg id="visual" viewBox="0 0 1000 200" width="1000" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"><path d="M0 13L83.3 13C166.7 13 333.3 13 500 13.3C666.7 13.7 833.3 14.3 916.7 14.7L1000 15L1000 0L916.7 0C833.3 0 666.7 0 500 0C333.3 0 166.7 0 83.3 0L0 0Z" fill="#3a53ff"></path><path d="M0 51L83.3 50.7C166.7 50.3 333.3 49.7 500 51.3C666.7 53 833.3 57 916.7 59L1000 61L1000 13L916.7 12.7C833.3 12.3 666.7 11.7 500 11.3C333.3 11 166.7 11 83.3 11L0 11Z" fill="#4465ff"></path><path d="M0 59L83.3 58.7C166.7 58.3 333.3 57.7 500 59.3C666.7 61 833.3 65 916.7 67L1000 69L1000 59L916.7 57C833.3 55 666.7 51 500 49.3C333.3 47.7 166.7 48.3 83.3 48.7L0 49Z" fill="#5275ff"></path><path d="M0 67L83.3 66.7C166.7 66.3 333.3 65.7 500 67C666.7 68.3 833.3 71.7 916.7 73.3L1000 75L1000 67L916.7 65C833.3 63 666.7 59 500 57.3C333.3 55.7 166.7 56.3 83.3 56.7L0 57Z" fill="#6084ff"></path><path d="M0 75L83.3 75C166.7 75 333.3 75 500 76.3C666.7 77.7 833.3 80.3 916.7 81.7L1000 83L1000 73L916.7 71.3C833.3 69.7 666.7 66.3 500 65C333.3 63.7 166.7 64.3 83.3 64.7L0 65Z" fill="#7093ff"></path><path d="M0 101L83.3 101C166.7 101 333.3 101 500 101.7C666.7 102.3 833.3 103.7 916.7 104.3L1000 105L1000 81L916.7 79.7C833.3 78.3 666.7 75.7 500 74.3C333.3 73 166.7 73 83.3 73L0 73Z" fill="#81a2ff"></path><path d="M0 109L83.3 109C166.7 109 333.3 109 500 109.7C666.7 110.3 833.3 111.7 916.7 112.3L1000 113L1000 103L916.7 102.3C833.3 101.7 666.7 100.3 500 99.7C333.3 99 166.7 99 83.3 99L0 99Z" fill="#93b0ff"></path><path d="M0 123L83.3 122.3C166.7 121.7 333.3 120.3 500 121C666.7 121.7 833.3 124.3 916.7 125.7L1000 127L1000 111L916.7 110.3C833.3 109.7 666.7 108.3 500 107.7C333.3 107 166.7 107 83.3 107L0 107Z" fill="#a5befe"></path><path d="M0 137L83.3 136C166.7 135 333.3 133 500 133.3C666.7 133.7 833.3 136.3 916.7 137.7L1000 139L1000 125L916.7 123.7C833.3 122.3 666.7 119.7 500 119C333.3 118.3 166.7 119.7 83.3 120.3L0 121Z" fill="#b8ccfc"></path><path d="M0 153L83.3 153C166.7 153 333.3 153 500 153.3C666.7 153.7 833.3 154.3 916.7 154.7L1000 155L1000 137L916.7 135.7C833.3 134.3 666.7 131.7 500 131.3C333.3 131 166.7 133 83.3 134L0 135Z" fill="#cbd9fb"></path><path d="M0 159L83.3 159C166.7 159 333.3 159 500 159.7C666.7 160.3 833.3 161.7 916.7 162.3L1000 163L1000 153L916.7 152.7C833.3 152.3 666.7 151.7 500 151.3C333.3 151 166.7 151 83.3 151L0 151Z" fill="#dfe7f8"></path><path d="M0 201L83.3 201C166.7 201 333.3 201 500 201C666.7 201 833.3 201 916.7 201L1000 201L1000 161L916.7 160.3C833.3 159.7 666.7 158.3 500 157.7C333.3 157 166.7 157 83.3 157L0 157Z" fill="#f3f4f6"></path></svg>

Before

Width:  |  Height:  |  Size: 2.6 KiB

@ -0,0 +1 @@
<svg id="visual" viewBox="0 0 1000 200" width="1000" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"><path d="M0 61L23.8 61C47.7 61 95.3 61 143 57.5C190.7 54 238.3 47 286 44.3C333.7 41.7 381.3 43.3 428.8 55.2C476.3 67 523.7 89 571.2 99.2C618.7 109.3 666.3 107.7 714 96C761.7 84.3 809.3 62.7 857 61.8C904.7 61 952.3 81 976.2 91L1000 101L1000 201L976.2 201C952.3 201 904.7 201 857 201C809.3 201 761.7 201 714 201C666.3 201 618.7 201 571.2 201C523.7 201 476.3 201 428.8 201C381.3 201 333.7 201 286 201C238.3 201 190.7 201 143 201C95.3 201 47.7 201 23.8 201L0 201Z" fill="#7d89ff"></path><path d="M0 105L23.8 102.8C47.7 100.7 95.3 96.3 143 95.7C190.7 95 238.3 98 286 99.3C333.7 100.7 381.3 100.3 428.8 96.2C476.3 92 523.7 84 571.2 77C618.7 70 666.3 64 714 65.8C761.7 67.7 809.3 77.3 857 81.8C904.7 86.3 952.3 85.7 976.2 85.3L1000 85L1000 201L976.2 201C952.3 201 904.7 201 857 201C809.3 201 761.7 201 714 201C666.3 201 618.7 201 571.2 201C523.7 201 476.3 201 428.8 201C381.3 201 333.7 201 286 201C238.3 201 190.7 201 143 201C95.3 201 47.7 201 23.8 201L0 201Z" fill="#6574ff"></path><path d="M0 124L23.8 126.3C47.7 128.7 95.3 133.3 143 134.8C190.7 136.3 238.3 134.7 286 135.2C333.7 135.7 381.3 138.3 428.8 130.3C476.3 122.3 523.7 103.7 571.2 103.3C618.7 103 666.3 121 714 125.3C761.7 129.7 809.3 120.3 857 110.3C904.7 100.3 952.3 89.7 976.2 84.3L1000 79L1000 201L976.2 201C952.3 201 904.7 201 857 201C809.3 201 761.7 201 714 201C666.3 201 618.7 201 571.2 201C523.7 201 476.3 201 428.8 201C381.3 201 333.7 201 286 201C238.3 201 190.7 201 143 201C95.3 201 47.7 201 23.8 201L0 201Z" fill="#4a5eff"></path><path d="M0 145L23.8 138.3C47.7 131.7 95.3 118.3 143 119.2C190.7 120 238.3 135 286 142.5C333.7 150 381.3 150 428.8 149.8C476.3 149.7 523.7 149.3 571.2 144C618.7 138.7 666.3 128.3 714 122.8C761.7 117.3 809.3 116.7 857 122.2C904.7 127.7 952.3 139.3 976.2 145.2L1000 151L1000 201L976.2 201C952.3 201 904.7 201 857 201C809.3 201 761.7 201 714 201C666.3 201 618.7 201 571.2 201C523.7 201 476.3 201 428.8 201C381.3 201 333.7 201 286 201C238.3 201 190.7 201 143 201C95.3 201 47.7 201 23.8 201L0 201Z" fill="#374df2"></path><path d="M0 135L23.8 140.7C47.7 146.3 95.3 157.7 143 159C190.7 160.3 238.3 151.7 286 146.2C333.7 140.7 381.3 138.3 428.8 142.5C476.3 146.7 523.7 157.3 571.2 161C618.7 164.7 666.3 161.3 714 157.8C761.7 154.3 809.3 150.7 857 147C904.7 143.3 952.3 139.7 976.2 137.8L1000 136L1000 201L976.2 201C952.3 201 904.7 201 857 201C809.3 201 761.7 201 714 201C666.3 201 618.7 201 571.2 201C523.7 201 476.3 201 428.8 201C381.3 201 333.7 201 286 201C238.3 201 190.7 201 143 201C95.3 201 47.7 201 23.8 201L0 201Z" fill="#3043d9"></path><path d="M0 182L23.8 182C47.7 182 95.3 182 143 180.2C190.7 178.3 238.3 174.7 286 171.5C333.7 168.3 381.3 165.7 428.8 165C476.3 164.3 523.7 165.7 571.2 166.8C618.7 168 666.3 169 714 171.8C761.7 174.7 809.3 179.3 857 177C904.7 174.7 952.3 165.3 976.2 160.7L1000 156L1000 201L976.2 201C952.3 201 904.7 201 857 201C809.3 201 761.7 201 714 201C666.3 201 618.7 201 571.2 201C523.7 201 476.3 201 428.8 201C381.3 201 333.7 201 286 201C238.3 201 190.7 201 143 201C95.3 201 47.7 201 23.8 201L0 201Z" fill="#2838c0"></path></svg>

After

Width:  |  Height:  |  Size: 3.1 KiB

@ -1 +0,0 @@
<svg id="visual" viewBox="0 0 1000 200" width="1000" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"><path d="M0 33L83.3 34.7C166.7 36.3 333.3 39.7 500 40C666.7 40.3 833.3 37.7 916.7 36.3L1000 35L1000 0L916.7 0C833.3 0 666.7 0 500 0C333.3 0 166.7 0 83.3 0L0 0Z" fill="#1f2937"></path><path d="M0 41L83.3 42.7C166.7 44.3 333.3 47.7 500 48C666.7 48.3 833.3 45.7 916.7 44.3L1000 43L1000 33L916.7 34.3C833.3 35.7 666.7 38.3 500 38C333.3 37.7 166.7 34.3 83.3 32.7L0 31Z" fill="#1b2f49"></path><path d="M0 53L83.3 54.3C166.7 55.7 333.3 58.3 500 59C666.7 59.7 833.3 58.3 916.7 57.7L1000 57L1000 41L916.7 42.3C833.3 43.7 666.7 46.3 500 46C333.3 45.7 166.7 42.3 83.3 40.7L0 39Z" fill="#15355b"></path><path d="M0 61L83.3 62C166.7 63 333.3 65 500 65.7C666.7 66.3 833.3 65.7 916.7 65.3L1000 65L1000 55L916.7 55.7C833.3 56.3 666.7 57.7 500 57C333.3 56.3 166.7 53.7 83.3 52.3L0 51Z" fill="#0c3a6e"></path><path d="M0 69L83.3 70C166.7 71 333.3 73 500 73.7C666.7 74.3 833.3 73.7 916.7 73.3L1000 73L1000 63L916.7 63.3C833.3 63.7 666.7 64.3 500 63.7C333.3 63 166.7 61 83.3 60L0 59Z" fill="#013f80"></path><path d="M0 97L83.3 97.3C166.7 97.7 333.3 98.3 500 98.3C666.7 98.3 833.3 97.7 916.7 97.3L1000 97L1000 71L916.7 71.3C833.3 71.7 666.7 72.3 500 71.7C333.3 71 166.7 69 83.3 68L0 67Z" fill="#004493"></path><path d="M0 105L83.3 105.3C166.7 105.7 333.3 106.3 500 106.3C666.7 106.3 833.3 105.7 916.7 105.3L1000 105L1000 95L916.7 95.3C833.3 95.7 666.7 96.3 500 96.3C333.3 96.3 166.7 95.7 83.3 95.3L0 95Z" fill="#0048a5"></path><path d="M0 119L83.3 119C166.7 119 333.3 119 500 119.7C666.7 120.3 833.3 121.7 916.7 122.3L1000 123L1000 103L916.7 103.3C833.3 103.7 666.7 104.3 500 104.3C333.3 104.3 166.7 103.7 83.3 103.3L0 103Z" fill="#004bb8"></path><path d="M0 131L83.3 131C166.7 131 333.3 131 500 131.3C666.7 131.7 833.3 132.3 916.7 132.7L1000 133L1000 121L916.7 120.3C833.3 119.7 666.7 118.3 500 117.7C333.3 117 166.7 117 83.3 117L0 117Z" fill="#004eca"></path><path d="M0 153L83.3 152.3C166.7 151.7 333.3 150.3 500 149.7C666.7 149 833.3 149 916.7 149L1000 149L1000 131L916.7 130.7C833.3 130.3 666.7 129.7 500 129.3C333.3 129 166.7 129 83.3 129L0 129Z" fill="#1051dc"></path><path d="M0 161L83.3 161C166.7 161 333.3 161 500 160.3C666.7 159.7 833.3 158.3 916.7 157.7L1000 157L1000 147L916.7 147C833.3 147 666.7 147 500 147.7C333.3 148.3 166.7 149.7 83.3 150.3L0 151Z" fill="#2652ee"></path><path d="M0 201L83.3 201C166.7 201 333.3 201 500 201C666.7 201 833.3 201 916.7 201L1000 201L1000 155L916.7 155.7C833.3 156.3 666.7 157.7 500 158.3C333.3 159 166.7 159 83.3 159L0 159Z" fill="#3a53ff"></path></svg>

Before

Width:  |  Height:  |  Size: 2.6 KiB

@ -1 +0,0 @@
<svg id="visual" viewBox="0 0 1000 200" width="1000" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1"><path d="M0 33L83.3 34.7C166.7 36.3 333.3 39.7 500 40C666.7 40.3 833.3 37.7 916.7 36.3L1000 35L1000 0L916.7 0C833.3 0 666.7 0 500 0C333.3 0 166.7 0 83.3 0L0 0Z" fill="#e5e7eb"></path><path d="M0 41L83.3 42.7C166.7 44.3 333.3 47.7 500 48C666.7 48.3 833.3 45.7 916.7 44.3L1000 43L1000 33L916.7 34.3C833.3 35.7 666.7 38.3 500 38C333.3 37.7 166.7 34.3 83.3 32.7L0 31Z" fill="#d2dbf0"></path><path d="M0 53L83.3 54.3C166.7 55.7 333.3 58.3 500 59C666.7 59.7 833.3 58.3 916.7 57.7L1000 57L1000 41L916.7 42.3C833.3 43.7 666.7 46.3 500 46C333.3 45.7 166.7 42.3 83.3 40.7L0 39Z" fill="#bfcff4"></path><path d="M0 61L83.3 62C166.7 63 333.3 65 500 65.7C666.7 66.3 833.3 65.7 916.7 65.3L1000 65L1000 55L916.7 55.7C833.3 56.3 666.7 57.7 500 57C333.3 56.3 166.7 53.7 83.3 52.3L0 51Z" fill="#adc3f8"></path><path d="M0 69L83.3 70C166.7 71 333.3 73 500 73.7C666.7 74.3 833.3 73.7 916.7 73.3L1000 73L1000 63L916.7 63.3C833.3 63.7 666.7 64.3 500 63.7C333.3 63 166.7 61 83.3 60L0 59Z" fill="#9cb6fb"></path><path d="M0 97L83.3 97.3C166.7 97.7 333.3 98.3 500 98.3C666.7 98.3 833.3 97.7 916.7 97.3L1000 97L1000 71L916.7 71.3C833.3 71.7 666.7 72.3 500 71.7C333.3 71 166.7 69 83.3 68L0 67Z" fill="#8baafe"></path><path d="M0 105L83.3 105.3C166.7 105.7 333.3 106.3 500 106.3C666.7 106.3 833.3 105.7 916.7 105.3L1000 105L1000 95L916.7 95.3C833.3 95.7 666.7 96.3 500 96.3C333.3 96.3 166.7 95.7 83.3 95.3L0 95Z" fill="#7b9cff"></path><path d="M0 119L83.3 119C166.7 119 333.3 119 500 119.7C666.7 120.3 833.3 121.7 916.7 122.3L1000 123L1000 103L916.7 103.3C833.3 103.7 666.7 104.3 500 104.3C333.3 104.3 166.7 103.7 83.3 103.3L0 103Z" fill="#6c8fff"></path><path d="M0 131L83.3 131C166.7 131 333.3 131 500 131.3C666.7 131.7 833.3 132.3 916.7 132.7L1000 133L1000 121L916.7 120.3C833.3 119.7 666.7 118.3 500 117.7C333.3 117 166.7 117 83.3 117L0 117Z" fill="#5d81ff"></path><path d="M0 153L83.3 152.3C166.7 151.7 333.3 150.3 500 149.7C666.7 149 833.3 149 916.7 149L1000 149L1000 131L916.7 130.7C833.3 130.3 666.7 129.7 500 129.3C333.3 129 166.7 129 83.3 129L0 129Z" fill="#5072ff"></path><path d="M0 161L83.3 161C166.7 161 333.3 161 500 160.3C666.7 159.7 833.3 158.3 916.7 157.7L1000 157L1000 147L916.7 147C833.3 147 666.7 147 500 147.7C333.3 148.3 166.7 149.7 83.3 150.3L0 151Z" fill="#4463ff"></path><path d="M0 201L83.3 201C166.7 201 333.3 201 500 201C666.7 201 833.3 201 916.7 201L1000 201L1000 155L916.7 155.7C833.3 156.3 666.7 157.7 500 158.3C333.3 159 166.7 159 83.3 159L0 159Z" fill="#3a53ff"></path></svg>

Before

Width:  |  Height:  |  Size: 2.6 KiB

@ -0,0 +1,2 @@
<?xml version="1.0" standalone="no"?>
<svg xmlns:xlink="http://www.w3.org/1999/xlink" id="wave" style="transform:rotate(0deg); transition: 0.3s" viewBox="0 0 1440 290" version="1.1" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient id="sw-gradient-0" x1="0" x2="0" y1="1" y2="0"><stop stop-color="rgba(58, 83, 255, 1)" offset="0%"/><stop stop-color="rgba(194.454, 202.137, 255, 1)" offset="100%"/></linearGradient></defs><path style="transform:translate(0, 0px); opacity:1" fill="url(#sw-gradient-0)" d="M0,145L40,149.8C80,155,160,164,240,159.5C320,155,400,135,480,149.8C560,164,640,213,720,236.8C800,261,880,261,960,232C1040,203,1120,145,1200,125.7C1280,106,1360,126,1440,125.7C1520,126,1600,106,1680,116C1760,126,1840,164,1920,154.7C2000,145,2080,87,2160,96.7C2240,106,2320,184,2400,203C2480,222,2560,184,2640,145C2720,106,2800,68,2880,48.3C2960,29,3040,29,3120,62.8C3200,97,3280,164,3360,193.3C3440,222,3520,213,3600,217.5C3680,222,3760,242,3840,212.7C3920,184,4000,106,4080,101.5C4160,97,4240,164,4320,183.7C4400,203,4480,174,4560,159.5C4640,145,4720,145,4800,135.3C4880,126,4960,106,5040,106.3C5120,106,5200,126,5280,111.2C5360,97,5440,48,5520,67.7C5600,87,5680,174,5720,217.5L5760,261L5760,290L5720,290C5680,290,5600,290,5520,290C5440,290,5360,290,5280,290C5200,290,5120,290,5040,290C4960,290,4880,290,4800,290C4720,290,4640,290,4560,290C4480,290,4400,290,4320,290C4240,290,4160,290,4080,290C4000,290,3920,290,3840,290C3760,290,3680,290,3600,290C3520,290,3440,290,3360,290C3280,290,3200,290,3120,290C3040,290,2960,290,2880,290C2800,290,2720,290,2640,290C2560,290,2480,290,2400,290C2320,290,2240,290,2160,290C2080,290,2000,290,1920,290C1840,290,1760,290,1680,290C1600,290,1520,290,1440,290C1360,290,1280,290,1200,290C1120,290,1040,290,960,290C880,290,800,290,720,290C640,290,560,290,480,290C400,290,320,290,240,290C160,290,80,290,40,290L0,290Z"/><defs><linearGradient id="sw-gradient-1" x1="0" x2="0" y1="1" y2="0"><stop stop-color="rgba(58, 83, 255, 1)" offset="0%"/><stop stop-color="rgba(191.574, 199.623, 255, 1)" offset="100%"/></linearGradient></defs><path style="transform:translate(0, 50px); opacity:0.9" fill="url(#sw-gradient-1)" d="M0,0L40,19.3C80,39,160,77,240,106.3C320,135,400,155,480,145C560,135,640,97,720,87C800,77,880,97,960,116C1040,135,1120,155,1200,164.3C1280,174,1360,174,1440,169.2C1520,164,1600,155,1680,159.5C1760,164,1840,184,1920,183.7C2000,184,2080,164,2160,169.2C2240,174,2320,203,2400,207.8C2480,213,2560,193,2640,183.7C2720,174,2800,174,2880,178.8C2960,184,3040,193,3120,193.3C3200,193,3280,184,3360,193.3C3440,203,3520,232,3600,203C3680,174,3760,87,3840,43.5C3920,0,4000,0,4080,9.7C4160,19,4240,39,4320,77.3C4400,116,4480,174,4560,203C4640,232,4720,232,4800,193.3C4880,155,4960,77,5040,38.7C5120,0,5200,0,5280,43.5C5360,87,5440,174,5520,203C5600,232,5680,203,5720,188.5L5760,174L5760,290L5720,290C5680,290,5600,290,5520,290C5440,290,5360,290,5280,290C5200,290,5120,290,5040,290C4960,290,4880,290,4800,290C4720,290,4640,290,4560,290C4480,290,4400,290,4320,290C4240,290,4160,290,4080,290C4000,290,3920,290,3840,290C3760,290,3680,290,3600,290C3520,290,3440,290,3360,290C3280,290,3200,290,3120,290C3040,290,2960,290,2880,290C2800,290,2720,290,2640,290C2560,290,2480,290,2400,290C2320,290,2240,290,2160,290C2080,290,2000,290,1920,290C1840,290,1760,290,1680,290C1600,290,1520,290,1440,290C1360,290,1280,290,1200,290C1120,290,1040,290,960,290C880,290,800,290,720,290C640,290,560,290,480,290C400,290,320,290,240,290C160,290,80,290,40,290L0,290Z"/></svg>

After

Width:  |  Height:  |  Size: 3.4 KiB

Loading…
Cancel
Save