CSSONVERGE - all color formats

by Reusablecode

HTML

<div class="box alpha">#yellow</div>
<div class="box beta">#rgb( 255, 255, 0)</div>
<div class="box gamma">#hsl( 60, 100%, 50% )</div>
<div class="box delta">##FF0</div>

<div class="box hslaRed1">#hslaRed1( 0, 100%, 50%, 0.1 )</div>
<div class="box hslaRed5">#hslaRed5( 0, 100%, 50%, 0.5 )</div>

CSS

.box {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    width: 300px;
    margin: 10px;
    border: 2px solid;
    padding: 5px;
}

.hslaRed1 { background: hsla( 0, 100%, 50%, 0.1 ); }
.hslaRed5 { background: hsla( 0, 100%, 50%, 0.5 ); }

.alpha { background: yellow; }
.beta  { background: rgb( 255, 255, 0); }
.gamma { background: hsl( 60, 100%, 50% ); }
.delta { background: #FF0; }