diff --git a/src/core/text.rs b/src/core/text.rs
index 349502d..8ddb022 100644
--- a/src/core/text.rs
+++ b/src/core/text.rs
@@ -1,4 +1,4 @@
-use cosmic_text::Metrics;
+use cosmic_text::{Family, Metrics};
 
 use crate::prelude::*;
 
@@ -18,6 +18,10 @@ impl Text {
         self.attrs.color = color;
         self
     }
+    pub fn family(mut self, family: Family<'static>) -> Self {
+        self.attrs.family = family;
+        self
+    }
     pub fn line_height(mut self, height: f32) -> Self {
         self.attrs.line_height = height;
         self
diff --git a/src/layout/text.rs b/src/layout/text.rs
index 7fc05b8..8936cce 100644
--- a/src/layout/text.rs
+++ b/src/layout/text.rs
@@ -1,4 +1,4 @@
-use cosmic_text::{Attrs, Buffer, FontSystem, Metrics, Shaping, SwashCache};
+use cosmic_text::{Attrs, Buffer, Family, FontSystem, Metrics, Shaping, SwashCache};
 use image::{Rgba, RgbaImage};
 
 use crate::{
@@ -25,6 +25,7 @@ pub struct TextAttrs {
     pub color: UiColor,
     pub size: f32,
     pub line_height: f32,
+    pub family: Family<'static>,
 }
 
 pub type TextBuffer = Buffer;
@@ -36,12 +37,12 @@ impl Default for TextAttrs {
             color: UiColor::WHITE,
             size,
             line_height: size * 1.2,
+            family: Family::SansSerif,
         }
     }
 }
 
 impl TextData {
-    /// returns (handle, offset from top left)
     pub fn draw(
         &mut self,
         buffer: &mut TextBuffer,
@@ -56,7 +57,7 @@ impl TextData {
         buffer.set_text(
             &mut self.font_system,
             content,
-            &Attrs::new(),
+            &Attrs::new().family(attrs.family),
             Shaping::Advanced,
         );
         let mut pixels = HashMap::new();
diff --git a/src/testing/mod.rs b/src/testing/mod.rs
index 5b8c0f8..9361a2f 100644
--- a/src/testing/mod.rs
+++ b/src/testing/mod.rs
@@ -1,6 +1,7 @@
 use std::sync::Arc;
 
 use app::App;
+use cosmic_text::Family;
 use render::Renderer;
 use senses::*;
 use ui::prelude::*;
@@ -95,10 +96,15 @@ impl Client {
                 text("okkk\nokkkkkk!").size(30),
                 text("hmm").size(30),
                 text("a").size(30),
-                text("'").size(30),
                 text("pretty cool right?").size(30),
+                (
+                    text("'").size(30).family(Family::Monospace),
+                    text("'").size(30).family(Family::Monospace),
+                    text(":gamer mode").size(30).family(Family::Monospace),
+                )
+                    .span(Dir::RIGHT, [sized(); _]),
             )
-                .span(Dir::RIGHT, [sized(); _]),
+                .span(Dir::DOWN, [sized(); _]),
         );
 
         let tabs = ui.add(