diff --git a/Libraries/LibWeb/CSS/ComputedProperties.cpp b/Libraries/LibWeb/CSS/ComputedProperties.cpp
index 67dc749fc8a..462fdd85b19 100644
--- a/Libraries/LibWeb/CSS/ComputedProperties.cpp
+++ b/Libraries/LibWeb/CSS/ComputedProperties.cpp
@@ -536,7 +536,7 @@ Optional<CSS::JustifySelf> ComputedProperties::justify_self() const
     return keyword_to_justify_self(value.to_keyword());
 }
 
-Vector<CSS::Transformation> ComputedProperties::transformations_for_style_value(CSSStyleValue const& value)
+Vector<Transformation> ComputedProperties::transformations_for_style_value(CSSStyleValue const& value)
 {
     if (value.is_keyword() && value.to_keyword() == CSS::Keyword::None)
         return {};
@@ -546,53 +546,11 @@ Vector<CSS::Transformation> ComputedProperties::transformations_for_style_value(
 
     auto& list = value.as_value_list();
 
-    Vector<CSS::Transformation> transformations;
-
+    Vector<Transformation> transformations;
     for (auto& it : list.values()) {
         if (!it->is_transformation())
             return {};
-        auto& transformation_style_value = it->as_transformation();
-        auto function = transformation_style_value.transform_function();
-        auto function_metadata = transform_function_metadata(function);
-        Vector<TransformValue> values;
-        size_t argument_index = 0;
-        for (auto& transformation_value : transformation_style_value.values()) {
-            if (transformation_value->is_calculated()) {
-                auto& calculated = transformation_value->as_calculated();
-                if (calculated.resolves_to_length_percentage()) {
-                    values.append(CSS::LengthPercentage { calculated });
-                } else if (calculated.resolves_to_percentage()) {
-                    // FIXME: Maybe transform this for loop to always check the metadata for the correct types
-                    if (function_metadata.parameters[argument_index].type == TransformFunctionParameterType::NumberPercentage) {
-                        values.append(NumberPercentage { calculated.resolve_percentage().value() });
-                    } else {
-                        values.append(LengthPercentage { calculated.resolve_percentage().value() });
-                    }
-                } else if (calculated.resolves_to_number()) {
-                    values.append({ Number(Number::Type::Number, calculated.resolve_number().value()) });
-                } else if (calculated.resolves_to_angle()) {
-                    values.append({ calculated.resolve_angle().value() });
-                } else {
-                    dbgln("FIXME: Unsupported calc value in transform! {}", calculated.to_string(CSSStyleValue::SerializationMode::Normal));
-                }
-            } else if (transformation_value->is_length()) {
-                values.append({ transformation_value->as_length().length() });
-            } else if (transformation_value->is_percentage()) {
-                if (function_metadata.parameters[argument_index].type == TransformFunctionParameterType::NumberPercentage) {
-                    values.append(NumberPercentage { transformation_value->as_percentage().percentage() });
-                } else {
-                    values.append(LengthPercentage { transformation_value->as_percentage().percentage() });
-                }
-            } else if (transformation_value->is_number()) {
-                values.append({ Number(Number::Type::Number, transformation_value->as_number().number()) });
-            } else if (transformation_value->is_angle()) {
-                values.append({ transformation_value->as_angle().angle() });
-            } else {
-                dbgln("FIXME: Unsupported value in transform! {}", transformation_value->to_string(CSSStyleValue::SerializationMode::Normal));
-            }
-            argument_index++;
-        }
-        transformations.empend(function, move(values));
+        transformations.append(it->as_transformation().to_transformation());
     }
     return transformations;
 }
diff --git a/Libraries/LibWeb/CSS/StyleValues/TransformationStyleValue.cpp b/Libraries/LibWeb/CSS/StyleValues/TransformationStyleValue.cpp
index bbcbbaa87a9..0d50a8423a1 100644
--- a/Libraries/LibWeb/CSS/StyleValues/TransformationStyleValue.cpp
+++ b/Libraries/LibWeb/CSS/StyleValues/TransformationStyleValue.cpp
@@ -9,10 +9,58 @@
 
 #include "TransformationStyleValue.h"
 #include <AK/StringBuilder.h>
+#include <LibWeb/CSS/StyleValues/AngleStyleValue.h>
+#include <LibWeb/CSS/StyleValues/LengthStyleValue.h>
+#include <LibWeb/CSS/StyleValues/NumberStyleValue.h>
 #include <LibWeb/CSS/StyleValues/PercentageStyleValue.h>
+#include <LibWeb/CSS/Transformation.h>
 
 namespace Web::CSS {
 
+Transformation TransformationStyleValue::to_transformation() const
+{
+    auto function_metadata = transform_function_metadata(m_properties.transform_function);
+    Vector<TransformValue> values;
+    size_t argument_index = 0;
+    for (auto& transformation_value : m_properties.values) {
+        if (transformation_value->is_calculated()) {
+            auto& calculated = transformation_value->as_calculated();
+            if (calculated.resolves_to_length_percentage()) {
+                values.append(LengthPercentage { calculated });
+            } else if (calculated.resolves_to_percentage()) {
+                // FIXME: Maybe transform this for loop to always check the metadata for the correct types
+                if (function_metadata.parameters[argument_index].type == TransformFunctionParameterType::NumberPercentage) {
+                    values.append(NumberPercentage { calculated.resolve_percentage().value() });
+                } else {
+                    values.append(LengthPercentage { calculated.resolve_percentage().value() });
+                }
+            } else if (calculated.resolves_to_number()) {
+                values.append({ Number(Number::Type::Number, calculated.resolve_number().value()) });
+            } else if (calculated.resolves_to_angle()) {
+                values.append({ calculated.resolve_angle().value() });
+            } else {
+                dbgln("FIXME: Unsupported calc value in transform! {}", calculated.to_string(SerializationMode::Normal));
+            }
+        } else if (transformation_value->is_length()) {
+            values.append({ transformation_value->as_length().length() });
+        } else if (transformation_value->is_percentage()) {
+            if (function_metadata.parameters[argument_index].type == TransformFunctionParameterType::NumberPercentage) {
+                values.append(NumberPercentage { transformation_value->as_percentage().percentage() });
+            } else {
+                values.append(LengthPercentage { transformation_value->as_percentage().percentage() });
+            }
+        } else if (transformation_value->is_number()) {
+            values.append({ Number(Number::Type::Number, transformation_value->as_number().number()) });
+        } else if (transformation_value->is_angle()) {
+            values.append({ transformation_value->as_angle().angle() });
+        } else {
+            dbgln("FIXME: Unsupported value in transform! {}", transformation_value->to_string(SerializationMode::Normal));
+        }
+        argument_index++;
+    }
+    return Transformation { m_properties.transform_function, move(values) };
+}
+
 String TransformationStyleValue::to_string(SerializationMode mode) const
 {
     StringBuilder builder;
diff --git a/Libraries/LibWeb/CSS/StyleValues/TransformationStyleValue.h b/Libraries/LibWeb/CSS/StyleValues/TransformationStyleValue.h
index 6f5ce43fdc4..0fd438fab19 100644
--- a/Libraries/LibWeb/CSS/StyleValues/TransformationStyleValue.h
+++ b/Libraries/LibWeb/CSS/StyleValues/TransformationStyleValue.h
@@ -25,6 +25,8 @@ public:
     TransformFunction transform_function() const { return m_properties.transform_function; }
     StyleValueVector const& values() const { return m_properties.values; }
 
+    Transformation to_transformation() const;
+
     virtual String to_string(SerializationMode) const override;
 
     bool properties_equal(TransformationStyleValue const& other) const { return m_properties == other.m_properties; }