Hex/RGB conversion

<!DOCTYPE html>
<html ng-app="myApp">

<head lang="en">
  <meta charset="utf-8" />
  <title>Custom Plunker</title>
  <link rel="stylesheet" type="text/css" href="http://angular-ui.github.com/ng-grid/css/ng-grid.css" />
  <link rel="stylesheet" type="text/css" href="style.css" />
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js"></script>
  <script type="text/javascript" src="http://angular-ui.github.com/ng-grid/lib/ng-grid.debug.js"></script>
  <script type="text/javascript" src="main.js"></script>
</head>

<body ng-controller="MyCtrl">

Try entering 007aff in the hex input

<p>hex</p><input ng-model="hex">
<p>red</p><input ng-model="r">
<p>green</p><input ng-model="g">
<p>blue</p><input ng-model="b">
<p>rgb</p><input ng-model="rgb">

</body>
</html>

input{
    display:block;
}

// main.js
var app = angular.module('myApp', []);
app.controller('MyCtrl', function($scope) {

  $scope.hex = 'ff3b30';

      $scope.$watch('hex', function() {
    
        var rgb = parseInt($scope.hex, 16);

    $scope.r = (rgb >> 16) & 0xFF;
    $scope.g = (rgb >> 8) & 0xFF;
    $scope.b = rgb & 0xFF;

    $scope.rgb = 'rgb(' + $scope.r + ',' + $scope.g + ',' + $scope.b + ');';

  });

  $scope.$watch('r+g+b', function() {

    $scope.rgb = 'rgb(' + $scope.r + ',' + $scope.g + ',' + $scope.b + ');';
    $scope.hex = parseInt($scope.r << 16 | $scope.g << 8 | $scope.b).toString(16);
  });

});