Pegar o id da imagem e preencher o campo value do input de formulário

Bom dia.

Eu tenho uma imagem com 3 cores (azul, verde e amarelo). Fiz o mapeamento dela.
Preciso ao clicar na imagem mapeada com as coordenadas da cor azul, pegar o nome da cor (azul) e preencher um input de formulário com esse valor.

Exemplo:

<area shape="rect" coords="155,94,243,259" href="<c:url value="/figura/novo"/>" id="Azul"> 
<area shape="rect" coords="262,94,346,259" href="<c:url value="/figura/novo"/>" id="Verde">
<area shape="rect" coords="375,82,474,276" href="<c:url value="/figura/novo"/>" title="Amarelo">

Se eu clicar numa das cores mapeadas acima, vai abrir um formulário e no input deve estar preenchida a cor clicada no value:

<input type="text" class="form-control" id="nome_cor" name="XXXX" value="XXXXXXX" >

Como eu poderia fazer isso?