twenty-two || dye it the shades of dream

[kumous]

ONE (1) COLLAPSABLE MUSELIST

inactive characters.

Name

Canon

Name

Canon

Name

Canon

Name

Canon

Name

Canon

Name

Canon

CODE:

<raw-code><div style="max-width:900px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;"> <details style="background:#222;color:#fff;padding:20px; width: 700px; outline: 2px solid #fff;"> <summary style="font-family:georgia, garamond, serif; font-weight: bold; font-style: italic; font-size: 36px; cursor:pointer; color: #ad3848;text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff;">TABLE NAME</summary> <div style="background: linear-gradient(#d0d0d0, #fff); outline: 10px double #fff; box-shadow: 5px 5px 10px #000; margin-top: 30px; padding: 20px; text-align: center;font-family: avenir, century gothic, sans serif; font-size: 12px; "> <div style="display: inline-block; width: 150px; height: 150px;"> <img src="ICON" style="border: 5px solid #fff;"> <div style="width: 110px;background: #000; color: #fff; text-align: center; opacity: 0.7; padding: 2px; position: relative; top: -30px; left: 18px; text-transform: lowercase;">CHARACTER NAME</div> <div style="width: 110px;background: #fff; color: #000; opacity: 0.9; padding: 2px; position: relative; top: -30px; left: 18px; text-transform: lowercase;">CANON</div> </div> <div style="display: inline-block; width: 150px; height: 150px;"> <img src="ICON" style="border: 5px solid #fff;"> <div style="width: 110px;background: #000; color: #fff; text-align: center; opacity: 0.7; padding: 2px; position: relative; top: -30px; left: 18px; text-transform: lowercase;">CHARACTER NAME</div> <div style="width: 110px;background: #fff; color: #000; opacity: 0.9; padding: 2px; position: relative; top: -30px; left: 18px; text-transform: lowercase;">CANON</div> </div> <div style="display: inline-block; width: 150px; height: 150px;"> <img src="ICON" style="border: 5px solid #fff;"> <div style="width: 110px;background: #000; color: #fff; text-align: center; opacity: 0.7; padding: 2px; position: relative; top: -30px; left: 18px; text-transform: lowercase;">CHARACTER NAME</div> <div style="width: 110px;background: #fff; color: #000; opacity: 0.9; padding: 2px; position: relative; top: -30px; left: 18px; text-transform: lowercase;">CANON</div> </div> <div style="display: inline-block; width: 150px; height: 150px;"> <img src="ICON" style="border: 5px solid #fff;"> <div style="width: 110px;background: #000; color: #fff; text-align: center; opacity: 0.7; padding: 2px; position: relative; top: -30px; left: 18px; text-transform: lowercase;">CHARACTER NAME</div> <div style="width: 110px;background: #fff; color: #000; opacity: 0.9; padding: 2px; position: relative; top: -30px; left: 18px; text-transform: lowercase;">CANON</div> </div> <div style="display: inline-block; width: 150px; height: 150px;"> <img src="ICON" style="border: 5px solid #fff;"> <div style="width: 110px;background: #000; color: #fff; text-align: center; opacity: 0.7; padding: 2px; position: relative; top: -30px; left: 18px; text-transform: lowercase;">CHARACTER NAME</div> <div style="width: 110px;background: #fff; color: #000; opacity: 0.9; padding: 2px; position: relative; top: -30px; left: 18px; text-transform: lowercase;">CANON</div> </div> <div style="display: inline-block; width: 150px; height: 150px;"> <img src="ICON" style="border: 5px solid #fff;"> <div style="width: 110px;background: #000; color: #fff; text-align: center; opacity: 0.7; padding: 2px; position: relative; top: -30px; left: 18px; text-transform: lowercase;">CHARACTER NAME</div> <div style="width: 110px;background: #fff; color: #000; opacity: 0.9; padding: 2px; position: relative; top: -30px; left: 18px; text-transform: lowercase;">CANON</div> </div> </div> </details> </div></raw-code>

ღ simple and easy, if you want more information on how to use the details tab, see this tutorial
ღ the colors I'm using are #ad3848 and #fff for the outline
ღ if you need an image-hosting site, I always recommend imgur
ღ credit if you wanna! if only just to let people know where you got it. also feel free to ask questions or edit. goodness knows I frankenspliced some codes together when I was learning (and I still am)