ooh, does it work for you? 
3 Likes
I can see it normally, something like this:
Or this: (probably cause I’m on my tablet and can rotate the screen)
2 Likes
are you on mobile? and thank you!
edit: yup, it looks the way it should for the most part xD thanks again! 
3 Likes
no problem, glad I could help!
3 Likes
omg that’s pretty much perfect, i didn’t know you could drag it like that?? i would love to have the code for that!! tysm for fixing it :’’)
3 Likes
Yayy! 
added a bit of code to do that xD
I’ll PM it to you in a moment
My pleasure! 
4 Likes
sorry to bother you but could I also see the code? 
2 Likes
Thank you!! 
2 Likes
Click on the pause button 
A Music Playlist
1:11 ━━|━━━━━━━━━ 5:37⇆ ◁ ❚❚ ▷ ↺
now playing: Morceaux de Salon, Romance, Op. 6 No. 1 – Rachmaninoff Queue: ≡ Taxidermy of deer human – Feryquitous
≡ The Letter (ft. Katali) – Sakuzyo
≡ Élégie in E Flat Minor, Op. 3 No. 1 – Rachmaninoff
≡ Waltz in A Minor, Op. Posthumous – Chopin
≡ Platinum – Sta
≡ Nocturne in E Flat Major, Op. 9 No. 2 – Chopin
≡ Prelude in E Minor, Op. 28 No. 4 – Chopin
≡ Gymnopédie No. 1 – Satie
≡ Vindicta – Jesse Bullard
⭐︎ ✧ coded by stella_vigo ✧ ⭐︎
Oh, and the songs in the scroll box on the right are also links.
raw code
<span style="font-size:; display: block; font-family: Times New Roman; margin: auto; padding: 20px; background-color: black; color: white;">
<div align="center">
<span style="font-size: 5vmin; display: block; margin: auto; letter-spacing: 8px;">A Music Playlist</span>
</div>
<span style="font-size:; display: flex; width: 100%; margin-top: 3vmin; text-align: center;">
<span style="font-size: display: inline-block; font-family: Garamond; border: 3px transparent; width: 44%; height: 35vmin; background-image: url('https://external-content.duckduckgo.com/iu/?u=http%3A%2F%2Fdirect.rhapsody.com%2Fimageserver%2Fimages%2FAlb.46314971%2F500x500.jpg&f=1&nofb=1'); background-repeat: no-repeat; background-size: 25vmin; background-position: top; margin: auto; margin-left: 4%; margin-right: 4%; line-height: 1.2">
<span style="font-size: 1vmin; display: block; position: relative; bottom: -27vmin;">
1:11 ━━|━━━━━━━━━ 5:37<br><br>
⇆ ◁ <a href="https://youtu.be/eTwtKCBX6KQ?t=71"><font color=#ffffff>❚❚</font></a> ▷ ↺<br><br>
<span style="font-size:; display: block; font-family: Garamond; margin: auto; letter-spacing: 1px; padding-left: 2vmin; padding-right: 2.2vmin; line-height: 1.5">now playing: Morceaux de Salon, Romance, Op. 6 No. 1 – Rachmaninoff</span>
</span></span>
<span style="font-size:; display: inline-block; font-family: Garamond; width: 44%; height: 35vmin; margin: auto; margin-left: 4%; margin-right: 4%; text-align: left;"><span style="font-size: 3vmin; display: block; font-family: Garamond; letter-spacing: 1.2px; margin: auto;">Queue:</span>
<span style="font-size: 1.8vmin; display: block; letter-spacing: 0.8px; height: 29vmin; overflow-y: scroll; padding-left: 1vmin; padding-right: 0.5vmin; line-height: 1.5; position: relative; bottom: -1vmin; padding-bottom: 0.5vmin;">
≡ <a href="https://youtu.be/ERORPASus-Y"><font color=#ffffff>Taxidermy of deer human – Feryquitous</font></a><br>
≡ <a href="https://youtu.be/qrkCW7GZhlo"><font color=#ffffff>The Letter (ft. Katali) – Sakuzyo</font></a><br>
≡ <a href="https://youtu.be/Dd5HZfeZsmM"><font color=#ffffff>Élégie in E Flat Minor, Op. 3 No. 1 – Rachmaninoff</font></a><br>
≡ <a href="https://youtu.be/Wp2xI1Pr4nQ"><font color=#ffffff>Waltz in A Minor, Op. Posthumous – Chopin</font></a><br>
≡ <a href="https://youtu.be/1at2PhFVwRM"><font color=#ffffff>Platinum – Sta</font></a><br>
≡ <a href="https://youtu.be/Mg-LX6K6W5o"><font color=#ffffff>Nocturne in E Flat Major, Op. 9 No. 2 – Chopin</font></a><br>
≡ <a href="https://youtu.be/x5r-YMOBRBM"><font color=#ffffff>Prelude in E Minor, Op. 28 No. 4 – Chopin</font></a><br>
≡ <a href="https://youtu.be/eMnxjdGTK4w"><font color=#ffffff>Gymnopédie No. 1 – Satie</font></a><br>
≡ <a href="https://youtu.be/oX4eXbNnTSo"><font color=#ffffff>Vindicta – Jesse Bullard</font></a><br>
</span></span></span><br>
<span style="font-size: 1vmin; font-family: Garamond; display: block; margin: auto; text-align: center; color: #e08080; letter-spacing: 1.2px;">⭐︎ ✧ coded by stella_vigo ✧ ⭐︎</span></span>
EDIT: Trying to make it more mobile friendly 
EDIT 2: It’s more mobile friendly now. I just changed the heights to vmin instead of vh
For reference, this is how it looks like on my phone:
5 Likes
It is!
3 Likes
So the “music player” I coded yesterday doesn’t look that good on mobile compared to on my laptop, so I coded a different one that’s more mobile friendly 
thoughts? The song titles are links btw.
⭐︎ ✧ coded by stella_vigo ✧ ⭐︎
raw code
<div data-theme-slick="1">
<span style="font-size: 20px; display: block; font-family: Arial; height: 500px; overflow: hidden; background-color: black; color: white;"><span style="font-size: 20px; display: block; position: relative; margin-top: 0px; pointer-events: none;">
<details class="elided" open>
<summary>
<span style="font-size: 20px; display: block; position: absolute; bottom: -472px; left: 0; width: 100px; height: 50px; line-height: 50px; pointer-events: auto;">◁◁</span><span style="font-size: 20px; display: block; position: absolute; bottom: 25px; right: 50px; pointer-events: auto; line-height: 50px;">▷▷</span></summary><span style="font-size: 50px; font-family: Arial; display: flex; height: 500px;"><span style="font-size: 30px; display: block; margin: auto; margin-top: 50px; background-image: url('https://lh3.googleusercontent.com/l_ZuuFJ3LWzRX5pc8HLVotMSpjEuLmLeUbRitrhVOjfrUOCytbWJUEZo39k6qVQN88iu8QhxYDEXsJ0=w544-h544-l90-rj'); background-repeat: no-repeat; background-size: 150px 150px; background-position: top; height: 500px; width: 300px; text-align: center;">
<span style="font-size: 8px; display: block; position: relative; bottom: -175px; width: 100%; letter-spacing: 1.2px;">now playing:</span>
<span style="font-size: 14px; display: block; position: relative; bottom: -200px; width: 100%; letter-spacing: 1.4px; font-weight: bold; pointer-events: auto;"><a href="https://youtu.be/fA3jFMDBiu4?t=59"><font color=white>Kashmir – Marcin</font></a></span>
<span style="font-size: 10px; display: block; position: relative; bottom: -225px; width: 100%"> 0:59 —————|—————————— 2:58</span>
<span style="font-size: 10px; display: block; position: relative; bottom: -250px; width: 100%"> ⇆ ◁ ❚❚ ▷ ↺ </span>
<span style="font-size: 10px; display: block; position: relative; bottom: -275px; width: 100%"> v o l u m e : ——————————〇——— </span></span></details></span>
<span style="font-size: 20px; display: block; position: relative; margin-top: -2px; pointer-events: none;">
<details class="elided" open>
<summary><span style="font-size: 20px; display: block; position: absolute; bottom: -472px; left: 0; width: 100px; height: 50px; line-height: 50px; pointer-events: auto;">◁◁</span><span style="font-size: 20px; display: block; position: absolute; bottom: 25px; right: 50px; pointer-events: auto; line-height: 50px;">▷▷</span></summary>
<span style="font-size: 50px; font-family: Arial; display: flex; height: 500px;"><span style="font-size: 30px; display: block; margin: auto; margin-top: 50px; background-image: url('https://i.scdn.co/image/ab67616d0000b273484d121f0e2d2caf87d5d10b'); background-repeat: no-repeat; background-size: 150px 150px; background-position: top; height: 500px; width: 300px; text-align: center;">
<span style="font-size: 8px; display: block; position: relative; bottom: -175px; width: 100%; letter-spacing: 1.2px;">now playing:</span>
<span style="font-size: 14px; display: block; position: relative; bottom: -200px; width: 100%; letter-spacing: 1.4px; font-weight: bold; pointer-events: auto;"><a href="https://youtu.be/pfEZW-1eDl8"><font color=white>Airplanes (feat. Hayley Williams) – B.o.B</font></a></span>
<span style="font-size: 10px; display: block; position: relative; bottom: -225px; width: 100%"> 0:00 |——————————————— 3:00</span>
<span style="font-size: 10px; display: block; position: relative; bottom: -250px; width: 100%"> ⇆ ◁ ❚❚ ▷ ↺ </span>
<span style="font-size: 10px; display: block; position: relative; bottom: -275px; width: 100%"> v o l u m e : ——————————〇——— </span></span></details></span>
<span style="font-size: 20px; display: block; position: relative; margin-top: -2px; pointer-events: none;">
<details class="elided" open>
<summary><span style="font-size: 20px; display: block; position: absolute; bottom: -472px; left: 0; width: 100px; height: 50px; line-height: 50px; pointer-events: auto;">◁◁</span><span style="font-size: 20px; display: block; position: absolute; bottom: 25px; right: 50px; pointer-events: auto; line-height: 50px">▷▷</span></summary>
<span style="font-size: 50px; font-family: Arial; display: flex; height: 500px;"><span style="font-size: 30px; display: block; margin: auto; margin-top: 50px; background-image: url('https://i.scdn.co/image/ab67616d0000b273241e4fe75732c9c4b49b94c3'); background-repeat: no-repeat; background-size: 150px 150px; background-position: top; height: 500px; width: 300px; text-align: center;">
<span style="font-size: 8px; display: block; position: relative; bottom: -175px; width: 100%; letter-spacing: 1.2px;">now playing:</span>
<span style="font-size: 14px; display: block; position: relative; bottom: -200px; width: 100%; letter-spacing: 1.4px; font-weight: bold; pointer-events: auto;"><a href="https://youtu.be/AGDlC3VDVCc"><font color=white>History – One Direction</font></a></span>
<span style="font-size: 10px; display: block; position: relative; bottom: -225px; width: 100%"> 0:00 |——————————————— 3:08</span>
<span style="font-size: 10px; display: block; position: relative; bottom: -250px; width: 100%"> ⇆ ◁ ❚❚ ▷ ↺ </span>
<span style="font-size: 10px; display: block; position: relative; bottom: -275px; width: 100%"> v o l u m e : ——————————〇——— </span></span></details></span>
<span style="font-size: 20px; display: block; position: relative; margin-top: -2px; pointer-events: none;">
<details class="elided" open>
<summary><span style="font-size: 20px; display: block; position: absolute; bottom: -472px; left: 0; width: 100px; height: 50px; line-height: 50px; pointer-events: auto;">◁◁</span><span style="font-size: 20px; display: block; position: absolute; bottom: 25px; right: 50px; pointer-events: auto; line-height: 50px;">▷▷</span></summary>
<span style="font-size: 50px; font-family: Arial; display: flex; height: 500px;"><span style="font-size: 30px; display: block; margin: auto; margin-top: 50px; background-image: url('https://i1.sndcdn.com/artworks-36zI8jgvDaTbHsIh-t4IkMg-t500x500.jpg'); background-repeat: no-repeat; background-size: 150px 150px; background-position: top; height: 500px; width: 300px; text-align: center;">
<span style="font-size: 8px; display: block; position: relative; bottom: -175px; width: 100%; letter-spacing: 1.2px;">now playing:</span>
<span style="font-size: 14px; display: block; position: relative; bottom: -200px; width: 100%; letter-spacing: 1.4px; font-weight: bold; pointer-events: auto;"><a href="https://youtu.be/d4n0WLUUlOI"><font color=white>Detour – 20syl</font></a></span>
<span style="font-size: 10px; display: block; position: relative; bottom: -225px; width: 100%"> 0:00 |——————————————— 0:59</span>
<span style="font-size: 10px; display: block; position: relative; bottom: -250px; width: 100%"> ⇆ ◁ ❚❚ ▷ ↺ </span>
<span style="font-size: 10px; display: block; position: relative; bottom: -275px; width: 100%"> v o l u m e : ——————————〇——— </span></span></details></span>
<span style="font-size: 20px; display: block; position: relative; margin-top: -2px; pointer-events: none;">
<details class="elided" open>
<summary><span style="font-size: 20px; display: block; position: absolute; bottom: -472px; left: 0; width: 100px; height: 50px; line-height: 50px; pointer-events: auto;">◁◁</span><span style="font-size: 20px; display: block; position: absolute; bottom: 25px; right: 50px; pointer-events: auto; line-height: 50px;">▷▷</span></summary><span style="font-size: 50px; font-family: Arial; display: flex; height: 500px;"><span style="font-size: 30px; display: block; margin: auto; margin-top: 50px; background-image: url('https://i.scdn.co/image/ab67616d0000b273785d4e702802da500fc78b32'); background-repeat: no-repeat; background-size: 150px 150px; background-position: top; height: 500px; width: 300px; text-align: center;">
<span style="font-size: 8px; display: block; position: relative; bottom: -175px; width: 100%; letter-spacing: 1.2px;">now playing:</span>
<span style="font-size: 14px; display: block; position: relative; bottom: -200px; width: 100%; letter-spacing: 1.4px; font-weight: bold; pointer-events: auto;"><a href="https://youtu.be/KWLGyeg74es"><font color=white>Fireflies – Owl City</font></a></span>
<span style="font-size: 10px; display: block; position: relative; bottom: -225px; width: 100%"> 0:00 |——————————————— 3:48</span>
<span style="font-size: 10px; display: block; position: relative; bottom: -250px; width: 100%"> ⇆ ◁ ❚❚ ▷ ↺ </span>
<span style="font-size: 10px; display: block; position: relative; bottom: -275px; width: 100%"> v o l u m e : ——————————〇——— </span></span></details></span>
<span style="font-size: 50px; font-family: Arial; display: flex; height: 500px;"><span style="font-size: 30px; display: block; margin: auto; margin-top: 50px; background-image: url('https://lh3.googleusercontent.com/Di7n2iVRo24KVbiz9u6NInDPPJEFREEjADdrFJ_hf2IMtHIBcekW6F9WKm3EG6HGAoNywJYpc0A4cpQy=w544-h544-l90-rj'); background-repeat: no-repeat; background-size: 150px 150px; background-position: top; height: 500px; width: 300px; text-align: center;">
<span style="font-size: 8px; display: block; position: relative; bottom: -175px; width: 100%; letter-spacing: 1.2px;">now playing:</span>
<span style="font-size: 14px; display: block; position: relative; bottom: -200px; width: 100%; letter-spacing: 1.4px; font-weight: bold; pointer-events: auto;"><a href="https://youtu.be/VHEKvMj04Qk"><font color=white>Chopin Nocturne – Marcin</font></a></span>
<span style="font-size: 10px; display: block; position: relative; bottom: -225px; width: 100%"> 0:00 |——————————————— 4:40</span>
<span style="font-size: 10px; display: block; position: relative; bottom: -250px; width: 100%"> ⇆ ◁ ❚❚ ▷ ↺ </span>
<span style="font-size: 10px; display: block; position: relative; bottom: -275px; width: 100%"> v o l u m e : ——————————〇——— </span></span></details>
</div>
<br>
<span style="font-size: 12px; font-family: Garamond; display: block; margin: auto; text-align: center; color: #e08080; letter-spacing: 1.2px;">`⭐︎` ✧ coded by stella_vigo ✧ `⭐︎`</span>
EDIT: Also, how do you make links work? <a href="link"></a> doesn’t work on the first to second-to-last slides for some reason.
EDIT 2: Since I can’t get links to work in a slideshow, I’ve coded something new. All the song names are links btw.
≡ Say Something – A Great Big World
≡ My Funny Valentine – Chet Baker
≡ Abandoned – Sakuzyo
≡ Giant Steps – John Coltrane
≡ Waltz in A Flat Major, Op. 69 No. 1 – Chopin
≡ Six Morceaux, Scherzo, Op. 11 No. 2 – Rachmaninoff
≡ Nocturne in E Flat Major, Op. 9 No. 2 – Chopin
⭐︎ ✧ coded by stella_vigo ✧ ⭐︎
≡ My Funny Valentine – Chet Baker
≡ Abandoned – Sakuzyo
≡ Giant Steps – John Coltrane
≡ Waltz in A Flat Major, Op. 69 No. 1 – Chopin
≡ Six Morceaux, Scherzo, Op. 11 No. 2 – Rachmaninoff
≡ Nocturne in E Flat Major, Op. 9 No. 2 – Chopin
more raw code
<span style="font-size:; display: block; font-family: Tahoma; background-image: linear-gradient(to bottom right, black, #1f1f1f, #101010, #0f0f0f, #0a0a0a, #090909, black); width: 250px; margin: auto; padding: 10px; color: white;">
<div align="center">
<span style="font-size:; display: block; background-image: url('https://i.scdn.co/image/ab67616d0000b273df63d8d198ca0ab4d3d2ecdd'); background-repeat: no-repeat; background-size: 175px 175px; background-position: center; margin: auto; margin-top: 20px; width: 180px; height: 180px;"></span>
<span style="font-size: 10px; display: block; letter-spacing: 1.2px; margin: auto; margin-top: 20px">now playing</span>
<span style="font-size: 15px; display: block; letter-spacing: 1px; margin: auto; margin-top: 20px;"><a href="https://youtu.be/3CmkVQ4Tx2U?t=31"><font color="white">Kaitul – Feryquitous</font></a></span>
<span style="font-size: 10px; display: block; margin: auto; margin-top: 20px;"> 0:31 ——|————————————— 3:49</span>
<span style="font-size: 10px; display: block; margin: auto; margin-top: 12px;"> ⇆ ◁ ❚❚ ▷ ↺ </span>
<span style="font-size: 10px; display: block; margin: auto; margin-top: 12px;"> v o l u m e : ——————————〇——— </span>
</div>
<div align="left">
<span style="font-size: 12px; display: block; width: 175px; height: 100px; margin: auto; margin-top: 22px; overflow-y: scroll; letter-spacing: 1.2px; padding: 5px;">
≡ <a href="https://youtu.be/KHIMIa5Lzxk"><font color="white">Say Something – A Great Big World</font></a><br>
≡ <a href="https://youtu.be/ni9Cp9mOOOg"><font color="white">My Funny Valentine – Chet Baker</font></a><br>
≡ <a href="https://youtu.be/HUecHbneUsI"><font color="white">Abandoned – Sakuzyo</font></a><br>
≡ <a href="https://youtu.be/g8QnKWPYRCs"><font color="white">Giant Steps – John Coltrane</font></a><br>
≡ <a href="https://youtu.be/b5fcXlbyn60"><font color="white">Waltz in A Flat Major, Op. 69 No. 1 – Chopin</font></a><br>
≡ <a href="https://youtu.be/-IAhEXIYJWA"><font color="white">Six Morceaux, Scherzo, Op. 11 No. 2 – Rachmaninoff</font></a><br>
≡ <a href="https://youtu.be/Mg-LX6K6W5o"><font color="white">Nocturne in E Flat Major, Op. 9 No. 2 – Chopin</font></a><br>
</span>
</div>
<span style="font-size: 8px; font-family: Garamond; display: block; margin: auto; text-align: center; color: #e08080; letter-spacing: 1.2px; margin-top: 18px; margin-bottom: 15px;">⭐︎ ✧ coded by stella_vigo ✧ ⭐︎</span>
</span>
EDIT 3: Thank you @/SockMonster1 and @/zeroinfinyx for helping me understand why the links weren’t working in the slideshow! They work now
3 Likes
@wednesday here’s an excerpt (more like a prophecy) from Flight of Kestrel 
As evil shall fall
Stand up high
And listen all
Peace is necessary,
As is sight
With one of fire
And one of flight
Of varied pasts
And varied times
Through large distances;
Magik and mortal entwined
‘Tis a game,
A cruel twisted trick
Fate will only take
One single pick
Chaos rising,
Pending death
For a spider is patient
As it spins it’s net
Never stop —
Raising storms
A blood-red dish,
A crimson mourn
Watch for secrets,
Watch for show
No one knows
Their hidden foe
When different stories
All merge together
Who really is
The one true successor?
A war will come
When they must join together
If discarded, the world will fall
Into ash and darkness, forever
raw code
<span style="font-size:; display: block; position: relative; width: 100%; max-width: 100vh;">
<span style="font-size:; display: block; padding-bottom: 50%;"></span>
<span style="font-size:; display: block; width: 80%; height: 75%; background: #406A53; position: absolute; top: 6%; left: 5%; margin-right: 5%; box-shadow: 8px 10px 13px -5px #284A37;"></span>
<span style="font-size:; display: block; width: 45%; height: 47%; background: linear-gradient(to right, #548F6F 0%, #629B7C 100%); position: absolute; top: 10%; left: 32%; padding: 5%; box-shadow: 8px 10px 15px -5px #284A37; overflow-y: scroll;">
<span style="font-size: 33px; letter-spacing: 2px; margin: auto; letter-spacing: 2px; line-height: 1.5; text-align: left; text-transform: none; font-family: tangerine; color: black; text-shadow: 2px 2px #4E7C6C; color: #275243;"> The War Prophecy </span>
<span style="font-size:; display: block; width: 100%; border-top: 1px solid #406A53; margin: 3.5% 0%;"> </span>
<span style="font-size: 10px; text-transform: none; letter-spacing: 1.5px; text-align: left; text-shadow: none; line-height: 15px; font-family: papyrus; color: #275243;"> Four may rise, <br> As evil shall fall <br> Stand up high <br> And listen all <br><br> Peace is necessary, <br> As is sight <br> With one of fire <br> And one of flight <br><br> Of varied pasts <br> And varied times <br> Through large distances; <br> Magik and mortal entwined <br><br> ‘Tis a game, <br> A cruel twisted trick <br> Fate will only take <br> One single pick <br><br> Chaos rising, <br> Pending death <br> For a spider is patient <br> As it spins it’s net <br><br> Never stop — <br> Raising storms <br> A blood-red dish, <br> A crimson mourn <br><br> Watch for secrets, <br> Watch for show <br> No one knows <br> Their hidden foe <br><br> When different stories <br> All merge together <br> Who really is <br> The one true successor? <br><br> A war will come <br> When they must join together <br> If discarded, the world will fall <br> Into ash and darkness, forever
</span>
</span>
<span style="font-size:; display: block; width: 32%; height: 83%; background: url(https://i.pinimg.com/236x/05/b3/16/05b316adc4cdaa5d53d008541898eacb.jpg) center; background-size: fill; position: absolute; top: 0; left: 2%; box-shadow: 8px 10px 15px -5px #284A37;">
</span>
</span>
3 Likes
all your codes are so pretty 
OOOO I LIKE ITTTTT I CANT WAIT JHLUGKJ :OOOO
2 Likes
Aw, thank you! I’ll be able to rewrite and edit it before September (that is, if I’m productive though 
)
2 Likes
Of course! Good luck!! 
2 Likes
god bless u wtf…
2 Likes
Set the pointer events to auto for the link containers.
3 Likes
So sorry that I haven’t gotten the activities out! Summer has been busy and I finally got a new laptop, so I’ll hopefully get to code more! I’ll try to get out the next activity as soon as possible, no promises though >.<
4 Likes
This took me quite a while. I spent hours on this trying to make it mobile-friendly, dark-mode-friendly, and light-mode-friendly Do you have any tips on making aesthetic 
code? I’ve been trying to make this pretty but I’m not sure if it even looks decent, I’m not as good at making aesthetic things as other people here 
⭐︎ ✧ starry sky ✧ ⭐︎
▼ scroll down to see more ▼
Hello and welcome to starry sky, a graphics thread where I offer custom covers and code for free! I can make simple covers, vector covers, manip covers, coded threads, and coded playlists, among others. Please note that I'm still a beginner in coding and I only use free tools and resources—such as Canva, Photoscape X, and Pixabay—so I apologize in advance if I don't meet your expectations, hehe.
I'm mostly doing this out of fun, so request away! I like making graphics for other people :D
rules... ✭ Be nice and abide by the Code of Conduct.
✭ Giving credit is a must. If you're using my cover, please credit me (cover by stella_vigo) in the description of your story or in an appropriate part of your book. If you're using my code, please don't remove my watermark.
✭ Thread-hopping is allowed as long as the other designer is okay with it. If you prefer another designer's work, don’t hesitate to let me know.
✭ Don’t steal my graphics. I put a lot of time and effort into making these, no matter how simple they look.
✭ If you unpublish/delete your story, use another cover, or delete your account, I have the right to turn your cover into a premade. This also goes to covers that you end up not choosing if I offer more than one design.
things to note... ✭ Your story doesn't have to be published for you to request a cover.
✭ Though I accept most requests, it's not a guarantee that I will accept yours.
✭ All my code is desktop-friendly, mobile-friendly, light-mode-friendly, and dark-mode-friendly by default.
✭ This shop is only for custom orders. I offer premade covers on the 𝖌𝖗𝖆𝖓𝖉𝖊𝖚𝖗 graphics thread.
✭ Highly-manipulated covers (also known as "manip" covers) are covers that take much more time and editing than simply putting text on a picture. Many fantasy covers can be considered "manip" covers.
✭ I'll always show prototypes before I deliver the final product, whether it be a cover or some code. You're allowed to request a complete redo after I show the prototype, but not after delivery. After delivery, I can only accept reasonable edits.
✭ I can code playlists, but I'd prefer if you tell me what songs you want me to include. I can put my own songs but my music taste is, uh, unconventional to say the least.
payment... Payment is optional. Since I'm very much a novice, I'm doing this for free. If you want, though, you can complete one of the following payments:
✭ One comment each on any three poems from my poetry collection, from the depths of my mind, they flutter free.
✭ One inline comment each on the first three chapters of The Secret Land of Otrâlmondé
✭ Three inline comments on any story from my anthology, First and Final
✭ Three inline comments on one of the following short works: I'm Sorry, Word Paintings, or Missing
form... To copy the form, please click on the icon located in the upper-right corner.
⭐︎ ✧ coded by stella_vigo ✧ ⭐︎
I'm mostly doing this out of fun, so request away! I like making graphics for other people :D
rules... ✭ Be nice and abide by the Code of Conduct.
✭ Giving credit is a must. If you're using my cover, please credit me (cover by stella_vigo) in the description of your story or in an appropriate part of your book. If you're using my code, please don't remove my watermark.
✭ Thread-hopping is allowed as long as the other designer is okay with it. If you prefer another designer's work, don’t hesitate to let me know.
✭ Don’t steal my graphics. I put a lot of time and effort into making these, no matter how simple they look.
✭ If you unpublish/delete your story, use another cover, or delete your account, I have the right to turn your cover into a premade. This also goes to covers that you end up not choosing if I offer more than one design.
things to note... ✭ Your story doesn't have to be published for you to request a cover.
✭ Though I accept most requests, it's not a guarantee that I will accept yours.
✭ All my code is desktop-friendly, mobile-friendly, light-mode-friendly, and dark-mode-friendly by default.
✭ This shop is only for custom orders. I offer premade covers on the 𝖌𝖗𝖆𝖓𝖉𝖊𝖚𝖗 graphics thread.
✭ Highly-manipulated covers (also known as "manip" covers) are covers that take much more time and editing than simply putting text on a picture. Many fantasy covers can be considered "manip" covers.
✭ I'll always show prototypes before I deliver the final product, whether it be a cover or some code. You're allowed to request a complete redo after I show the prototype, but not after delivery. After delivery, I can only accept reasonable edits.
✭ I can code playlists, but I'd prefer if you tell me what songs you want me to include. I can put my own songs but my music taste is, uh, unconventional to say the least.
payment... Payment is optional. Since I'm very much a novice, I'm doing this for free. If you want, though, you can complete one of the following payments:
✭ One comment each on any three poems from my poetry collection, from the depths of my mind, they flutter free.
✭ One inline comment each on the first three chapters of The Secret Land of Otrâlmondé
✭ Three inline comments on any story from my anthology, First and Final
✭ Three inline comments on one of the following short works: I'm Sorry, Word Paintings, or Missing
form... To copy the form, please click on the icon located in the upper-right corner.
form for covers
<span style="font-size: 1.8vmin; display: block; font-family: Tahoma, Verdana, sans serif; margin: auto; width: 80%; padding-right: 15px; padding-left: 15px; border: 3px solid; box-shadow: 5px 5px 0px #8994bc; color: #8994bc; background-color: white;">
<span style="font-size: 3vmin; display: block; letter-spacing: 2.2px; text-align: center; margin-top: 15px; margin-bottom: 15px;">☆ requesting a cover ☆</span>
<span style="font-size:; display: flex; margin: auto;">
<span style="font-size:; display: inline-block; margin: auto; margin-right: 15px; padding: 10px; background-image: url('https://cdn140.picsart.com/330583801047201.gif?to=crop&type=webp&r=310x310&q=75'); background-repeat: no-repeat; background-size: 20vmin 20vmin; height: 20vmin; width: 20vmin; background-position: center"></span>
<span style="font-size:; display: inline-block; margin: auto; width: 75%; padding-right: 10px; height: 20vmin; overflow-y: scroll">
✬ <b>Cover Type (simple/vector/manip/other):</b> INSERT TEXT HERE<br>
✬ <b>Title:</b> INSERT TEXT HERE<br>
✬ <b>Subtitle (optional):</b> INSERT TEXT HERE<br>
✬ <b>Tagline (optional):</b> INSERT TEXT HERE<br>
✬ <b>Author Name:</b> INSERT TEXT HERE<br>
✬ <b>Ideas (please be specific):</b> INSERT TEXT HERE<br>
✬ <b>Genre (optional):</b> INSERT TEXT HERE<br>
✬ <b>Other (optional):</b> INSERT TEXT HERE
<details><summary>Short Summary (optional)</summary>
(type a short summary of your story below if you want)
</details>
<details><summary>inspo pics (optional)</summary>
(insert inspo pics below if you want)
</details>
</span></span>
<span style="font-size: 1vmin; font-family: Garamond; display: block; margin: auto; text-align: center; color: #8080a0; letter-spacing: 1.2px; margin-bottom: 10px;">⭐︎ ✧ coded by stella_vigo ✧ ⭐︎</span>
</span>
form for code
<span style="font-size: 1.8vmin; display: block; font-family: Tahoma, Verdana, sans serif; margin: auto; width: 80%; padding-right: 15px; padding-left: 15px; border: 3px solid; box-shadow: 5px 5px 0px #04097d; color: #04097d; background-color: white">
<span style="font-size: 3vmin; display: block; letter-spacing: 2.2px; text-align: center; margin-top: 15px; margin-bottom: 15px;">★ requesting code ★</span>
<span style="font-size:; display: flex; margin: auto;">
<span style="font-size:; display: inline-block; margin: auto; margin-right: 15px; padding: 10px; background-image: url('https://cdn73.picsart.com/194513109000202.gif?to=min&r=640'); background-repeat: no-repeat; background-size: 20vmin 20vmin; height: 20vmin; width: 20vmin; background-position: center"></span>
<span style="font-size:; display: inline-block; margin: auto; width: 75%; padding-right: 10px; height: 20vmin; overflow-y: scroll">
✪ <b>Code Type (thread/playlist/slideshow/other):</b> INSERT TEXT HERE<br>
✪ <b>Title:</b> INSERT TEXT HERE<br>
✪ <b>Subtitle/Tagline (optional):</b> INSERT TEXT HERE<br>
✪ <b>Ideas (please be specific):</b> INSERT TEXT HERE<br>
✪ <b>Other (optional):</b> INSERT TEXT HERE
<details><summary>inspo pics (optional)</summary>
(insert inspo pics below)
</details>
</span></span>
<span style="font-size: 1vmin; font-family: Garamond; display: block; margin: auto; text-align: center; color: #8080a0; letter-spacing: 1.2px; margin-bottom: 10px;">⭐︎ ✧ coded by stella_vigo ✧ ⭐︎</span>
</span>
All suggestions welcome
EDIT: changed the height from using vmin to vh so that it looks taller on mobile. Thanks @Novel_Worm for the suggestion!
EDIT 2: I tried to change the scrolls to x-scroll, but for some reason the y-scroll keeps on showing up. If I get rid of the y-scroll then I can’t scroll both ways, I don’t know how to fix it >.< I guess I’ll just keep it like that for now. However, I did take the suggestion of using a screenshot instead of live code. Thank you @deathinreverie
EDIT 3: If you’re wondering why my personal thread is always being bumped, that’s me working on it lol
EDIT 4: Made some more changes. I’m tweaking it in my personal thread, right over here.
4 Likes
It’s great! Though I do think it should be vertical, not horizontal, for the mobile peeps. And… How’d you get the scrolling to be so unobtrusive? The thread is stunning, though, and I can only imagine how long that must’ve taken you-
4 Likes