diff --git a/src/components/datepicker/datePicker-theme.scss b/src/components/datepicker/datePicker-theme.scss
index 43204e4a74e..7bb1be8e8f0 100644
--- a/src/components/datepicker/datePicker-theme.scss
+++ b/src/components/datepicker/datePicker-theme.scss
@@ -9,6 +9,10 @@ md-datepicker.md-THEME_NAME-theme {
.md-datepicker-input-container {
border-bottom-color: '{{background-300}}';
+ &.md-datepicker-focused {
+ border-bottom-color: '{{primary-500}}'
+ }
+
&.md-datepicker-invalid {
border-bottom-color: '{{warn-500}}';
}
diff --git a/src/components/datepicker/datePicker.js b/src/components/datepicker/datePicker.js
index 6f16abaf1e3..838ec54458b 100644
--- a/src/components/datepicker/datePicker.js
+++ b/src/components/datepicker/datePicker.js
@@ -48,9 +48,10 @@
'ng-click="ctrl.openCalendarPane($event)">' +
'