LibWeb: Generate the CSS::ValueID enum and its helper functions

11 files changed, 421 insertions, 550 deletions

diff --git a/Libraries/LibWeb/CMakeLists.txt b/Libraries/LibWeb/CMakeLists.txt
index a7cba5633b..64b65d577a 100644
--- a/Libraries/LibWeb/CMakeLists.txt
+++ b/Libraries/LibWeb/CMakeLists.txt
@@ -30,6 +30,8 @@ set(SOURCES
     CSS/StyleSheet.cpp
     CSS/StyleSheetList.cpp
     CSS/StyleValue.cpp
+    CSS/ValueID.cpp
+    CSS/ValueID.h
     DOM/CharacterData.cpp
     DOM/CharacterData.idl
     DOM/Comment.cpp
@@ -357,6 +359,24 @@ add_custom_command(
 )
 
 add_custom_command(
+    OUTPUT CSS/ValueID.h
+    COMMAND ${write_if_different} CSS/ValueID.h CodeGenerators/Generate_CSS_ValueID_h ${CMAKE_CURRENT_SOURCE_DIR}/CSS/Identifiers.json
+    VERBATIM
+    DEPENDS Generate_CSS_ValueID_h
+    MAIN_DEPENDENCY CSS/Identifiers.json
+)
+add_custom_target(generate_ValueID.h DEPENDS CSS/ValueID.h)
+
+add_custom_command(
+    OUTPUT CSS/ValueID.cpp
+    COMMAND /bin/mkdir -p CSS
+    COMMAND ${write_if_different} CSS/ValueID.cpp CodeGenerators/Generate_CSS_ValueID_cpp ${CMAKE_CURRENT_SOURCE_DIR}/CSS/Identifiers.json
+    VERBATIM
+    DEPENDS Generate_CSS_ValueID_cpp
+    MAIN_DEPENDENCY CSS/Identifiers.json
+)
+
+add_custom_command(
     OUTPUT CSS/DefaultStyleSheetSource.cpp
     COMMAND ${write_if_different} CSS/DefaultStyleSheetSource.cpp ${CMAKE_CURRENT_SOURCE_DIR}/Scripts/GenerateStyleSheetSource.sh default_stylesheet_source ${CMAKE_CURRENT_SOURCE_DIR}/CSS/Default.css
     VERBATIM
diff --git a/Libraries/LibWeb/CSS/Identifiers.json b/Libraries/LibWeb/CSS/Identifiers.json
new file mode 100644
index 0000000000..cac40af8fd
--- /dev/null
+++ b/Libraries/LibWeb/CSS/Identifiers.json
@@ -0,0 +1,119 @@
+[
+  "-libweb-center",
+  "-libweb-link",
+  "-libweb-palette-active-link",
+  "-libweb-palette-active-window-border1",
+  "-libweb-palette-active-window-border2",
+  "-libweb-palette-active-window-title",
+  "-libweb-palette-base",
+  "-libweb-palette-base-text",
+  "-libweb-palette-button",
+  "-libweb-palette-button-text",
+  "-libweb-palette-desktop-background",
+  "-libweb-palette-focus-outline",
+  "-libweb-palette-highlight-window-border1",
+  "-libweb-palette-highlight-window-border2",
+  "-libweb-palette-highlight-window-title",
+  "-libweb-palette-hover-highlight",
+  "-libweb-palette-inactive-selection",
+  "-libweb-palette-inactive-selection-text",
+  "-libweb-palette-inactive-window-border1",
+  "-libweb-palette-inactive-window-border2",
+  "-libweb-palette-inactive-window-title",
+  "-libweb-palette-link",
+  "-libweb-palette-menu-base",
+  "-libweb-palette-menu-base-text",
+  "-libweb-palette-menu-selection",
+  "-libweb-palette-menu-selection-text",
+  "-libweb-palette-menu-stripe",
+  "-libweb-palette-moving-window-border1",
+  "-libweb-palette-moving-window-border2",
+  "-libweb-palette-moving-window-title",
+  "-libweb-palette-rubber-band-border",
+  "-libweb-palette-rubber-band-fill",
+  "-libweb-palette-ruler",
+  "-libweb-palette-ruler-active-text",
+  "-libweb-palette-ruler-border",
+  "-libweb-palette-ruler-inactive-text",
+  "-libweb-palette-selection",
+  "-libweb-palette-selection-text",
+  "-libweb-palette-syntax-comment",
+  "-libweb-palette-syntax-control-keyword",
+  "-libweb-palette-syntax-identifier",
+  "-libweb-palette-syntax-keyword",
+  "-libweb-palette-syntax-number",
+  "-libweb-palette-syntax-operator",
+  "-libweb-palette-syntax-preprocessor-statement",
+  "-libweb-palette-syntax-preprocessor-value",
+  "-libweb-palette-syntax-punctuation",
+  "-libweb-palette-syntax-string",
+  "-libweb-palette-syntax-type",
+  "-libweb-palette-text-cursor",
+  "-libweb-palette-threed-highlight",
+  "-libweb-palette-threed-shadow1",
+  "-libweb-palette-threed-shadow2",
+  "-libweb-palette-visited-link",
+  "-libweb-palette-window",
+  "-libweb-palette-window-text",
+  "absolute",
+  "blink",
+  "block",
+  "bold",
+  "bolder",
+  "both",
+  "capitalize",
+  "center",
+  "circle",
+  "dashed",
+  "decimal",
+  "disc",
+  "dotted",
+  "double",
+  "fixed",
+  "full-size-kana",
+  "full-width",
+  "groove",
+  "hidden",
+  "inline",
+  "inline-block",
+  "inset",
+  "justify",
+  "large",
+  "larger",
+  "left",
+  "lighter",
+  "line-through",
+  "list-item",
+  "lowercase",
+  "medium",
+  "none",
+  "normal",
+  "nowrap",
+  "outset",
+  "overline",
+  "pre",
+  "pre-line",
+  "pre-wrap",
+  "relative",
+  "ridge",
+  "right",
+  "small",
+  "smaller",
+  "solid",
+  "square",
+  "static",
+  "sticky",
+  "table",
+  "table-cell",
+  "table-footer-group",
+  "table-header-group",
+  "table-row",
+  "table-row-group",
+  "underline",
+  "uppercase",
+  "x-large",
+  "x-small",
+  "xx-large",
+  "xx-small",
+  "xxx-large"
+]
diff --git a/Libraries/LibWeb/CSS/Parser/CSSParser.cpp b/Libraries/LibWeb/CSS/Parser/CSSParser.cpp
index 4caafd9098..d615f0abc9 100644
--- a/Libraries/LibWeb/CSS/Parser/CSSParser.cpp
+++ b/Libraries/LibWeb/CSS/Parser/CSSParser.cpp
@@ -71,119 +71,6 @@ bool ParsingContext::in_quirks_mode() const
 
 }
 
-static Optional<CSS::ValueID> value_id_for_palette_string(const StringView& string)
-{
-    if (string.equals_ignoring_case("desktop-background"))
-        return CSS::ValueID::VendorSpecificPaletteDesktopBackground;
-    if (string.equals_ignoring_case("active-window-border1"))
-        return CSS::ValueID::VendorSpecificPaletteActiveWindowBorder1;
-    if (string.equals_ignoring_case("active-window-border2"))
-        return CSS::ValueID::VendorSpecificPaletteActiveWindowBorder2;
-    if (string.equals_ignoring_case("active-window-title"))
-        return CSS::ValueID::VendorSpecificPaletteActiveWindowTitle;
-    if (string.equals_ignoring_case("inactive-window-border1"))
-        return CSS::ValueID::VendorSpecificPaletteInactiveWindowBorder1;
-    if (string.equals_ignoring_case("inactive-window-border2"))
-        return CSS::ValueID::VendorSpecificPaletteInactiveWindowBorder2;
-    if (string.equals_ignoring_case("inactive-window-title"))
-        return CSS::ValueID::VendorSpecificPaletteInactiveWindowTitle;
-    if (string.equals_ignoring_case("moving-window-border1"))
-        return CSS::ValueID::VendorSpecificPaletteMovingWindowBorder1;
-    if (string.equals_ignoring_case("moving-window-border2"))
-        return CSS::ValueID::VendorSpecificPaletteMovingWindowBorder2;
-    if (string.equals_ignoring_case("moving-window-title"))
-        return CSS::ValueID::VendorSpecificPaletteMovingWindowTitle;
-    if (string.equals_ignoring_case("highlight-window-border1"))
-        return CSS::ValueID::VendorSpecificPaletteHighlightWindowBorder1;
-    if (string.equals_ignoring_case("highlight-window-border2"))
-        return CSS::ValueID::VendorSpecificPaletteHighlightWindowBorder2;
-    if (string.equals_ignoring_case("highlight-window-title"))
-        return CSS::ValueID::VendorSpecificPaletteHighlightWindowTitle;
-    if (string.equals_ignoring_case("menu-stripe"))
-        return CSS::ValueID::VendorSpecificPaletteMenuStripe;
-    if (string.equals_ignoring_case("menu-base"))
-        return CSS::ValueID::VendorSpecificPaletteMenuBase;
-    if (string.equals_ignoring_case("menu-base-text"))
-        return CSS::ValueID::VendorSpecificPaletteMenuBaseText;
-    if (string.equals_ignoring_case("menu-selection"))
-        return CSS::ValueID::VendorSpecificPaletteMenuSelection;
-    if (string.equals_ignoring_case("menu-selection-text"))
-        return CSS::ValueID::VendorSpecificPaletteMenuSelectionText;
-    if (string.equals_ignoring_case("window"))
-        return CSS::ValueID::VendorSpecificPaletteWindow;
-    if (string.equals_ignoring_case("window-text"))
-        return CSS::ValueID::VendorSpecificPaletteWindowText;
-    if (string.equals_ignoring_case("button"))
-        return CSS::ValueID::VendorSpecificPaletteButton;
-    if (string.equals_ignoring_case("button-text"))
-        return CSS::ValueID::VendorSpecificPaletteButtonText;
-    if (string.equals_ignoring_case("base"))
-        return CSS::ValueID::VendorSpecificPaletteBase;
-    if (string.equals_ignoring_case("base-text"))
-        return CSS::ValueID::VendorSpecificPaletteBaseText;
-    if (string.equals_ignoring_case("threed-highlight"))
-        return CSS::ValueID::VendorSpecificPaletteThreedHighlight;
-    if (string.equals_ignoring_case("threed-shadow1"))
-        return CSS::ValueID::VendorSpecificPaletteThreedShadow1;
-    if (string.equals_ignoring_case("threed-shadow2"))
-        return CSS::ValueID::VendorSpecificPaletteThreedShadow2;
-    if (string.equals_ignoring_case("hover-highlight"))
-        return CSS::ValueID::VendorSpecificPaletteHoverHighlight;
-    if (string.equals_ignoring_case("selection"))
-        return CSS::ValueID::VendorSpecificPaletteSelection;
-    if (string.equals_ignoring_case("selection-text"))
-        return CSS::ValueID::VendorSpecificPaletteSelectionText;
-    if (string.equals_ignoring_case("inactive-selection"))
-        return CSS::ValueID::VendorSpecificPaletteInactiveSelection;
-    if (string.equals_ignoring_case("inactive-selection-text"))
-        return CSS::ValueID::VendorSpecificPaletteInactiveSelectionText;
-    if (string.equals_ignoring_case("rubber-band-fill"))
-        return CSS::ValueID::VendorSpecificPaletteRubberBandFill;
-    if (string.equals_ignoring_case("rubber-band-border"))
-        return CSS::ValueID::VendorSpecificPaletteRubberBandBorder;
-    if (string.equals_ignoring_case("link"))
-        return CSS::ValueID::VendorSpecificPaletteLink;
-    if (string.equals_ignoring_case("active-link"))
-        return CSS::ValueID::VendorSpecificPaletteActiveLink;
-    if (string.equals_ignoring_case("visited-link"))
-        return CSS::ValueID::VendorSpecificPaletteVisitedLink;
-    if (string.equals_ignoring_case("ruler"))
-        return CSS::ValueID::VendorSpecificPaletteRuler;
-    if (string.equals_ignoring_case("ruler-border"))
-        return CSS::ValueID::VendorSpecificPaletteRulerBorder;
-    if (string.equals_ignoring_case("ruler-active-text"))
-        return CSS::ValueID::VendorSpecificPaletteRulerActiveText;
-    if (string.equals_ignoring_case("ruler-inactive-text"))
-        return CSS::ValueID::VendorSpecificPaletteRulerInactiveText;
-    if (string.equals_ignoring_case("text-cursor"))
-        return CSS::ValueID::VendorSpecificPaletteTextCursor;
-    if (string.equals_ignoring_case("focus-outline"))
-        return CSS::ValueID::VendorSpecificPaletteFocusOutline;
-    if (string.equals_ignoring_case("syntax-comment"))
-        return CSS::ValueID::VendorSpecificPaletteSyntaxComment;
-    if (string.equals_ignoring_case("syntax-number"))
-        return CSS::ValueID::VendorSpecificPaletteSyntaxNumber;
-    if (string.equals_ignoring_case("syntax-string"))
-        return CSS::ValueID::VendorSpecificPaletteSyntaxString;
-    if (string.equals_ignoring_case("syntax-type"))
-        return CSS::ValueID::VendorSpecificPaletteSyntaxType;
-    if (string.equals_ignoring_case("syntax-punctuation"))
-        return CSS::ValueID::VendorSpecificPaletteSyntaxPunctuation;
-    if (string.equals_ignoring_case("syntax-operator"))
-        return CSS::ValueID::VendorSpecificPaletteSyntaxOperator;
-    if (string.equals_ignoring_case("syntax-keyword"))
-        return CSS::ValueID::VendorSpecificPaletteSyntaxKeyword;
-    if (string.equals_ignoring_case("syntax-control-keyword"))
-        return CSS::ValueID::VendorSpecificPaletteSyntaxControlKeyword;
-    if (string.equals_ignoring_case("syntax-identifier"))
-        return CSS::ValueID::VendorSpecificPaletteSyntaxIdentifier;
-    if (string.equals_ignoring_case("syntax-preprocessor-statement"))
-        return CSS::ValueID::VendorSpecificPaletteSyntaxPreprocessorStatement;
-    if (string.equals_ignoring_case("syntax-preprocessor-value"))
-        return CSS::ValueID::VendorSpecificPaletteSyntaxPreprocessorValue;
-    return {};
-}
-
 static Optional<Color> parse_css_color(const CSS::ParsingContext&, const StringView& view)
 {
     if (view.equals_ignoring_case("transparent"))
@@ -342,141 +229,6 @@ static bool takes_integer_value(CSS::PropertyID property_id)
     return property_id == CSS::PropertyID::ZIndex || property_id == CSS::PropertyID::FontWeight;
 }
 
-static Optional<CSS::ValueID> value_id_from_string(const String& string)
-{
-    // FIXME: Handle all identifiers
-    // FIXME: Generate this code
-    if (string.equals_ignoring_case("bold"))
-        return CSS::ValueID::Bold;
-    if (string.equals_ignoring_case("bolder"))
-        return CSS::ValueID::Bolder;
-    if (string.equals_ignoring_case("center"))
-        return CSS::ValueID::Center;
-    if (string.equals_ignoring_case("justify"))
-        return CSS::ValueID::Justify;
-    if (string.equals_ignoring_case("large"))
-        return CSS::ValueID::Large;
-    if (string.equals_ignoring_case("larger"))
-        return CSS::ValueID::Larger;
-    if (string.equals_ignoring_case("left"))
-        return CSS::ValueID::Left;
-    if (string.equals_ignoring_case("lighter"))
-        return CSS::ValueID::Lighter;
-    if (string.equals_ignoring_case("medium"))
-        return CSS::ValueID::Medium;
-    if (string.equals_ignoring_case("normal"))
-        return CSS::ValueID::Normal;
-    if (string.equals_ignoring_case("small"))
-        return CSS::ValueID::Small;
-    if (string.equals_ignoring_case("right"))
-        return CSS::ValueID::Right;
-    if (string.equals_ignoring_case("smaller"))
-        return CSS::ValueID::Smaller;
-    if (string.equals_ignoring_case("x-large"))
-        return CSS::ValueID::XLarge;
-    if (string.equals_ignoring_case("x-small"))
-        return CSS::ValueID::XSmall;
-    if (string.equals_ignoring_case("xx-large"))
-        return CSS::ValueID::XxLarge;
-    if (string.equals_ignoring_case("xx-small"))
-        return CSS::ValueID::XxSmall;
-    if (string.equals_ignoring_case("xxx-large"))
-        return CSS::ValueID::XxxLarge;
-    if (string.equals_ignoring_case("-libweb-center"))
-        return CSS::ValueID::VendorSpecificCenter;
-    if (string.equals_ignoring_case("-libweb-link"))
-        return CSS::ValueID::VendorSpecificLink;
-    if (string.equals_ignoring_case("static"))
-        return CSS::ValueID::Static;
-    if (string.equals_ignoring_case("relative"))
-        return CSS::ValueID::Relative;
-    if (string.equals_ignoring_case("absolute"))
-        return CSS::ValueID::Absolute;
-    if (string.equals_ignoring_case("fixed"))
-        return CSS::ValueID::Fixed;
-    if (string.equals_ignoring_case("sticky"))
-        return CSS::ValueID::Sticky;
-    if (string.equals_ignoring_case("none"))
-        return CSS::ValueID::None;
-    if (string.equals_ignoring_case("both"))
-        return CSS::ValueID::Both;
-    if (string.equals_ignoring_case("hidden"))
-        return CSS::ValueID::Hidden;
-    if (string.equals_ignoring_case("dotted"))
-        return CSS::ValueID::Dotted;
-    if (string.equals_ignoring_case("dashed"))
-        return CSS::ValueID::Dashed;
-    if (string.equals_ignoring_case("solid"))
-        return CSS::ValueID::Solid;
-    if (string.equals_ignoring_case("double"))
-        return CSS::ValueID::Double;
-    if (string.equals_ignoring_case("groove"))
-        return CSS::ValueID::Groove;
-    if (string.equals_ignoring_case("ridge"))
-        return CSS::ValueID::Ridge;
-    if (string.equals_ignoring_case("inset"))
-        return CSS::ValueID::Inset;
-    if (string.equals_ignoring_case("outset"))
-        return CSS::ValueID::Outset;
-    if (string.equals_ignoring_case("nowrap"))
-        return CSS::ValueID::Nowrap;
-    if (string.equals_ignoring_case("pre"))
-        return CSS::ValueID::Pre;
-    if (string.equals_ignoring_case("pre-line"))
-        return CSS::ValueID::PreLine;
-    if (string.equals_ignoring_case("pre-wrap"))
-        return CSS::ValueID::PreWrap;
-    if (string.equals_ignoring_case("block"))
-        return CSS::ValueID::Block;
-    if (string.equals_ignoring_case("inline"))
-        return CSS::ValueID::Inline;
-    if (string.equals_ignoring_case("inline-block"))
-        return CSS::ValueID::InlineBlock;
-    if (string.equals_ignoring_case("list-item"))
-        return CSS::ValueID::ListItem;
-    if (string.equals_ignoring_case("table"))
-        return CSS::ValueID::Table;
-    if (string.equals_ignoring_case("table-row"))
-        return CSS::ValueID::TableRow;
-    if (string.equals_ignoring_case("table-cell"))
-        return CSS::ValueID::TableCell;
-    if (string.equals_ignoring_case("table-row-group"))
-        return CSS::ValueID::TableRowGroup;
-    if (string.equals_ignoring_case("table-header-group"))
-        return CSS::ValueID::TableHeaderGroup;
-    if (string.equals_ignoring_case("table-footer-group"))
-        return CSS::ValueID::TableFooterGroup;
-    if (string.equals_ignoring_case("underline"))
-        return CSS::ValueID::Underline;
-    if (string.equals_ignoring_case("overline"))
-        return CSS::ValueID::Overline;
-    if (string.equals_ignoring_case("line-through"))
-        return CSS::ValueID::LineThrough;
-    if (string.equals_ignoring_case("blink"))
-        return CSS::ValueID::Blink;
-    if (string.equals_ignoring_case("capitalize"))
-        return CSS::ValueID::Capitalize;
-    if (string.equals_ignoring_case("uppercase"))
-        return CSS::ValueID::Uppercase;
-    if (string.equals_ignoring_case("lowercase"))
-        return CSS::ValueID::Lowercase;
-    if (string.equals_ignoring_case("full-width"))
-        return CSS::ValueID::FullWidth;
-    if (string.equals_ignoring_case("full-size-kana"))
-        return CSS::ValueID::FullSizeKana;
-    if (string.equals_ignoring_case("disc"))
-        return CSS::ValueID::Disc;
-    if (string.equals_ignoring_case("circle"))
-        return CSS::ValueID::Circle;
-    if (string.equals_ignoring_case("square"))
-        return CSS::ValueID::Square;
-    if (string.equals_ignoring_case("decimal"))
-        return CSS::ValueID::Decimal;
-    if (string.starts_with("-libweb-palette-", CaseSensitivity::CaseInsensitive))
-        return value_id_for_palette_string(string.substring_view(16, string.length() - 16));
-    return {};
-}
-
 RefPtr<CSS::StyleValue> parse_css_value(const CSS::ParsingContext& context, const StringView& string, CSS::PropertyID property_id)
 {
     bool is_bad_length = false;
@@ -500,9 +252,9 @@ RefPtr<CSS::StyleValue> parse_css_value(const CSS::ParsingContext& context, cons
     if (string.equals_ignoring_case("auto"))
         return CSS::LengthStyleValue::create(CSS::Length::make_auto());
 
-    auto value_id = value_id_from_string(string);
-    if (value_id.has_value())
-        return CSS::IdentifierStyleValue::create(value_id.value());
+    auto value_id = CSS::value_id_from_string(string);
+    if (value_id != CSS::ValueID::Invalid)
+        return CSS::IdentifierStyleValue::create(value_id);
 
     auto color = parse_css_color(context, string);
     if (color.has_value())
diff --git a/Libraries/LibWeb/CSS/StyleProperties.cpp b/Libraries/LibWeb/CSS/StyleProperties.cpp
index d32d11ab2e..d6386234ca 100644
--- a/Libraries/LibWeb/CSS/StyleProperties.cpp
+++ b/Libraries/LibWeb/CSS/StyleProperties.cpp
@@ -281,8 +281,8 @@ Optional<CSS::TextAlign> StyleProperties::text_align() const
         return CSS::TextAlign::Right;
     case CSS::ValueID::Justify:
         return CSS::TextAlign::Justify;
-    case CSS::ValueID::VendorSpecificCenter:
-        return CSS::TextAlign::VendorSpecificCenter;
+    case CSS::ValueID::LibwebCenter:
+        return CSS::TextAlign::LibwebCenter;
     default:
         return {};
     }
diff --git a/Libraries/LibWeb/CSS/StyleValue.cpp b/Libraries/LibWeb/CSS/StyleValue.cpp
index 6c37d102f6..f961649bdd 100644
--- a/Libraries/LibWeb/CSS/StyleValue.cpp
+++ b/Libraries/LibWeb/CSS/StyleValue.cpp
@@ -47,241 +47,124 @@ StyleValue::~StyleValue()
 
 String IdentifierStyleValue::to_string() const
 {
-    switch (id()) {
-    case CSS::ValueID::Invalid:
-        return "(invalid)";
-    case CSS::ValueID::VendorSpecificLink:
-        return "-libweb-link";
-    case CSS::ValueID::VendorSpecificCenter:
-        return "-libweb-center";
-    case CSS::ValueID::VendorSpecificPaletteDesktopBackground:
-        return "-libweb-palette-desktop-background";
-    case CSS::ValueID::VendorSpecificPaletteActiveWindowBorder1:
-        return "-libweb-palette-active-window-border1";
-    case CSS::ValueID::VendorSpecificPaletteActiveWindowBorder2:
-        return "-libweb-palette-active-window-border2";
-    case CSS::ValueID::VendorSpecificPaletteActiveWindowTitle:
-        return "-libweb-palette-active-window-title";
-    case CSS::ValueID::VendorSpecificPaletteInactiveWindowBorder1:
-        return "-libweb-palette-inactive-window-border1";
-    case CSS::ValueID::VendorSpecificPaletteInactiveWindowBorder2:
-        return "-libweb-palette-inactive-window-border2";
-    case CSS::ValueID::VendorSpecificPaletteInactiveWindowTitle:
-        return "-libweb-palette-inactive-window-title";
-    case CSS::ValueID::VendorSpecificPaletteMovingWindowBorder1:
-        return "-libweb-palette-moving-window-border1";
-    case CSS::ValueID::VendorSpecificPaletteMovingWindowBorder2:
-        return "-libweb-palette-moving-window-border2";
-    case CSS::ValueID::VendorSpecificPaletteMovingWindowTitle:
-        return "-libweb-palette-moving-window-title";
-    case CSS::ValueID::VendorSpecificPaletteHighlightWindowBorder1:
-        return "-libweb-palette-highlight-window-border1";
-    case CSS::ValueID::VendorSpecificPaletteHighlightWindowBorder2:
-        return "-libweb-palette-highlight-window-border2";
-    case CSS::ValueID::VendorSpecificPaletteHighlightWindowTitle:
-        return "-libweb-palette-highlight-window-title";
-    case CSS::ValueID::VendorSpecificPaletteMenuStripe:
-        return "-libweb-palette-menu-stripe";
-    case CSS::ValueID::VendorSpecificPaletteMenuBase:
-        return "-libweb-palette-menu-base";
-    case CSS::ValueID::VendorSpecificPaletteMenuBaseText:
-        return "-libweb-palette-menu-base-text";
-    case CSS::ValueID::VendorSpecificPaletteMenuSelection:
-        return "-libweb-palette-menu-selection";
-    case CSS::ValueID::VendorSpecificPaletteMenuSelectionText:
-        return "-libweb-palette-menu-selection-text";
-    case CSS::ValueID::VendorSpecificPaletteWindow:
-        return "-libweb-palette-window";
-    case CSS::ValueID::VendorSpecificPaletteWindowText:
-        return "-libweb-palette-window-text";
-    case CSS::ValueID::VendorSpecificPaletteButton:
-        return "-libweb-palette-button";
-    case CSS::ValueID::VendorSpecificPaletteButtonText:
-        return "-libweb-palette-button-text";
-    case CSS::ValueID::VendorSpecificPaletteBase:
-        return "-libweb-palette-base";
-    case CSS::ValueID::VendorSpecificPaletteBaseText:
-        return "-libweb-palette-base-text";
-    case CSS::ValueID::VendorSpecificPaletteThreedHighlight:
-        return "-libweb-palette-threed-highlight";
-    case CSS::ValueID::VendorSpecificPaletteThreedShadow1:
-        return "-libweb-palette-threed-shadow1";
-    case CSS::ValueID::VendorSpecificPaletteThreedShadow2:
-        return "-libweb-palette-threed-shadow2";
-    case CSS::ValueID::VendorSpecificPaletteHoverHighlight:
-        return "-libweb-palette-hover-highlight";
-    case CSS::ValueID::VendorSpecificPaletteSelection:
-        return "-libweb-palette-selection";
-    case CSS::ValueID::VendorSpecificPaletteSelectionText:
-        return "-libweb-palette-selection-text";
-    case CSS::ValueID::VendorSpecificPaletteInactiveSelection:
-        return "-libweb-palette-inactive-selection";
-    case CSS::ValueID::VendorSpecificPaletteInactiveSelectionText:
-        return "-libweb-palette-inactive-selection-text";
-    case CSS::ValueID::VendorSpecificPaletteRubberBandFill:
-        return "-libweb-palette-rubber-band-fill";
-    case CSS::ValueID::VendorSpecificPaletteRubberBandBorder:
-        return "-libweb-palette-rubber-band-border";
-    case CSS::ValueID::VendorSpecificPaletteLink:
-        return "-libweb-palette-link";
-    case CSS::ValueID::VendorSpecificPaletteActiveLink:
-        return "-libweb-palette-active-link";
-    case CSS::ValueID::VendorSpecificPaletteVisitedLink:
-        return "-libweb-palette-visited-link";
-    case CSS::ValueID::VendorSpecificPaletteRuler:
-        return "-libweb-palette-ruler";
-    case CSS::ValueID::VendorSpecificPaletteRulerBorder:
-        return "-libweb-palette-ruler-border";
-    case CSS::ValueID::VendorSpecificPaletteRulerActiveText:
-        return "-libweb-palette-ruler-active-text";
-    case CSS::ValueID::VendorSpecificPaletteRulerInactiveText:
-        return "-libweb-palette-ruler-inactive-text";
-    case CSS::ValueID::VendorSpecificPaletteTextCursor:
-        return "-libweb-palette-text-cursor";
-    case CSS::ValueID::VendorSpecificPaletteFocusOutline:
-        return "-libweb-palette-focus-outline";
-    case CSS::ValueID::VendorSpecificPaletteSyntaxComment:
-        return "-libweb-palette-syntax-comment";
-    case CSS::ValueID::VendorSpecificPaletteSyntaxNumber:
-        return "-libweb-palette-syntax-number";
-    case CSS::ValueID::VendorSpecificPaletteSyntaxString:
-        return "-libweb-palette-syntax-string";
-    case CSS::ValueID::VendorSpecificPaletteSyntaxType:
-        return "-libweb-palette-syntax-type";
-    case CSS::ValueID::VendorSpecificPaletteSyntaxPunctuation:
-        return "-libweb-palette-syntax-punctuation";
-    case CSS::ValueID::VendorSpecificPaletteSyntaxOperator:
-        return "-libweb-palette-syntax-operator";
-    case CSS::ValueID::VendorSpecificPaletteSyntaxKeyword:
-        return "-libweb-palette-syntax-keyword";
-    case CSS::ValueID::VendorSpecificPaletteSyntaxControlKeyword:
-        return "-libweb-palette-syntax-control-keyword";
-    case CSS::ValueID::VendorSpecificPaletteSyntaxIdentifier:
-        return "-libweb-palette-syntax-identifier";
-    case CSS::ValueID::VendorSpecificPaletteSyntaxPreprocessorStatement:
-        return "-libweb-palette-syntax-preprocessor-statement";
-    case CSS::ValueID::VendorSpecificPaletteSyntaxPreprocessorValue:
-        return "-libweb-palette-syntax-preprocessor-value";
-    default:
-        return String::formatted("-fixme-css-value-id-{}", (int)id());
-    }
+    return CSS::string_from_value_id(m_id);
 }
 
 Color IdentifierStyleValue::to_color(const DOM::Document& document) const
 {
-    if (id() == CSS::ValueID::VendorSpecificLink)
+    if (id() == CSS::ValueID::LibwebLink)
         return document.link_color();
 
     ASSERT(document.page());
     auto palette = document.page()->palette();
     switch (id()) {
-    case CSS::ValueID::VendorSpecificPaletteDesktopBackground:
+    case CSS::ValueID::LibwebPaletteDesktopBackground:
         return palette.color(ColorRole::DesktopBackground);
-    case CSS::ValueID::VendorSpecificPaletteActiveWindowBorder1:
+    case CSS::ValueID::LibwebPaletteActiveWindowBorder1:
         return palette.color(ColorRole::ActiveWindowBorder1);
-    case CSS::ValueID::VendorSpecificPaletteActiveWindowBorder2:
+    case CSS::ValueID::LibwebPaletteActiveWindowBorder2:
         return palette.color(ColorRole::ActiveWindowBorder2);
-    case CSS::ValueID::VendorSpecificPaletteActiveWindowTitle:
+    case CSS::ValueID::LibwebPaletteActiveWindowTitle:
         return palette.color(ColorRole::ActiveWindowTitle);
-    case CSS::ValueID::VendorSpecificPaletteInactiveWindowBorder1:
+    case CSS::ValueID::LibwebPaletteInactiveWindowBorder1:
         return palette.color(ColorRole::InactiveWindowBorder1);
-    case CSS::ValueID::VendorSpecificPaletteInactiveWindowBorder2:
+    case CSS::ValueID::LibwebPaletteInactiveWindowBorder2:
         return palette.color(ColorRole::InactiveWindowBorder2);
-    case CSS::ValueID::VendorSpecificPaletteInactiveWindowTitle:
+    case CSS::ValueID::LibwebPaletteInactiveWindowTitle:
         return palette.color(ColorRole::InactiveWindowTitle);
-    case CSS::ValueID::VendorSpecificPaletteMovingWindowBorder1:
+    case CSS::ValueID::LibwebPaletteMovingWindowBorder1:
         return palette.color(ColorRole::MovingWindowBorder1);
-    case CSS::ValueID::VendorSpecificPaletteMovingWindowBorder2:
+    case CSS::ValueID::LibwebPaletteMovingWindowBorder2:
         return palette.color(ColorRole::MovingWindowBorder2);
-    case CSS::ValueID::VendorSpecificPaletteMovingWindowTitle:
+    case CSS::ValueID::LibwebPaletteMovingWindowTitle:
         return palette.color(ColorRole::MovingWindowTitle);
-    case CSS::ValueID::VendorSpecificPaletteHighlightWindowBorder1:
+    case CSS::ValueID::LibwebPaletteHighlightWindowBorder1:
         return palette.color(ColorRole::HighlightWindowBorder1);
-    case CSS::ValueID::VendorSpecificPaletteHighlightWindowBorder2:
+    case CSS::ValueID::LibwebPaletteHighlightWindowBorder2:
         return palette.color(ColorRole::HighlightWindowBorder2);
-    case CSS::ValueID::VendorSpecificPaletteHighlightWindowTitle:
+    case CSS::ValueID::LibwebPaletteHighlightWindowTitle:
         return palette.color(ColorRole::HighlightWindowTitle);
-    case CSS::ValueID::VendorSpecificPaletteMenuStripe:
+    case CSS::ValueID::LibwebPaletteMenuStripe:
         return palette.color(ColorRole::MenuStripe);
-    case CSS::ValueID::VendorSpecificPaletteMenuBase:
+    case CSS::ValueID::LibwebPaletteMenuBase:
         return palette.color(ColorRole::MenuBase);
-    case CSS::ValueID::VendorSpecificPaletteMenuBaseText:
+    case CSS::ValueID::LibwebPaletteMenuBaseText:
         return palette.color(ColorRole::MenuBaseText);
-    case CSS::ValueID::VendorSpecificPaletteMenuSelection:
+    case CSS::ValueID::LibwebPaletteMenuSelection:
         return palette.color(ColorRole::MenuSelection);
-    case CSS::ValueID::VendorSpecificPaletteMenuSelectionText:
+    case CSS::ValueID::LibwebPaletteMenuSelectionText:
         return palette.color(ColorRole::MenuSelectionText);
-    case CSS::ValueID::VendorSpecificPaletteWindow:
+    case CSS::ValueID::LibwebPaletteWindow:
         return palette.color(ColorRole::Window);
-    case CSS::ValueID::VendorSpecificPaletteWindowText:
+    case CSS::ValueID::LibwebPaletteWindowText:
         return palette.color(ColorRole::WindowText);
-    case CSS::ValueID::VendorSpecificPaletteButton:
+    case CSS::ValueID::LibwebPaletteButton:
         return palette.color(ColorRole::Button);
-    case CSS::ValueID::VendorSpecificPaletteButtonText:
+    case CSS::ValueID::LibwebPaletteButtonText:
         return palette.color(ColorRole::ButtonText);
-    case CSS::ValueID::VendorSpecificPaletteBase:
+    case CSS::ValueID::LibwebPaletteBase:
         return palette.color(ColorRole::Base);
-    case CSS::ValueID::VendorSpecificPaletteBaseText:
+    case CSS::ValueID::LibwebPaletteBaseText:
         return palette.color(ColorRole::BaseText);
-    case CSS::ValueID::VendorSpecificPaletteThreedHighlight:
+    case CSS::ValueID::LibwebPaletteThreedHighlight:
         return palette.color(ColorRole::ThreedHighlight);
-    case CSS::ValueID::VendorSpecificPaletteThreedShadow1:
+    case CSS::ValueID::LibwebPaletteThreedShadow1:
         return palette.color(ColorRole::ThreedShadow1);
-    case CSS::ValueID::VendorSpecificPaletteThreedShadow2:
+    case CSS::ValueID::LibwebPaletteThreedShadow2:
         return palette.color(ColorRole::ThreedShadow2);
-    case CSS::ValueID::VendorSpecificPaletteHoverHighlight:
+    case CSS::ValueID::LibwebPaletteHoverHighlight:
         return palette.color(ColorRole::HoverHighlight);
-    case CSS::ValueID::VendorSpecificPaletteSelection:
+    case CSS::ValueID::LibwebPaletteSelection:
         return palette.color(ColorRole::Selection);
-    case CSS::ValueID::VendorSpecificPaletteSelectionText:
+    case CSS::ValueID::LibwebPaletteSelectionText:
         return palette.color(ColorRole::SelectionText);
-    case CSS::ValueID::VendorSpecificPaletteInactiveSelection:
+    case CSS::ValueID::LibwebPaletteInactiveSelection:
         return palette.color(ColorRole::InactiveSelection);
-    case CSS::ValueID::VendorSpecificPaletteInactiveSelectionText:
+    case CSS::ValueID::LibwebPaletteInactiveSelectionText:
         return palette.color(ColorRole::InactiveSelectionText);
-    case CSS::ValueID::VendorSpecificPaletteRubberBandFill:
+    case CSS::ValueID::LibwebPaletteRubberBandFill:
         return palette.color(ColorRole::RubberBandFill);
-    case CSS::ValueID::VendorSpecificPaletteRubberBandBorder:
+    case CSS::ValueID::LibwebPaletteRubberBandBorder:
         return palette.color(ColorRole::RubberBandBorder);
-    case CSS::ValueID::VendorSpecificPaletteLink:
+    case CSS::ValueID::LibwebPaletteLink:
         return palette.color(ColorRole::Link);
-    case CSS::ValueID::VendorSpecificPaletteActiveLink:
+    case CSS::ValueID::LibwebPaletteActiveLink:
         return palette.color(ColorRole::ActiveLink);
-    case CSS::ValueID::VendorSpecificPaletteVisitedLink:
+    case CSS::ValueID::LibwebPaletteVisitedLink:
         return palette.color(ColorRole::VisitedLink);
-    case CSS::ValueID::VendorSpecificPaletteRuler:
+    case CSS::ValueID::LibwebPaletteRuler:
         return palette.color(ColorRole::Ruler);
-    case CSS::ValueID::VendorSpecificPaletteRulerBorder:
+    case CSS::ValueID::LibwebPaletteRulerBorder:
         return palette.color(ColorRole::RulerBorder);
-    case CSS::ValueID::VendorSpecificPaletteRulerActiveText:
+    case CSS::ValueID::LibwebPaletteRulerActiveText:
         return palette.color(ColorRole::RulerActiveText);
-    case CSS::ValueID::VendorSpecificPaletteRulerInactiveText:
+    case CSS::ValueID::LibwebPaletteRulerInactiveText:
         return palette.color(ColorRole::RulerInactiveText);
-    case CSS::ValueID::VendorSpecificPaletteTextCursor:
+    case CSS::ValueID::LibwebPaletteTextCursor:
         return palette.color(ColorRole::TextCursor);
-    case CSS::ValueID::VendorSpecificPaletteFocusOutline:
+    case CSS::ValueID::LibwebPaletteFocusOutline:
         return palette.color(ColorRole::FocusOutline);
-    case CSS::ValueID::VendorSpecificPaletteSyntaxComment:
+    case CSS::ValueID::LibwebPaletteSyntaxComment:
         return palette.color(ColorRole::SyntaxComment);
-    case CSS::ValueID::VendorSpecificPaletteSyntaxNumber:
+    case CSS::ValueID::LibwebPaletteSyntaxNumber:
         return palette.color(ColorRole::SyntaxNumber);
-    case CSS::ValueID::VendorSpecificPaletteSyntaxString:
+    case CSS::ValueID::LibwebPaletteSyntaxString:
         return palette.color(ColorRole::SyntaxString);
-    case CSS::ValueID::VendorSpecificPaletteSyntaxType:
+    case CSS::ValueID::LibwebPaletteSyntaxType:
         return palette.color(ColorRole::SyntaxType);
-    case CSS::ValueID::VendorSpecificPaletteSyntaxPunctuation:
+    case CSS::ValueID::LibwebPaletteSyntaxPunctuation:
         return palette.color(ColorRole::SyntaxPunctuation);
-    case CSS::ValueID::VendorSpecificPaletteSyntaxOperator:
+    case CSS::ValueID::LibwebPaletteSyntaxOperator:
         return palette.color(ColorRole::SyntaxOperator);
-    case CSS::ValueID::VendorSpecificPaletteSyntaxKeyword:
+    case CSS::ValueID::LibwebPaletteSyntaxKeyword:
         return palette.color(ColorRole::SyntaxKeyword);
-    case CSS::ValueID::VendorSpecificPaletteSyntaxControlKeyword:
+    case CSS::ValueID::LibwebPaletteSyntaxControlKeyword:
         return palette.color(ColorRole::SyntaxControlKeyword);
-    case CSS::ValueID::VendorSpecificPaletteSyntaxIdentifier:
+    case CSS::ValueID::LibwebPaletteSyntaxIdentifier:
         return palette.color(ColorRole::SyntaxIdentifier);
-    case CSS::ValueID::VendorSpecificPaletteSyntaxPreprocessorStatement:
+    case CSS::ValueID::LibwebPaletteSyntaxPreprocessorStatement:
         return palette.color(ColorRole::SyntaxPreprocessorStatement);
-    case CSS::ValueID::VendorSpecificPaletteSyntaxPreprocessorValue:
+    case CSS::ValueID::LibwebPaletteSyntaxPreprocessorValue:
         return palette.color(ColorRole::SyntaxPreprocessorValue);
     default:
         return {};
diff --git a/Libraries/LibWeb/CSS/StyleValue.h b/Libraries/LibWeb/CSS/StyleValue.h
index 2fba93a988..c0d66f731c 100644
--- a/Libraries/LibWeb/CSS/StyleValue.h
+++ b/Libraries/LibWeb/CSS/StyleValue.h
@@ -36,132 +36,12 @@
 #include <LibGfx/Color.h>
 #include <LibWeb/CSS/Length.h>
 #include <LibWeb/CSS/PropertyID.h>
+#include <LibWeb/CSS/ValueID.h>
 #include <LibWeb/Forward.h>
 #include <LibWeb/Loader/ImageResource.h>
 
 namespace Web::CSS {
 
-enum class ValueID {
-    Invalid,
-    VendorSpecificLink,
-    VendorSpecificPaletteDesktopBackground,
-    VendorSpecificPaletteActiveWindowBorder1,
-    VendorSpecificPaletteActiveWindowBorder2,
-    VendorSpecificPaletteActiveWindowTitle,
-    VendorSpecificPaletteInactiveWindowBorder1,
-    VendorSpecificPaletteInactiveWindowBorder2,
-    VendorSpecificPaletteInactiveWindowTitle,
-    VendorSpecificPaletteMovingWindowBorder1,
-    VendorSpecificPaletteMovingWindowBorder2,
-    VendorSpecificPaletteMovingWindowTitle,
-    VendorSpecificPaletteHighlightWindowBorder1,
-    VendorSpecificPaletteHighlightWindowBorder2,
-    VendorSpecificPaletteHighlightWindowTitle,
-    VendorSpecificPaletteMenuStripe,
-    VendorSpecificPaletteMenuBase,
-    VendorSpecificPaletteMenuBaseText,
-    VendorSpecificPaletteMenuSelection,
-    VendorSpecificPaletteMenuSelectionText,
-    VendorSpecificPaletteWindow,
-    VendorSpecificPaletteWindowText,
-    VendorSpecificPaletteButton,
-    VendorSpecificPaletteButtonText,
-    VendorSpecificPaletteBase,
-    VendorSpecificPaletteBaseText,
-    VendorSpecificPaletteThreedHighlight,
-    VendorSpecificPaletteThreedShadow1,
-    VendorSpecificPaletteThreedShadow2,
-    VendorSpecificPaletteHoverHighlight,
-    VendorSpecificPaletteSelection,
-    VendorSpecificPaletteSelectionText,
-    VendorSpecificPaletteInactiveSelection,
-    VendorSpecificPaletteInactiveSelectionText,
-    VendorSpecificPaletteRubberBandFill,
-    VendorSpecificPaletteRubberBandBorder,
-    VendorSpecificPaletteLink,
-    VendorSpecificPaletteActiveLink,
-    VendorSpecificPaletteVisitedLink,
-    VendorSpecificPaletteRuler,
-    VendorSpecificPaletteRulerBorder,
-    VendorSpecificPaletteRulerActiveText,
-    VendorSpecificPaletteRulerInactiveText,
-    VendorSpecificPaletteTextCursor,
-    VendorSpecificPaletteFocusOutline,
-    VendorSpecificPaletteSyntaxComment,
-    VendorSpecificPaletteSyntaxNumber,
-    VendorSpecificPaletteSyntaxString,
-    VendorSpecificPaletteSyntaxType,
-    VendorSpecificPaletteSyntaxPunctuation,
-    VendorSpecificPaletteSyntaxOperator,
-    VendorSpecificPaletteSyntaxKeyword,
-    VendorSpecificPaletteSyntaxControlKeyword,
-    VendorSpecificPaletteSyntaxIdentifier,
-    VendorSpecificPaletteSyntaxPreprocessorStatement,
-    VendorSpecificPaletteSyntaxPreprocessorValue,
-    Center,
-    Left,
-    Right,
-    Justify,
-    VendorSpecificCenter,
-    Bold,
-    Bolder,
-    Large,
-    Larger,
-    Lighter,
-    Medium,
-    Normal,
-    Small,
-    Smaller,
-    XLarge,
-    XSmall,
-    XxLarge,
-    XxSmall,
-    XxxLarge,
-    Static,
-    Relative,
-    Absolute,
-    Fixed,
-    Sticky,
-    Both,
-    None,
-    Hidden,
-    Dotted,
-    Dashed,
-    Solid,
-    Double,
-    Groove,
-    Ridge,
-    Inset,
-    Outset,
-    Nowrap,
-    Pre,
-    PreLine,
-    PreWrap,
-    Block,
-    Inline,
-    InlineBlock,
-    ListItem,
-    Table,
-    TableRow,
-    TableCell,
-    TableHeaderGroup,
-    TableRowGroup,
-    TableFooterGroup,
-    Underline,
-    Overline,
-    LineThrough,
-    Blink,
-    Capitalize,
-    Uppercase,
-    Lowercase,
-    FullWidth,
-    FullSizeKana,
-    Disc,
-    Circle,
-    Square,
-    Decimal,
-};
-
 enum class Position {
     Static,
     Relative,
@@ -175,7 +55,7 @@ enum class TextAlign {
     Center,
     Right,
     Justify,
-    VendorSpecificCenter,
+    LibwebCenter,
 };
 
 enum class TextDecorationLine {
diff --git a/Libraries/LibWeb/CodeGenerators/CMakeLists.txt b/Libraries/LibWeb/CodeGenerators/CMakeLists.txt
index 3e6f8372e0..b3c4073df9 100644
--- a/Libraries/LibWeb/CodeGenerators/CMakeLists.txt
+++ b/Libraries/LibWeb/CodeGenerators/CMakeLists.txt
@@ -1,7 +1,11 @@
 add_executable(Generate_CSS_PropertyID_h Generate_CSS_PropertyID_h.cpp)
 add_executable(Generate_CSS_PropertyID_cpp Generate_CSS_PropertyID_cpp.cpp)
+add_executable(Generate_CSS_ValueID_h Generate_CSS_ValueID_h.cpp)
+add_executable(Generate_CSS_ValueID_cpp Generate_CSS_ValueID_cpp.cpp)
 add_executable(WrapperGenerator WrapperGenerator.cpp)
 target_compile_options(WrapperGenerator PUBLIC -g)
 target_link_libraries(Generate_CSS_PropertyID_h LagomCore)
 target_link_libraries(Generate_CSS_PropertyID_cpp LagomCore)
+target_link_libraries(Generate_CSS_ValueID_h LagomCore)
+target_link_libraries(Generate_CSS_ValueID_cpp LagomCore)
 target_link_libraries(WrapperGenerator LagomCore)
diff --git a/Libraries/LibWeb/CodeGenerators/Generate_CSS_ValueID_cpp.cpp b/Libraries/LibWeb/CodeGenerators/Generate_CSS_ValueID_cpp.cpp
new file mode 100644
index 0000000000..4991a4040a
--- /dev/null
+++ b/Libraries/LibWeb/CodeGenerators/Generate_CSS_ValueID_cpp.cpp
@@ -0,0 +1,115 @@
+/*
+ * Copyright (c) 2020, Andreas Kling <kling@serenityos.org>
+ * All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions are met:
+ *
+ * 1. Redistributions of source code must retain the above copyright notice, this
+ *    list of conditions and the following disclaimer.
+ *
+ * 2. Redistributions in binary form must reproduce the above copyright notice,
+ *    this list of conditions and the following disclaimer in the documentation
+ *    and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+ * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+ * DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+ * FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ * DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+ * SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+ * CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+ * OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+#include <AK/ByteBuffer.h>
+#include <AK/JsonObject.h>
+#include <AK/SourceGenerator.h>
+#include <AK/StringBuilder.h>
+#include <LibCore/File.h>
+#include <ctype.h>
+#include <stdio.h>
+
+static String title_casify(const String& dashy_name)
+{
+    auto parts = dashy_name.split('-');
+    StringBuilder builder;
+    for (auto& part : parts) {
+        if (part.is_empty())
+            continue;
+        builder.append(toupper(part[0]));
+        if (part.length() == 1)
+            continue;
+        builder.append(part.substring_view(1, part.length() - 1));
+    }
+    return builder.to_string();
+}
+
+int main(int argc, char** argv)
+{
+    if (argc != 2) {
+        warnln("usage: {} <path/to/CSS/Identifiers.json>", argv[0]);
+        return 1;
+    }
+    auto file = Core::File::construct(argv[1]);
+    if (!file->open(Core::IODevice::ReadOnly))
+        return 1;
+
+    auto json = JsonValue::from_string(file->read_all());
+    ASSERT(json.has_value());
+    ASSERT(json.value().is_array());
+
+    StringBuilder builder;
+    SourceGenerator generator { builder };
+
+    generator.append(R"~~~(
+#include <AK/Assertions.h>
+#include <LibWeb/CSS/ValueID.h>
+
+namespace Web::CSS {
+
+ValueID value_id_from_string(const StringView& string)
+{
+)~~~");
+
+    json.value().as_array().for_each([&](auto& name) {
+        auto member_generator = generator.fork();
+        member_generator.set("name", name.to_string());
+        member_generator.set("name:titlecase", title_casify(name.to_string()));
+        member_generator.append(R"~~~(
+    if (string.equals_ignoring_case("@name@"))
+        return ValueID::@name:titlecase@;
+)~~~");
+    });
+
+    generator.append(R"~~~(
+    return ValueID::Invalid;
+}
+
+const char* string_from_value_id(ValueID value_id) {
+    switch (value_id) {
+)~~~");
+
+    json.value().as_array().for_each([&](auto& name) {
+        auto member_generator = generator.fork();
+        member_generator.set("name", name.to_string());
+        member_generator.set("name:titlecase", title_casify(name.to_string()));
+        member_generator.append(R"~~~(
+    case ValueID::@name:titlecase@:
+        return "@name@";
+        )~~~");
+    });
+
+    generator.append(R"~~~(
+    default:
+        return "(invalid CSS::ValueID)";
+    }
+}
+
+} // namespace Web::CSS
+)~~~");
+
+    outln("{}", generator.as_string_view());
+}
diff --git a/Libraries/LibWeb/CodeGenerators/Generate_CSS_ValueID_h.cpp b/Libraries/LibWeb/CodeGenerators/Generate_CSS_ValueID_h.cpp
new file mode 100644
index 0000000000..7c85ade83f
--- /dev/null
+++ b/Libraries/LibWeb/CodeGenerators/Generate_CSS_ValueID_h.cpp
@@ -0,0 +1,98 @@
+/*
+ * Copyright (c) 2020, Andreas Kling <kling@serenityos.org>
+ * All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions are met:
+ *
+ * 1. Redistributions of source code must retain the above copyright notice, this
+ *    list of conditions and the following disclaimer.
+ *
+ * 2. Redistributions in binary form must reproduce the above copyright notice,
+ *    this list of conditions and the following disclaimer in the documentation
+ *    and/or other materials provided with the distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+ * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+ * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+ * DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+ * FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+ * DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+ * SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+ * CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+ * OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+#include <AK/ByteBuffer.h>
+#include <AK/JsonObject.h>
+#include <AK/SourceGenerator.h>
+#include <AK/StringBuilder.h>
+#include <LibCore/File.h>
+#include <ctype.h>
+#include <stdio.h>
+
+static String title_casify(const String& dashy_name)
+{
+    auto parts = dashy_name.split('-');
+    StringBuilder builder;
+    for (auto& part : parts) {
+        if (part.is_empty())
+            continue;
+        builder.append(toupper(part[0]));
+        if (part.length() == 1)
+            continue;
+        builder.append(part.substring_view(1, part.length() - 1));
+    }
+    return builder.to_string();
+}
+
+int main(int argc, char** argv)
+{
+    if (argc != 2) {
+        warnln("usage: {} <path/to/CSS/Identifiers.json>", argv[0]);
+        return 1;
+    }
+    auto file = Core::File::construct(argv[1]);
+    if (!file->open(Core::IODevice::ReadOnly))
+        return 1;
+
+    auto json = JsonValue::from_string(file->read_all());
+    ASSERT(json.has_value());
+    ASSERT(json.value().is_array());
+
+    StringBuilder builder;
+    SourceGenerator generator { builder };
+    generator.append(R"~~~(
+#pragma once
+
+#include <AK/StringView.h>
+#include <AK/Traits.h>
+
+namespace Web::CSS {
+
+enum class ValueID {
+    Invalid,
+)~~~");
+
+    json.value().as_array().for_each([&](auto& name) {
+        auto member_generator = generator.fork();
+        member_generator.set("name:titlecase", title_casify(name.to_string()));
+
+        member_generator.append(R"~~~(
+    @name:titlecase@,
+)~~~");
+    });
+
+    generator.append(R"~~~(
+};
+
+ValueID value_id_from_string(const StringView&);
+const char* string_from_value_id(ValueID);
+
+}
+
+)~~~");
+
+    outln("{}", generator.as_string_view());
+}
diff --git a/Libraries/LibWeb/Layout/BlockFormattingContext.cpp b/Libraries/LibWeb/Layout/BlockFormattingContext.cpp
index f9d702299b..a79b351732 100644
--- a/Libraries/LibWeb/Layout/BlockFormattingContext.cpp
+++ b/Libraries/LibWeb/Layout/BlockFormattingContext.cpp
@@ -536,7 +536,7 @@ void BlockFormattingContext::place_block_level_non_replaced_element_in_normal_fl
         + box_model.padding.left
         + box_model.offset.left;
 
-    if (containing_block.style().text_align() == CSS::TextAlign::VendorSpecificCenter) {
+    if (containing_block.style().text_align() == CSS::TextAlign::LibwebCenter) {
         x = (containing_block.width() / 2) - child_box.width() / 2;
     }
 
diff --git a/Libraries/LibWeb/Layout/InlineFormattingContext.cpp b/Libraries/LibWeb/Layout/InlineFormattingContext.cpp
index 9819baacf7..b8d0b6cee0 100644
--- a/Libraries/LibWeb/Layout/InlineFormattingContext.cpp
+++ b/Libraries/LibWeb/Layout/InlineFormattingContext.cpp
@@ -127,7 +127,7 @@ void InlineFormattingContext::run(Box&, LayoutMode layout_mode)
 
         switch (text_align) {
         case CSS::TextAlign::Center:
-        case CSS::TextAlign::VendorSpecificCenter:
+        case CSS::TextAlign::LibwebCenter:
             x_offset += excess_horizontal_space / 2;
             break;
         case CSS::TextAlign::Right: