diff --git a/src/browser/Page.zig b/src/browser/Page.zig
index 058b4869..77e2d971 100644
--- a/src/browser/Page.zig
+++ b/src/browser/Page.zig
@@ -1542,10 +1542,10 @@ pub fn createElement(self: *Page, ns_: ?[]const u8, name: []const u8, attribute_
         },
         4 => switch (@as(u32, @bitCast(name[0..4].*))) {
             asUint("span") => return self.createHtmlElementT(
-                Element.Html.Generic,
+                Element.Html.Span,
                 namespace,
                 attribute_iterator,
-                .{ ._proto = undefined, ._tag_name = String.init(undefined, "span", .{}) catch unreachable, ._tag = .span },
+                .{ ._proto = undefined },
             ),
             asUint("meta") => return self.createHtmlElementT(
                 Element.Html.Meta,
diff --git a/src/browser/js/bridge.zig b/src/browser/js/bridge.zig
index b298dedb..76177ece 100644
--- a/src/browser/js/bridge.zig
+++ b/src/browser/js/bridge.zig
@@ -557,6 +557,7 @@ pub const JsApis = flattenTypes(&.{
     @import("../webapi/element/html/Script.zig"),
     @import("../webapi/element/html/Select.zig"),
     @import("../webapi/element/html/Slot.zig"),
+    @import("../webapi/element/html/Span.zig"),
     @import("../webapi/element/html/Style.zig"),
     @import("../webapi/element/html/Template.zig"),
     @import("../webapi/element/html/TextArea.zig"),
diff --git a/src/browser/webapi/Element.zig b/src/browser/webapi/Element.zig
index e6418e4e..75f86a69 100644
--- a/src/browser/webapi/Element.zig
+++ b/src/browser/webapi/Element.zig
@@ -203,6 +203,7 @@ pub fn getTagNameLower(self: *const Element) []const u8 {
                 .script => "script",
                 .select => "select",
                 .slot => "slot",
+                .span => "span",
                 .style => "style",
                 .template => "template",
                 .textarea => "textarea",
@@ -256,6 +257,7 @@ pub fn getTagNameSpec(self: *const Element, buf: []u8) []const u8 {
                 .script => "SCRIPT",
                 .select => "SELECT",
                 .slot => "SLOT",
+                .span => "SPAN",
                 .style => "STYLE",
                 .template => "TEMPLATE",
                 .textarea => "TEXTAREA",
@@ -1085,6 +1087,7 @@ pub fn getTag(self: *const Element) Tag {
             .script => .script,
             .select => .select,
             .slot => .slot,
+            .span => .span,
             .option => .option,
             .template => .template,
             .textarea => .textarea,
diff --git a/src/browser/webapi/css/CSSStyleDeclaration.zig b/src/browser/webapi/css/CSSStyleDeclaration.zig
index 17186543..ba695bec 100644
--- a/src/browser/webapi/css/CSSStyleDeclaration.zig
+++ b/src/browser/webapi/css/CSSStyleDeclaration.zig
@@ -217,7 +217,7 @@ fn getDefaultDisplay(element: *const Element) []const u8 {
     switch (element._type) {
         .html => |html| {
             return switch (html._type) {
-                .anchor, .br => "inline",
+                .anchor, .br, .span => "inline",
                 .body, .div, .p, .heading, .form, .button, .canvas, .dialog, .embed, .head, .html, .hr, .iframe, .img, .input, .li, .link, .meta, .ol, .option, .script, .select, .slot, .style, .template, .textarea, .title, .ul, .media => "block",
                 .generic, .custom, .unknown, .data => blk: {
                     const tag = element.getTagNameLower();
diff --git a/src/browser/webapi/element/Html.zig b/src/browser/webapi/element/Html.zig
index 7bab0f3e..239cabbe 100644
--- a/src/browser/webapi/element/Html.zig
+++ b/src/browser/webapi/element/Html.zig
@@ -53,6 +53,7 @@ pub const Paragraph = @import("html/Paragraph.zig");
 pub const Script = @import("html/Script.zig");
 pub const Select = @import("html/Select.zig");
 pub const Slot = @import("html/Slot.zig");
+pub const Span = @import("html/Span.zig");
 pub const Style = @import("html/Style.zig");
 pub const Template = @import("html/Template.zig");
 pub const TextArea = @import("html/TextArea.zig");
@@ -101,6 +102,7 @@ pub const Type = union(enum) {
     script: *Script,
     select: *Select,
     slot: *Slot,
+    span: *Span,
     style: *Style,
     template: *Template,
     textarea: *TextArea,
@@ -158,6 +160,7 @@ pub fn className(self: *const HtmlElement) []const u8 {
         .script => "[object HTMLScriptElement]",
         .select => "[object HTMLSelectElement]",
         .slot => "[object HTMLSlotElement]",
+        .span => "[object HTMLSpanElement]",
         .style => "[object HTMLSyleElement]",
         .template => "[object HTMLTemplateElement]",
         .textarea => "[object HTMLTextAreaElement]",
diff --git a/src/browser/webapi/element/html/Span.zig b/src/browser/webapi/element/html/Span.zig
new file mode 100644
index 00000000..8ba4fec3
--- /dev/null
+++ b/src/browser/webapi/element/html/Span.zig
@@ -0,0 +1,25 @@
+const js = @import("../../../js/js.zig");
+const Node = @import("../../Node.zig");
+const Element = @import("../../Element.zig");
+const HtmlElement = @import("../Html.zig");
+
+const Span = @This();
+
+_proto: *HtmlElement,
+
+pub fn asElement(self: *Span) *Element {
+    return self._proto._proto;
+}
+pub fn asNode(self: *Span) *Node {
+    return self.asElement().asNode();
+}
+
+pub const JsApi = struct {
+    pub const bridge = js.Bridge(Span);
+
+    pub const Meta = struct {
+        pub const name = "HTMLSpanElement";
+        pub const prototype_chain = bridge.prototypeChain();
+        pub var class_id: bridge.ClassId = undefined;
+    };
+};