Author Archives


29
Nov 11

So many shades of black… and white… and red…

Yikes, this is far too many colours to have in one css file…

18X#000
1X#070707
1X#CC0000
1X#006094
2X#0096a7
1X#009ba9
1X#009fdc
1X#2b2b2b
1X#333
1X#393939
1X#3a3a3a
1X#3f3f3f
2X#414141
2X#515151
1X#780f2c
1X#c40c1e
2X#d41527
1X#d51c2e
5X#d6172a
8X#d71729
4X#ee6028
2X#38713a
2X#66a24c
2X#7b619c
2X#e67621
2X#456c7e
1X#46696F
1X#528195
12X#666
1X#707070
2X#797979
1X#808285
1X#888888
1X#999
1X#A6A6A6
1X#A8A8A8
1X#a9a9a9
1X#aaa
3X#b3b3b3
1X#b4d7f0
6X#ccc
1X#d4e7f3
2X#D9D9D9
1X#ddd
1X#e2e2e2
1X#e4e4e4
1X#e6e6e6
1X#eaeaea
2X#edf5fa
1X#eee
3X#f0f0f0
2X#f1f1f1
4X#f5f5f5
6X#f6f6f6
1X#f8f8f8
23X#fea
36X#fff

In case you weren’t counting… there are 57 of them, way too many blackish ones, whiteish ones and redish ones… I can see two shades of each perhaps (for fancy gradients…). My guess is this will be down around ~20:


27
Nov 11

Demon of the Lute

That can’t be his natural hair colour…

I do enjoy the part where they are jumping on a trampoline with oversized weapons though…

imdb


25
Nov 11

Ladies and Gentlemen… Cherpumple


9
Oct 11

CSS Arrows

Turns out that you can make css arrows (and some other fun shapes) using borders and 0 width elemets (I used divs, but they can be whatever element really).

This is the html:

 
<div class="css-arrow-container">
<div class="css-arrow-right">
</div>
<div class="css-arrow-left">
</div>
<div class="css-arrow-up">
</div>
<div class="css-arrow-down">
</div>
</div>

and the css looks like this:

<style>
.css-arrow-right, .css-arrow-left, .css-arrow-up, .css-arrow-down {
    border-color: white white white red;
    border-style: solid;
    border-width: 20px;
    height: 0;
    width: 0;
}
.css-arrow-left{
    border-color: white green white white;
}
.css-arrow-up{
    border-color: white  white blue white;
}
.css-arrow-down{
    border-color: yellow white white white;
}
</style>

You can also get fancy and do stuff like this:

By setting 4 different colours and playing with the border style (this one is dotted, which for some reason makes a weird swirl pattern):

<style>
.css-dotted-box{
    border-color: yellow blue pink green;
    border-style: dotted;
}
</style>