diff --git a/src/ui/primitives/text.rs b/src/ui/primitives/text.rs
index d57f132..3d4e093 100644
--- a/src/ui/primitives/text.rs
+++ b/src/ui/primitives/text.rs
@@ -1,5 +1,5 @@
 use crate::ui::{UIWidget, color::UIColor};
-use maud::{Markup, Render, html};
+use maud::{Markup, PreEscaped, Render};
 
 use super::{Nothing, space::ScreenValue};
 
@@ -11,6 +11,7 @@ pub fn Text(txt: &str) -> TextWidget {
         inner: None,
         txt: txt.to_string(),
         family: String::new(),
+        title: None,
         font: String::new(),
         color: String::new(),
         style: Vec::new(),
@@ -30,15 +31,22 @@ pub fn Text(txt: &str) -> TextWidget {
         align: None,
         vert_align: None,
         list_style: None,
-        span: false,
+        kind: TextKind::Paragraph,
     }
 }
 
+enum TextKind {
+    Paragraph,
+    Span,
+    Pre,
+}
+
 #[allow(non_snake_case)]
 /// HTML `<p>` Paragraph
 pub fn Paragraph<T: UIWidget + 'static>(inner: T) -> TextWidget {
     TextWidget {
         inner: Some(Box::new(inner)),
+        title: None,
         font: String::new(),
         family: String::new(),
         color: String::new(),
@@ -60,7 +68,7 @@ pub fn Paragraph<T: UIWidget + 'static>(inner: T) -> TextWidget {
         list_style: None,
         clamp: None,
         align: None,
-        span: false,
+        kind: TextKind::Paragraph,
     }
 }
 
@@ -70,6 +78,7 @@ pub fn Paragraph<T: UIWidget + 'static>(inner: T) -> TextWidget {
 pub fn Span(txt: &str) -> TextWidget {
     TextWidget {
         inner: None,
+        title: None,
         txt: txt.to_string(),
         family: String::new(),
         font: String::new(),
@@ -91,7 +100,39 @@ pub fn Span(txt: &str) -> TextWidget {
         clamp: None,
         align: None,
         pseudo: None,
-        span: true,
+        kind: TextKind::Span,
+    }
+}
+
+#[allow(non_snake_case)]
+/// `<pre>` element
+#[must_use]
+pub fn Code(txt: &str) -> TextWidget {
+    TextWidget {
+        inner: None,
+        title: None,
+        txt: txt.to_string(),
+        family: String::new(),
+        font: String::new(),
+        style: Vec::new(),
+        color: String::new(),
+        list_style: None,
+        size: String::new(),
+        indent: None,
+        overflow: None,
+        whitespace: None,
+        wordbreak: None,
+        hyphens: None,
+        decoration: None,
+        transform: None,
+        wrap: None,
+        vert_align: None,
+        spacing: None,
+        line_height: None,
+        clamp: None,
+        align: None,
+        pseudo: None,
+        kind: TextKind::Pre,
     }
 }
 
@@ -114,11 +155,12 @@ pub struct TextWidget {
     wordbreak: Option<TextWordBreak>,
     hyphens: Option<TextHyphens>,
     size: String,
-    span: bool,
+    kind: TextKind,
     spacing: Option<LetterSpacing>,
     pseudo: Option<TextContent>,
     align: Option<TextAlignment>,
     clamp: Option<LineClamp>,
+    title: Option<String>,
 }
 
 impl TextWidget {
@@ -289,6 +331,12 @@ impl TextWidget {
         self
     }
 
+    #[must_use]
+    pub fn title(mut self, title: &str) -> Self {
+        self.title = Some(title.to_string());
+        self
+    }
+
     // Sizes
 
     #[must_use]
@@ -490,25 +538,37 @@ impl UIWidget for TextWidget {
     }
 
     fn render_with_class(&self, class: &str) -> Markup {
-        if let Some(inner) = &self.inner {
-            if self.span {
-                html! {
-                    span class=(format!("{} {}", class, self.base_class().join(" "))) { (inner) }
-                }
-            } else {
-                html! {
-                    p class=(format!("{} {}", class, self.base_class().join(" "))) { (inner) }
-                }
-            }
-        } else if self.span {
-            html! {
-                span class=(format!("{} {}", class, self.base_class().join(" "))) { (self.txt) }
-            }
-        } else {
-            html! {
-                p class=(format!("{} {}", class, self.base_class().join(" "))) { (self.txt) }
-            }
+        let element = match self.kind {
+            TextKind::Paragraph => "p",
+            TextKind::Span => "span",
+            TextKind::Pre => "pre",
+        };
+
+        let mut ret = "<".to_string();
+        ret.push_str(&element);
+        ret.push_str(" class='");
+        ret.push_str(&format!("{} {}", class, self.base_class().join(" ")));
+        ret.push_str("'");
+
+        if let Some(title) = &self.title {
+            ret.push_str(" title='");
+            ret.push_str(&title);
+            ret.push_str("'");
         }
+
+        ret.push_str("> ");
+
+        if let Some(inner) = &self.inner {
+            ret.push_str(&inner.render().0);
+        } else {
+            ret.push_str(&self.txt);
+        }
+
+        ret.push_str("</");
+        ret.push_str(&element);
+        ret.push_str(">");
+
+        PreEscaped(ret)
     }
 }