--- a/servo/components/style/properties/helpers/animated_properties.mako.rs
+++ b/servo/components/style/properties/helpers/animated_properties.mako.rs
@@ -2060,16 +2060,63 @@ impl<T, U> Interpolate for Either<T, U>
             _ => {
                 let interpolated = if progress < 0.5 { *self } else { *other };
                 Ok(interpolated)
             }
         }
     }
 }
 
+#[derive(Copy, Clone, Debug, PartialEq)]
+#[cfg_attr(feature = "servo", derive(HeapSizeOf))]
+#[allow(missing_docs)]
+pub enum IntermediateColor {
+    CurrentColor,
+    IntermediateRGBA(IntermediateRGBA),
+}
+
+impl Interpolate for IntermediateColor {
+    #[inline]
+    fn interpolate(&self, other: &Self, progress: f64) -> Result<Self, ()> {
+        match (*self, *other) {
+            (IntermediateColor::IntermediateRGBA(ref this), IntermediateColor::IntermediateRGBA(ref other)) => {
+                this.interpolate(other, progress).map(IntermediateColor::IntermediateRGBA)
+            }
+            // FIXME: Bug 1345709: Implement currentColor animations.
+            _ => Err(()),
+        }
+    }
+}
+
+impl <'a> From<<&'a CSSParserColor> for IntermediateColor {
+    fn from(color: &CSSParserColor) -> IntermediateColor {
+        match *color {
+            CSSParserColor::RGBA(ref color) =>
+                IntermediateColor::IntermediateRGBA(IntermediateRGBA::new(color.red_f32(),
+                                                                          color.green_f32(),
+                                                                          color.blue_f32(),
+                                                                          color.alpha_f32())),
+            CSSParserColor::CurrentColor => IntermediateColor::CurrentColor,
+        }
+    }
+}
+
+impl <'a> From<<&'a IntermediateColor> for CSSParserColor {
+    fn from(color: &IntermediateColor) -> CSSParserColor {
+        match *color {
+            IntermediateColor::IntermediateRGBA(ref color) =>
+                CSSParserColor::RGBA(RGBA::from_floats(color.red,
+                                                       color.green,
+                                                       color.blue,
+                                                       color.alpha)),
+            IntermediateColor::CurrentColor => CSSParserColor::CurrentColor,
+        }
+    }
+}
+
 impl <'a> From<<&'a IntermediateRGBA> for RGBA {
     fn from(extended_rgba: &IntermediateRGBA) -> RGBA {
         // RGBA::from_floats clamps each component values.
         RGBA::from_floats(extended_rgba.red,
                           extended_rgba.green,
                           extended_rgba.blue,
                           extended_rgba.alpha)
     }

--- a/servo/components/style/properties/longhand/background.mako.rs
+++ b/servo/components/style/properties/longhand/background.mako.rs
@@ -5,17 +5,17 @@
 <%namespace name="helpers" file="/helpers.mako.rs" />
 
 <% data.new_style_struct("Background", inherited=False) %>
 
 ${helpers.predefined_type("background-color", "CSSColor",
     "::cssparser::Color::RGBA(::cssparser::RGBA::transparent())",
     initial_specified_value="SpecifiedValue::transparent()",
     spec="https://drafts.csswg.org/css-backgrounds/#background-color",
-    animation_value_type="ComputedValue", complex_color=True)}
+    animation_value_type="IntermediateColor", complex_color=True)}
 
 <%helpers:vector_longhand name="background-image" animation_value_type="none"
                           spec="https://drafts.csswg.org/css-backgrounds/#the-background-image"
                           has_uncacheable_values="${product == 'gecko'}">
     use std::fmt;
     use style_traits::ToCss;
     use values::HasViewportPercentage;
     use values::specified::Image;

