Color and Text/Hex Field Pairing

color.html

<div class="color-container">
  <input type="text"  name="hex" class="text-value" />
  <input type="color" name="color" class="color-value" />
</div>

<script type="text/javascript">
  $('.color-container').on('change keyup', 'input[type="text"], input[type="color"]',
    function(){
      var $this = $(this);
      if($this.attr('type') === 'color'){
        $this.siblings('input[type="text"]').val($this.val());
      } else {
        $this.siblings('input[type="color"]').val($this.val());
      }
    });
</script>

You can see this running at http://jsfiddle.net/banderson623/8hpogmwj/1/