[Sanda]

С применением jQuery:

<img alt="" src="image1.jpg" id="image" />
<div class="colorBox">
  <div class="color" data-src="image1.jpg">Цвет 1</div>
  <div class="color" data-src="image2.jpg">Цвет 2</div>
  <div class="color" data-src="image3.jpg">Цвет 3</div>
</div>

$('.colorBox').on(
  'click'
  , '.color'
  , function (evt) {
    document.getElementById('image').src = evt.currentTarget.getAttribute('data-src');
  }
);

Ещё раз повторюсь - никто не меняет кусочек изображения, закрашивая нужную его часть соответствующим цветом. Меняется картинка целиком.