--- a/servo/components/style/properties/longhand/border.mako.rs
+++ b/servo/components/style/properties/longhand/border.mako.rs
@@ -15,17 +15,17 @@
         else:
             return "https://drafts.csswg.org/css-backgrounds/#border-%s-%s" % (side[0], kind)
 %>
 % for side in ALL_SIDES:
     ${helpers.predefined_type("border-%s-color" % side[0], "CSSColor",
                               "::cssparser::Color::CurrentColor",
                               alias=maybe_moz_logical_alias(product, side, "-moz-border-%s-color"),
                               spec=maybe_logical_spec(side, "color"),
-                              animation_value_type="ComputedValue", logical = side[1])}
+                              animation_value_type="IntermediateColor", logical = side[1])}
 % endfor
 
 % for side in ALL_SIDES:
     ${helpers.predefined_type("border-%s-style" % side[0], "BorderStyle",
                               "specified::BorderStyle::none",
                               need_clone=True,
                               alias=maybe_moz_logical_alias(product, side, "-moz-border-%s-style"),
                               spec=maybe_logical_spec(side, "style"),

--- a/servo/components/style/properties/longhand/column.mako.rs
+++ b/servo/components/style/properties/longhand/column.mako.rs
@@ -70,17 +70,17 @@
         BorderWidth::parse(context, input)
     }
 </%helpers:longhand>
 
 // https://drafts.csswg.org/css-multicol-1/#crc
 ${helpers.predefined_type("column-rule-color", "CSSColor",
                           "::cssparser::Color::CurrentColor",
                           initial_specified_value="specified::CSSColor::currentcolor()",
-                          products="gecko", animation_value_type="ComputedValue", extra_prefixes="moz",
+                          products="gecko", animation_value_type="IntermediateColor", extra_prefixes="moz",
                           complex_color=True, need_clone=True,
                           spec="https://drafts.csswg.org/css-multicol/#propdef-column-rule-color")}
 
 // It's not implemented in servo or gecko yet.
 ${helpers.single_keyword("column-span", "none all",
                          products="none", animation_value_type="none",
                          spec="https://drafts.csswg.org/css-multicol/#propdef-column-span")}
 

--- a/servo/components/style/properties/longhand/inherited_text.mako.rs
+++ b/servo/components/style/properties/longhand/inherited_text.mako.rs
@@ -1199,17 +1199,17 @@
             }
         }
     % endif
 </%helpers:longhand>
 
 ${helpers.predefined_type("text-emphasis-color", "CSSColor",
                           "::cssparser::Color::CurrentColor",
                           initial_specified_value="specified::CSSColor::currentcolor()",
-                          products="gecko", animation_value_type="ComputedValue",
+                          products="gecko", animation_value_type="IntermediateColor",
                           complex_color=True, need_clone=True,
                           spec="https://drafts.csswg.org/css-text-decor/#propdef-text-emphasis-color")}
 
 
 ${helpers.predefined_type(
     "-moz-tab-size", "LengthOrNumber",
     "::values::Either::Second(8.0)",
     "parse_non_negative",
@@ -1217,25 +1217,25 @@
     spec="https://drafts.csswg.org/css-text-3/#tab-size-property")}
 
 
 // CSS Compatibility
 // https://compat.spec.whatwg.org
 ${helpers.predefined_type(
     "-webkit-text-fill-color", "CSSColor",
     "CSSParserColor::CurrentColor",
-    products="gecko", animation_value_type="ComputedValue",
+    products="gecko", animation_value_type="IntermediateColor",
     complex_color=True, need_clone=True,
     spec="https://compat.spec.whatwg.org/#the-webkit-text-fill-color")}
 
 ${helpers.predefined_type(
     "-webkit-text-stroke-color", "CSSColor",
     "CSSParserColor::CurrentColor",
     initial_specified_value="specified::CSSColor::currentcolor()",
-    products="gecko", animation_value_type="ComputedValue",
+    products="gecko", animation_value_type="IntermediateColor",
     complex_color=True, need_clone=True,
     spec="https://compat.spec.whatwg.org/#the-webkit-text-stroke-color")}
 
 <%helpers:longhand products="gecko" name="-webkit-text-stroke-width" animation_value_type="none"
                    spec="https://compat.spec.whatwg.org/#the-webkit-text-stroke-width">
     use app_units::Au;
     use std::fmt;
     use style_traits::ToCss;

--- a/servo/components/style/properties/longhand/outline.mako.rs
+++ b/servo/components/style/properties/longhand/outline.mako.rs
@@ -7,17 +7,17 @@
 
 <% data.new_style_struct("Outline",
                          inherited=False,
                          additional_methods=[Method("outline_has_nonzero_width", "bool")]) %>
 
 // TODO(pcwalton): `invert`
 ${helpers.predefined_type("outline-color", "CSSColor", "computed::CSSColor::CurrentColor",
                           initial_specified_value="specified::CSSColor::currentcolor()",
-                          animation_value_type="ComputedValue", complex_color=True, need_clone=True,
+                          animation_value_type="IntermediateColor", complex_color=True, need_clone=True,
                           spec="https://drafts.csswg.org/css-ui/#propdef-outline-color")}
 
 <%helpers:longhand name="outline-style" need_clone="True" animation_value_type="none"
                    spec="https://drafts.csswg.org/css-ui/#propdef-outline-style">
 
     use std::fmt;
     use style_traits::ToCss;
     use values::specified::BorderStyle;

--- a/servo/components/style/properties/longhand/text.mako.rs
+++ b/servo/components/style/properties/longhand/text.mako.rs
@@ -223,17 +223,17 @@
                          spec="https://drafts.csswg.org/css-text-decor/#propdef-text-decoration-style")}
 
 ${helpers.predefined_type(
     "text-decoration-color", "CSSColor",
     "computed::CSSColor::CurrentColor",
     initial_specified_value="specified::CSSColor::currentcolor()",
     complex_color=True,
     products="gecko",
-    animation_value_type="ComputedValue",
+    animation_value_type="IntermediateColor",
     spec="https://drafts.csswg.org/css-text-decor/#propdef-text-decoration-color")}
 
 <%helpers:longhand name="initial-letter"
                    animation_value_type="none"
                    products="gecko"
                    spec="https://drafts.csswg.org/css-inline/#sizing-drop-initials">
     use std::fmt;
     use style_traits::ToCss;