Color Wheel

Basecolor
Hex: #A27C79. Brightness: 135. Parallel 3
Hex: #A3927A. Brightness: 148. Parallel 4
Hex: #A0A37A. Brightness: 157. Adjacent/tetrad
Hex: #8CA37A. Brightness: 151. Triad 1
Hex: #7AA37D. Brightness: 146. Split complimentary 1
Hex: #7AA392. Brightness: 149. Complimentary
Hex: #7AA0A3. Brightness: 149. Split complimentary 2
Hex: #7A8CA3. Brightness: 137. Triad 2
Hex: #7D7AA3. Brightness: 128. Adjacent/tetrad
Hex: #927AA3. Brightness: 134. Parallel 1
Hex: #A37AA0. Brightness: 139. Parallel 2
Hex: #A37A8C. Brightness: 136.

Shades

Shade 90% black
Hex: #100C0C. Brightness: 13. Shade 80% black
Hex: #201918. Brightness: 27. Shade 70% black
Hex: #312524. Brightness: 40. Shade 60% black
Hex: #413230. Brightness: 54. Shade 50% black
Hex: #513E3C. Brightness: 67. Shade 40% black
Hex: #614A49. Brightness: 81. Shade 30% black
Hex: #715755. Brightness: 95. Shade 20% black
Hex: #826361. Brightness: 108. Shade 10% black
Hex: #92706D. Brightness: 122. Basecolor
Hex: #A27C79. Brightness: 135.

Tints

Tint 10% white
Hex: #AB8986. Brightness: 147. Tint 20% white
Hex: #B59694. Brightness: 159. Tint 30% white
Hex: #BEA3A1. Brightness: 171. Tint 40% white
Hex: #C7B0AF. Brightness: 183. Tint 50% white
Hex: #D0BEBC. Brightness: 195. Tint 60% white
Hex: #DACBC9. Brightness: 207. Tint 70% white
Hex: #E3D8D7. Brightness: 219. Tint 80% white
Hex: #ECE5E4. Brightness: 231. Tint 90% white
Hex: #F6F2F2. Brightness: 243.

Saturation

Saturation 10
Hex: #A39493. Brightness: 152. Saturation 20
Hex: #A38583. Brightness: 142. Saturation 30
Hex: #A37672. Brightness: 131. Saturation 40
Hex: #A36662. Brightness: 120. Saturation 50
Hex: #A35752. Brightness: 109. Saturation 60
Hex: #A34841. Brightness: 98. Saturation 70
Hex: #A33931. Brightness: 88. Saturation 80
Hex: #A32921. Brightness: 77. Saturation 90
Hex: #A31A10. Brightness: 66. Saturation 100
Hex: #A30B00. Brightness: 55.

Gradient examples

CSS Code

.basecolor {background-color:#A27C79;}

.parallel_3 {background-color:#A3927A;}

.parallel_4 {background-color:#A0A37A;}

.adjacent/tetrad {background-color:#8CA37A;}

.triad_1 {background-color:#7AA37D;}

.split_complimentary_1 {background-color:#7AA392;}

.complimentary {background-color:#7AA0A3;}

.split_complimentary_2 {background-color:#7A8CA3;}

.triad_2 {background-color:#7D7AA3;}

.adjacent/tetrad {background-color:#927AA3;}

.parallel_1 {background-color:#A37AA0;}

.parallel_2 {background-color:#A37A8C;}

.shade_90%_black {background-color:#100C0C;}

.shade_80%_black {background-color:#201918;}

.shade_70%_black {background-color:#312524;}

.shade_60%_black {background-color:#413230;}

.shade_50%_black {background-color:#513E3C;}

.shade_40%_black {background-color:#614A49;}

.shade_30%_black {background-color:#715755;}

.shade_20%_black {background-color:#826361;}

.shade_10%_black {background-color:#92706D;}

.basecolor {background-color:#A27C79;}

.tint_10%_white {background-color:#AB8986;}

.tint_20%_white {background-color:#B59694;}

.tint_30%_white {background-color:#BEA3A1;}

.tint_40%_white {background-color:#C7B0AF;}

.tint_50%_white {background-color:#D0BEBC;}

.tint_60%_white {background-color:#DACBC9;}

.tint_70%_white {background-color:#E3D8D7;}

.tint_80%_white {background-color:#ECE5E4;}

.tint_90%_white {background-color:#F6F2F2;}

.saturation_10 {background-color:#A39493;}

.saturation_20 {background-color:#A38583;}

.saturation_30 {background-color:#A37672;}

.saturation_40 {background-color:#A36662;}

.saturation_50 {background-color:#A35752;}

.saturation_60 {background-color:#A34841;}

.saturation_70 {background-color:#A33931;}

.saturation_80 {background-color:#A32921;}

.saturation_90 {background-color:#A31A10;}

.saturation_100 {background-color:#A30B00;}

.gradient1 {background-color:#A27C79;
background-image:-moz-linear-gradient(top,#C7B0AF,#A27C79,#715755);
 background:-webkit-gradient(linear,left top,left bottom,color-stop(0.0,#C7B0AF),color-stop(0.5,#A27C79),color-stop(1.0,#715755));
filter:PROGID:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ffC7B0AF',EndColorStr='#ff715755');
}

.gradient2 {background-color:#A27C79;
background-image:-moz-linear-gradient(top,#715755,#A27C79,#C7B0AF);
 background:-webkit-gradient(linear,left top,left bottom,color-stop(0.0,#715755),color-stop(0.5,#A27C79),color-stop(1.0,#C7B0AF));
filter:PROGID:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr='#ff715755',EndColorStr='#ffC7B0AF');
}

Color picker

Color Wheel

Shades

Tints

Saturation

Gradient examples

CSS Code