Funhouse update 06/12: new carrd - cbox added under misc

Code OR Graphics?

crd tips from a guy whos considered legally blind:

1. holy crap please make sure your text is readable and big enough. there is some text i cant even read with my glasses on because either its too small, the font is unreadable or the colors make it hard to read.

2. speaking about colors... make sure your carrd is colorblind friendly. ref image here:

3. a clean layout goes a long way and makes information easier to read/find

4. addendum to point one, but also use blurring sparingly or make it subtler. I reiterate I Cannot See

cbox

kim + bryan, 18 she/him viet

Text

i like asscreed, red dead, gta, fighting games (t7, gg, kof), hlm and much more. besides games i like transformers, comic books, bad movies, horror and lolita/ouji/aristo fashion very much. yes thats ac yaoi

personal carrd & discord: kimdrometas#8136
tellonym to send me q's! dont be weird

log:

created: i forgor
30/10: vis overhaul 1
04/12: vis overhaul..2! added more graphics and code
05/12: tellonym added and new carrd added to inspo
06/12: cbox and another carrd added

notes:

06/11: added "mine" page, updated about page
04/12: im making cookies today
05/12: thanks for 1k visits! - tellonym added for q's. also the cookies turned out great.
07/12: changed banner, happy holidays!

this is not a comprehensive list just a personal one. for more codes ill direct you here, there and over yonder. have fun!

in order, the values mean:
h-shadow, v-shadow and blur. note how you have to double the second shadow, since you have to layer them beneath eachother.

this also works on transparent gifs. not needed with regular images since carrd has built in options already. here are some fun examples for what you can do with this code:

ill assume you have passive knowledge about css, otherwise google is your friend.

to get results like on the left, all you really do is layering "drop-shadow" under itself a few times - the resulting code looks something like this:

filter: drop-shadow(0 1px 1px red) drop-shadow(0 -1px 1px red) drop-shadow(1px 0 1px red) drop-shadow(-1px 0 1px red) drop-shadow(0 2px 1px black) drop-shadow(0 -4px 1px black) drop-shadow(2px 0 1px black) drop-shadow(-4px 0 1px black);

code from duvet.ju.mp

all 3 use the same base, id reccomend playing around with it for fun results

filter

#image01 {
transition: filter .4s;
}
#image01:hover {
filter:saturate(200%);
}

shrink

#image01 {
transition: transform .4s; }
#image01:hover {
transform: scale(0.5);
transform-origin: 50% 50%;
}

rotate

#image01 {
transition: transform .4s;
}
#image01:hover {
transform: scale(0.75) rotate(10deg);
transform-origin: 50% 50%;
}

gifs + dividers

stamps

pngs + graphics

blingees

bg (gif + static)