Ajax Loader
HTML
<div class="fish red">
1
<div class="fish red">
2
  <div>1</div>
3
</div> 
4
 
5
<div class="fish orange">
6
  <div>20</div>
7
</div>
8
 
9
 <div class="fish green">
10
  <div>100</div>
11
</div>
12
 
13
<div class="fish blue">
14
  <div>1000</div>
15
</div>
16
 
17
<div class="fish blue disabled">
18
  <div>1000</div>
19
</div>
20
 
21
<div class="fish black">
22
  <div>5000</div>
23
</div>
 
CSS
body {
1
body {
2
    margin: 0px;
3
    padding: 0px;
4
  background: #ddd;
5
}
6
 
7
div.fish {
8
    float: left;
9
    width: 70px;
10
    height: 70px;
11
    margin: 30px;
12
    border-radius: 150px;
13
    -webkit-border-radius: 150px;
14
    -moz-border-radius: 150px;
15
    box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1), 0 0 5px 1px rgba(90,90,90, 0.1), inset 0 35px 1px rgba(255,255,255, 0.2);
16
    -moz-box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1), 0 0 5px 1px rgba(90,90,90, 0.1), inset 0 35px 1px rgba(255,255,255, 0.2);
17
    -webkit-box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1), 0 0 5px 1px rgba(90,90,90, 0.1), inset 0 35px 1px rgba(255,255,255, 0.2);
18
    border: 10px dotted #fff;
19
}
20
 
21
div.fish div {
22
    font-family: Verdana;
23
    text-align: center;
24
    line-height: 70px;
25
    font-size: 1.7em;
26
}
27
 
28
div.orange { background: #f7b55e }
29
 
30
div.green { background: #92ed40 }
31
 
32
div.blue { background: #4cc3fe }
33
 
34
div.black {
35
    background: #333;
36
    color: #eee;
37
    box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1), 0 0 5px 1px rgba(90,90,90, 0.1), inset 0 35px 1px rgba(255,255,255, 0.1);
38
    -moz-box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1), 0 0 5px 1px rgba(90,90,90, 0.1), inset 0 35px 1px rgba(255,255,255, 0.1);
39
    -webkit-box-shadow: inset 0 0 1px 1px rgba(0,0,0, 0.1), 0 0 5px 1px rgba(90,90,90, 0.1), inset 0 35px 1px rgba(255,255,255, 0.1);
40
    border: 10px dotted #ccc;
41
}
42
 
43
div.red { background: #fd5f72 }
44
 
45
div.disabled { opacity: 0.4 }
 

CSS3 Only Poker Chips

CSSDeck G+