[75] Cloudy Nav

[lina_trinch]

Link Link Link Link Link

CODE

Code:
<div style="margin: auto; width: 500px; display: flex; align-items: center;"> <div style="background: center/cover url('https://i.ibb.co/MkCDmrt2/starfall-night-sky-mountains-aesthetic-gif-preview-desktop-wallpaper.gif'), #ddd; width: 400px; height: 400px; display: grid; grid-template-columns: repeat(5, 1fr); grid-template-rows: repeat(5, 1fr); border: 20px solid #fff; border-right: none; border-left: none; margin-right: 10px;"> <div style="grid-area: 1 / 1 / 2 / 2; background: linear-gradient(180deg, #fff, #eee);"></div> <div style="grid-area: 1 / 2 / 2 / 3; background: linear-gradient(180deg, #fff, #eee);"></div> <div style="grid-area: 1 / 3 / 2 / 4; border-radius: 0 0 100% 0; background: linear-gradient(180deg, #fff, #eee);"></div> <div style="grid-area: 2 / 1 / 3 / 2; border-radius: 0 0 100% 0; background: linear-gradient(180deg, #eee, #ddd);"></div> <div style="grid-area: 5 / 2 / 6 / 3; border-radius: 100% 0 0 0; background: linear-gradient(0deg, #fff, #eee);"></div> <div style="grid-area: 5 / 3 / 6 / 4; background: linear-gradient(0deg, #fff, #eee);"></div> <div style="grid-area: 5 / 4 / 6 / 5; background: linear-gradient(0deg, #fff, #eee);"></div> <div style="grid-area: 5 / 5 / 6 / 6; background: linear-gradient(0deg, #fff, #eee);"></div> <div style="grid-area: 4 / 4 / 5 / 5; border-radius: 100% 0 0 0; background: linear-gradient(0deg, #eee, #ddd);"></div> <div style="grid-area: 4 / 5 / 5 / 6; background: linear-gradient(0deg, #eee, #ddd);"></div> </div> <div style="font-family: monospace; width: 100px;"> <a href="URL" style="display: block; text-decoration: none; color: #000; background: #fff; width: 100%; padding: 2px; margin: 2px 0;"> Link </a> <a href="URL" style="display: block; text-decoration: none; color: #000; background: #fff; width: 100%; padding: 2px; margin: 2px 0;"> Link </a> <a href="URL" style="display: block; text-decoration: none; color: #000; background: #fff; width: 100%; padding: 2px; margin: 2px 0;"> Link </a> <a href="URL" style="display: block; text-decoration: none; color: #000; background: #fff; width: 100%; padding: 2px; margin: 2px 0;"> Link </a> <a href="URL" style="display: block; text-decoration: none; color: #000; background: #fff; width: 100%; padding: 2px; margin: 2px 0;"> Link </a> </div> </div> <div style="width: 500px; text-align: center; margin: 10px auto; font-size: 8px; font-family: monospace; font-weight: bold; letter-spacing: 2px;"> <a href="https://killthecake.dreamwidth.org/" style="color: #000; text-decoration: none;"> CODE </a> </div>

❖ These codes were released early on the Patreon! Feel free to check out things over there if you want early codes or some exclusive content. ❖ Make sure Disable Auto-Formatting is checked when you copy/paste the code into your post. ❖ The clouds are part of the code! You can change the background to anything you like, though. I left the image in this time, too. Ctrl+F & Replace: ❖ URL - URL placeholder. ❖ Link - For your link text. ❖ ibb - The image/GIF placeholder. #ddd Placeholder for the image and some shadows on the clouds #eee Shadows on the clouds #fff Clouds, borders, and link backgrounds #000 Links