navigation: cutout

[transilience]

louise lo

statistics bio permissions threads playlist visuals

lorem ipsum dolor sit amet consectetuer adipiscing elit nonummy fringilla ut pras nulla sed morbis volutpat auctor

PB Stock Model • CST • Discord: Lulu#0000

copy & paste

<div style="box-sizing: border-box; display: grid; grid-template-columns: 200px auto; grid-gap: 10px; padding: 15px; width: 450px; margin: auto; border-radius: 30px; background: #fd4; color: #666; font-family: 'Consolas', 'Monaco', monospace;"> <div style="box-sizing: border-box; grid-column: 1/3; border: 2px dashed #666; padding: 15px; padding-left: 35px; border-radius: 20px; background: #fff; color: #000; font-size: 28pt; text-transform: uppercase; text-align: center; letter-spacing: 10px;">TITLE</div> <img src="IMGURL" style="box-sizing: inherit; grid-column: 1/2; grid-row: 2/8; width: 100%; height: 100%; object-fit: cover; padding: 5px; border: 2px dashed #666; border-radius: 20px; background: #fff; "> <a href="URL1" style="padding: 10px; border: 2px dashed #666; border-radius: 20px; background: #fff; color: #f00; text-align: center; text-decoration: none;">LINK1</a> <a href="URL2" style="padding: 10px; border: 2px dashed #666; border-radius: 20px; background: #fff; color: #f00; text-align: center; text-decoration: none;">LINK2</a> <a href="URL3" style="padding: 10px; border: 2px dashed #666; border-radius: 20px; background: #fff; color: #f00; text-align: center; text-decoration: none;">LINK3</a> <a href="URL4" style="padding: 10px; border: 2px dashed #666; border-radius: 20px; background: #fff; color: #f00; text-align: center; text-decoration: none;">LINK4</a> <a href="URL5" style="padding: 10px; border: 2px dashed #666; border-radius: 20px; background: #fff; color: #f00; text-align: center; text-decoration: none;">LINK5</a> <a href="URL6" style="padding: 10px; border: 2px dashed #666; border-radius: 20px; background: #fff; color: #f00; text-align: center; text-decoration: none;">LINK6</a> <div style="grid-column: 1/3; padding: 15px; border: 2px dashed #666; border-radius: 20px; background: #fff; color: #000; text-align: justify;">TEXTGOESHERE</div> <div style="grid-column: 1/3; font-size: 80%; text-align: center;">PB • TIMEZONE • CONTACT</div> </div>

find & replace

background: #FD4 • cutouts: #FFF • text: #000 • link text: #f00 • outlines / footer text: #666

misc. notes

for right-hand picture, change grid-column: 1/2 to grid-column: 2/3

Comments

[snekeyes]

This is lovely, gonna be using this for some of my accounts <3