Introduce `StyleSheet` for `Text` widget

28 files changed, 183 insertions, 87 deletions

diff --git a/examples/component/src/main.rs b/examples/component/src/main.rs
index 73bbbe35..b6ff0600 100644
--- a/examples/component/src/main.rs
+++ b/examples/component/src/main.rs
@@ -54,7 +54,7 @@ mod numeric_input {
     use iced_native::text;
     use iced_native::widget::button::{self, Button};
     use iced_native::widget::text_input::{self, TextInput};
-    use iced_native::widget::{Row, Text};
+    use iced_native::widget::{self, Row, Text};
     use iced_native::{Element, Length};
 
     pub struct NumericInput<'a, Message> {
@@ -95,7 +95,9 @@ mod numeric_input {
         for NumericInput<'a, Message>
     where
         Renderer: 'a + text::Renderer,
-        Renderer::Theme: button::StyleSheet + text_input::StyleSheet,
+        Renderer::Theme: button::StyleSheet
+            + text_input::StyleSheet
+            + widget::text::StyleSheet,
     {
         type Event = Event;
 
@@ -173,7 +175,9 @@ mod numeric_input {
     where
         Message: 'a,
         Renderer: text::Renderer + 'a,
-        Renderer::Theme: button::StyleSheet + text_input::StyleSheet,
+        Renderer::Theme: button::StyleSheet
+            + text_input::StyleSheet
+            + widget::text::StyleSheet,
     {
         fn from(numeric_input: NumericInput<'a, Message>) -> Self {
             component::view(numeric_input)
diff --git a/examples/integration_opengl/src/controls.rs b/examples/integration_opengl/src/controls.rs
index f387b4e5..fdaa29d5 100644
--- a/examples/integration_opengl/src/controls.rs
+++ b/examples/integration_opengl/src/controls.rs
@@ -89,13 +89,13 @@ impl Program for Controls {
                             .spacing(10)
                             .push(
                                 Text::new("Background color")
-                                    .color(Color::WHITE),
+                                    .style(Color::WHITE),
                             )
                             .push(sliders)
                             .push(
                                 Text::new(format!("{:?}", background_color))
                                     .size(14)
-                                    .color(Color::WHITE),
+                                    .style(Color::WHITE),
                             ),
                     ),
             )
diff --git a/examples/integration_wgpu/src/controls.rs b/examples/integration_wgpu/src/controls.rs
index 9bca40eb..cb2c423f 100644
--- a/examples/integration_wgpu/src/controls.rs
+++ b/examples/integration_wgpu/src/controls.rs
@@ -100,13 +100,13 @@ impl Program for Controls {
                             .spacing(10)
                             .push(
                                 Text::new("Background color")
-                                    .color(Color::WHITE),
+                                    .style(Color::WHITE),
                             )
                             .push(sliders)
                             .push(
                                 Text::new(format!("{:?}", background_color))
                                     .size(14)
-                                    .color(Color::WHITE),
+                                    .style(Color::WHITE),
                             )
                             .push(TextInput::new(
                                 t,
diff --git a/examples/pane_grid/src/main.rs b/examples/pane_grid/src/main.rs
index fca1116e..5fbcea2c 100644
--- a/examples/pane_grid/src/main.rs
+++ b/examples/pane_grid/src/main.rs
@@ -180,7 +180,7 @@ impl Application for Example {
                 pin_button.into(),
                 Text::new("Pane").into(),
                 Text::new(content.id.to_string())
-                    .color(if is_focused {
+                    .style(if is_focused {
                         PANE_ID_COLOR_FOCUSED
                     } else {
                         PANE_ID_COLOR_UNFOCUSED
diff --git a/examples/pokedex/src/main.rs b/examples/pokedex/src/main.rs
index 4b0e913d..89d865e4 100644
--- a/examples/pokedex/src/main.rs
+++ b/examples/pokedex/src/main.rs
@@ -2,7 +2,7 @@ use iced::button;
 use iced::futures;
 use iced::image;
 use iced::{
-    Alignment, Application, Button, Column, Command, Container, Element,
+    Alignment, Application, Button, Color, Column, Command, Container, Element,
     Length, Row, Settings, Text, Theme,
 };
 
@@ -143,7 +143,7 @@ impl Pokemon {
                             .push(
                                 Text::new(format!("#{}", self.number))
                                     .size(20)
-                                    .color([0.5, 0.5, 0.5]),
+                                    .style(Color::from([0.5, 0.5, 0.5])),
                             ),
                     )
                     .push(Text::new(&self.description)),
diff --git a/examples/pure/component/src/main.rs b/examples/pure/component/src/main.rs
index 31592dbf..64935afd 100644
--- a/examples/pure/component/src/main.rs
+++ b/examples/pure/component/src/main.rs
@@ -89,8 +89,9 @@ mod numeric_input {
     impl<Message, Renderer> Component<Message, Renderer> for NumericInput<Message>
     where
         Renderer: text::Renderer + 'static,
-        Renderer::Theme:
-            widget::button::StyleSheet + widget::text_input::StyleSheet,
+        Renderer::Theme: widget::button::StyleSheet
+            + widget::text_input::StyleSheet
+            + widget::text::StyleSheet,
     {
         type State = ();
         type Event = Event;
@@ -161,8 +162,9 @@ mod numeric_input {
     where
         Message: 'a,
         Renderer: 'static + text::Renderer,
-        Renderer::Theme:
-            widget::button::StyleSheet + widget::text_input::StyleSheet,
+        Renderer::Theme: widget::button::StyleSheet
+            + widget::text_input::StyleSheet
+            + widget::text::StyleSheet,
     {
         fn from(numeric_input: NumericInput<Message>) -> Self {
             pure::component(numeric_input)
diff --git a/examples/pure/pane_grid/src/main.rs b/examples/pure/pane_grid/src/main.rs
index 077e116b..e85ed78d 100644
--- a/examples/pure/pane_grid/src/main.rs
+++ b/examples/pure/pane_grid/src/main.rs
@@ -168,7 +168,7 @@ impl Application for Example {
             let title = row()
                 .push(pin_button)
                 .push("Pane")
-                .push(text(pane.id.to_string()).color(if is_focused {
+                .push(text(pane.id.to_string()).style(if is_focused {
                     PANE_ID_COLOR_FOCUSED
                 } else {
                     PANE_ID_COLOR_UNFOCUSED
diff --git a/examples/pure/todos/src/main.rs b/examples/pure/todos/src/main.rs
index ea772def..723386ad 100644
--- a/examples/pure/todos/src/main.rs
+++ b/examples/pure/todos/src/main.rs
@@ -6,7 +6,7 @@ use iced::pure::{
 };
 use iced::theme::{self, Theme};
 use iced::window;
-use iced::{Command, Font, Length, Settings};
+use iced::{Color, Command, Font, Length, Settings};
 use serde::{Deserialize, Serialize};
 
 pub fn main() -> iced::Result {
@@ -155,7 +155,7 @@ impl Application for Todos {
                 let title = text("todos")
                     .width(Length::Fill)
                     .size(100)
-                    .color([0.5, 0.5, 0.5])
+                    .style(Color::from([0.5, 0.5, 0.5]))
                     .horizontal_alignment(alignment::Horizontal::Center);
 
                 let input = text_input(
@@ -406,7 +406,7 @@ fn empty_message(message: &str) -> Element<'_, Message> {
             .width(Length::Fill)
             .size(25)
             .horizontal_alignment(alignment::Horizontal::Center)
-            .color([0.7, 0.7, 0.7]),
+            .style(Color::from([0.7, 0.7, 0.7])),
     )
     .width(Length::Fill)
     .height(Length::Units(200))
diff --git a/examples/pure/tour/src/main.rs b/examples/pure/tour/src/main.rs
index 700e4216..477a1ec7 100644
--- a/examples/pure/tour/src/main.rs
+++ b/examples/pure/tour/src/main.rs
@@ -433,7 +433,7 @@ impl<'a> Step {
             .padding(20)
             .spacing(20)
             .push("And its color:")
-            .push(text(format!("{:?}", color)).color(color))
+            .push(text(format!("{:?}", color)).style(color))
             .push(color_sliders);
 
         Self::container("Text")
@@ -576,7 +576,7 @@ impl<'a> Step {
             .push(if cfg!(target_arch = "wasm32") {
                 Element::new(
                     text("Not available on web yet!")
-                        .color([0.7, 0.7, 0.7])
+                        .style(Color::from([0.7, 0.7, 0.7]))
                         .horizontal_alignment(alignment::Horizontal::Center),
                 )
             } else {
diff --git a/examples/qr_code/src/main.rs b/examples/qr_code/src/main.rs
index 92c82d45..3e9ba921 100644
--- a/examples/qr_code/src/main.rs
+++ b/examples/qr_code/src/main.rs
@@ -1,7 +1,8 @@
 use iced::qr_code::{self, QRCode};
 use iced::text_input::{self, TextInput};
 use iced::{
-    Alignment, Column, Container, Element, Length, Sandbox, Settings, Text,
+    Alignment, Color, Column, Container, Element, Length, Sandbox, Settings,
+    Text,
 };
 
 pub fn main() -> iced::Result {
@@ -48,7 +49,7 @@ impl Sandbox for QRGenerator {
     fn view(&mut self) -> Element<Message> {
         let title = Text::new("QR Code Generator")
             .size(70)
-            .color([0.5, 0.5, 0.5]);
+            .style(Color::from([0.5, 0.5, 0.5]));
 
         let input = TextInput::new(
             &mut self.input,
diff --git a/examples/todos/src/main.rs b/examples/todos/src/main.rs
index 453cddc3..dc080ef5 100644
--- a/examples/todos/src/main.rs
+++ b/examples/todos/src/main.rs
@@ -4,8 +4,8 @@ use iced::scrollable::{self, Scrollable};
 use iced::text_input::{self, TextInput};
 use iced::theme::{self, Theme};
 use iced::{
-    Application, Checkbox, Column, Command, Container, Element, Font, Length,
-    Row, Settings, Text,
+    Application, Checkbox, Color, Column, Command, Container, Element, Font,
+    Length, Row, Settings, Text,
 };
 use serde::{Deserialize, Serialize};
 
@@ -155,7 +155,7 @@ impl Application for Todos {
                 let title = Text::new("todos")
                     .width(Length::Fill)
                     .size(100)
-                    .color([0.5, 0.5, 0.5])
+                    .style(Color::from([0.5, 0.5, 0.5]))
                     .horizontal_alignment(alignment::Horizontal::Center);
 
                 let input = TextInput::new(
@@ -453,7 +453,7 @@ fn empty_message<'a>(message: &str) -> Element<'a, Message> {
             .width(Length::Fill)
             .size(25)
             .horizontal_alignment(alignment::Horizontal::Center)
-            .color([0.7, 0.7, 0.7]),
+            .style(Color::from([0.7, 0.7, 0.7])),
     )
     .width(Length::Fill)
     .height(Length::Units(200))
diff --git a/examples/tour/src/main.rs b/examples/tour/src/main.rs
index 155592d5..22cfaa57 100644
--- a/examples/tour/src/main.rs
+++ b/examples/tour/src/main.rs
@@ -584,7 +584,7 @@ impl<'a> Step {
             .padding(20)
             .spacing(20)
             .push(Text::new("And its color:"))
-            .push(Text::new(format!("{:?}", color)).color(color))
+            .push(Text::new(format!("{:?}", color)).style(color))
             .push(color_sliders);
 
         Self::container("Text")
@@ -766,7 +766,7 @@ impl<'a> Step {
             .push(if cfg!(target_arch = "wasm32") {
                 Element::new(
                     Text::new("Not available on web yet!")
-                        .color([0.7, 0.7, 0.7])
+                        .style(Color::from([0.7, 0.7, 0.7]))
                         .horizontal_alignment(alignment::Horizontal::Center),
                 )
             } else {
diff --git a/examples/websocket/src/main.rs b/examples/websocket/src/main.rs
index 65120710..64addc8f 100644
--- a/examples/websocket/src/main.rs
+++ b/examples/websocket/src/main.rs
@@ -92,7 +92,7 @@ impl Application for WebSocket {
         let message_log = if self.messages.is_empty() {
             Container::new(
                 Text::new("Your messages will appear here...")
-                    .color(Color::from_rgb8(0x88, 0x88, 0x88)),
+                    .style(Color::from_rgb8(0x88, 0x88, 0x88)),
             )
             .width(Length::Fill)
             .height(Length::Fill)
diff --git a/native/src/widget/checkbox.rs b/native/src/widget/checkbox.rs
index cedbb7d8..9e7f183a 100644
--- a/native/src/widget/checkbox.rs
+++ b/native/src/widget/checkbox.rs
@@ -35,7 +35,7 @@ pub use iced_style::checkbox::{Appearance, StyleSheet};
 pub struct Checkbox<'a, Message, Renderer>
 where
     Renderer: text::Renderer,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + widget::text::StyleSheet,
 {
     is_checked: bool,
     on_toggle: Box<dyn Fn(bool) -> Message + 'a>,
@@ -51,7 +51,7 @@ where
 impl<'a, Message, Renderer> Checkbox<'a, Message, Renderer>
 where
     Renderer: text::Renderer,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + widget::text::StyleSheet,
 {
     /// The default size of a [`Checkbox`].
     const DEFAULT_SIZE: u16 = 20;
@@ -130,7 +130,7 @@ impl<'a, Message, Renderer> Widget<Message, Renderer>
     for Checkbox<'a, Message, Renderer>
 where
     Renderer: text::Renderer,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + widget::text::StyleSheet,
 {
     fn width(&self) -> Length {
         self.width
@@ -262,9 +262,11 @@ where
                 style,
                 label_layout,
                 &self.label,
-                self.font.clone(),
                 self.text_size,
-                custom_style.text_color,
+                self.font.clone(),
+                widget::text::Appearance {
+                    color: custom_style.text_color,
+                },
                 alignment::Horizontal::Left,
                 alignment::Vertical::Center,
             );
@@ -277,7 +279,7 @@ impl<'a, Message, Renderer> From<Checkbox<'a, Message, Renderer>>
 where
     Message: 'a,
     Renderer: 'a + text::Renderer,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + widget::text::StyleSheet,
 {
     fn from(
         checkbox: Checkbox<'a, Message, Renderer>,
diff --git a/native/src/widget/radio.rs b/native/src/widget/radio.rs
index de7e2735..ba45a0f4 100644
--- a/native/src/widget/radio.rs
+++ b/native/src/widget/radio.rs
@@ -144,7 +144,7 @@ impl<Message, Renderer> Widget<Message, Renderer> for Radio<Message, Renderer>
 where
     Message: Clone,
     Renderer: text::Renderer,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + widget::text::StyleSheet,
 {
     fn width(&self) -> Length {
         self.width
@@ -277,9 +277,11 @@ where
                 style,
                 label_layout,
                 &self.label,
-                self.font.clone(),
                 self.text_size,
-                custom_style.text_color,
+                self.font.clone(),
+                widget::text::Appearance {
+                    color: custom_style.text_color,
+                },
                 alignment::Horizontal::Left,
                 alignment::Vertical::Center,
             );
@@ -292,7 +294,7 @@ impl<'a, Message, Renderer> From<Radio<Message, Renderer>>
 where
     Message: 'a + Clone,
     Renderer: 'a + text::Renderer,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + widget::text::StyleSheet,
 {
     fn from(radio: Radio<Message, Renderer>) -> Element<'a, Message, Renderer> {
         Element::new(radio)
diff --git a/native/src/widget/text.rs b/native/src/widget/text.rs
index 5f7e9159..242247b0 100644
--- a/native/src/widget/text.rs
+++ b/native/src/widget/text.rs
@@ -3,45 +3,57 @@ use crate::alignment;
 use crate::layout;
 use crate::renderer;
 use crate::text;
-use crate::{Color, Element, Layout, Length, Point, Rectangle, Size, Widget};
+use crate::{Element, Layout, Length, Point, Rectangle, Size, Widget};
+
+pub use iced_style::text::{Appearance, StyleSheet};
 
 /// A paragraph of text.
 ///
 /// # Example
 ///
 /// ```
+/// # use iced_native::Color;
+/// #
 /// # type Text = iced_native::widget::Text<iced_native::renderer::Null>;
 /// #
 /// Text::new("I <3 iced!")
-///     .color([0.0, 0.0, 1.0])
-///     .size(40);
+///     .size(40)
+///     .style(Color::from([0.0, 0.0, 1.0]));
 /// ```
 ///
 /// ![Text drawn by `iced_wgpu`](https://github.com/iced-rs/iced/blob/7760618fb112074bc40b148944521f312152012a/docs/images/text.png?raw=true)
-#[derive(Debug)]
-pub struct Text<Renderer: text::Renderer> {
+#[allow(missing_debug_implementations)]
+pub struct Text<Renderer>
+where
+    Renderer: text::Renderer,
+    Renderer::Theme: StyleSheet,
+{
     content: String,
     size: Option<u16>,
-    color: Option<Color>,
-    font: Renderer::Font,
     width: Length,
     height: Length,
     horizontal_alignment: alignment::Horizontal,
     vertical_alignment: alignment::Vertical,
+    font: Renderer::Font,
+    style: <Renderer::Theme as StyleSheet>::Style,
 }
 
-impl<Renderer: text::Renderer> Text<Renderer> {
+impl<Renderer> Text<Renderer>
+where
+    Renderer: text::Renderer,
+    Renderer::Theme: StyleSheet,
+{
     /// Create a new fragment of [`Text`] with the given contents.
     pub fn new<T: Into<String>>(label: T) -> Self {
         Text {
             content: label.into(),
             size: None,
-            color: None,
             font: Default::default(),
             width: Length::Shrink,
             height: Length::Shrink,
             horizontal_alignment: alignment::Horizontal::Left,
             vertical_alignment: alignment::Vertical::Top,
+            style: Default::default(),
         }
     }
 
@@ -51,12 +63,6 @@ impl<Renderer: text::Renderer> Text<Renderer> {
         self
     }
 
-    /// Sets the [`Color`] of the [`Text`].
-    pub fn color<C: Into<Color>>(mut self, color: C) -> Self {
-        self.color = Some(color.into());
-        self
-    }
-
     /// Sets the [`Font`] of the [`Text`].
     ///
     /// [`Font`]: crate::text::Renderer::Font
@@ -65,6 +71,15 @@ impl<Renderer: text::Renderer> Text<Renderer> {
         self
     }
 
+    /// Sets the [`Color`] of the [`Text`].
+    pub fn style(
+        mut self,
+        style: impl Into<<Renderer::Theme as StyleSheet>::Style>,
+    ) -> Self {
+        self.style = style.into();
+        self
+    }
+
     /// Sets the width of the [`Text`] boundaries.
     pub fn width(mut self, width: Length) -> Self {
         self.width = width;
@@ -99,6 +114,7 @@ impl<Renderer: text::Renderer> Text<Renderer> {
 impl<Message, Renderer> Widget<Message, Renderer> for Text<Renderer>
 where
     Renderer: text::Renderer,
+    Renderer::Theme: StyleSheet,
 {
     fn width(&self) -> Length {
         self.width
@@ -130,7 +146,7 @@ where
     fn draw(
         &self,
         renderer: &mut Renderer,
-        _theme: &Renderer::Theme,
+        theme: &Renderer::Theme,
         style: &renderer::Style,
         layout: Layout<'_>,
         _cursor_position: Point,
@@ -141,9 +157,9 @@ where
             style,
             layout,
             &self.content,
-            self.font.clone(),
             self.size,
-            self.color,
+            self.font.clone(),
+            theme.appearance(self.style),
             self.horizontal_alignment,
             self.vertical_alignment,
         );
@@ -165,9 +181,9 @@ pub fn draw<Renderer>(
     style: &renderer::Style,
     layout: Layout<'_>,
     content: &str,
-    font: Renderer::Font,
     size: Option<u16>,
-    color: Option<Color>,
+    font: Renderer::Font,
+    appearance: Appearance,
     horizontal_alignment: alignment::Horizontal,
     vertical_alignment: alignment::Vertical,
 ) where
@@ -191,7 +207,7 @@ pub fn draw<Renderer>(
         content,
         size: f32::from(size.unwrap_or(renderer.default_size())),
         bounds: Rectangle { x, y, ..bounds },
-        color: color.unwrap_or(style.text_color),
+        color: appearance.color.unwrap_or(style.text_color),
         font,
         horizontal_alignment,
         vertical_alignment,
@@ -202,23 +218,28 @@ impl<'a, Message, Renderer> From<Text<Renderer>>
     for Element<'a, Message, Renderer>
 where
     Renderer: text::Renderer + 'a,
+    Renderer::Theme: StyleSheet,
 {
     fn from(text: Text<Renderer>) -> Element<'a, Message, Renderer> {
         Element::new(text)
     }
 }
 
-impl<Renderer: text::Renderer> Clone for Text<Renderer> {
+impl<Renderer> Clone for Text<Renderer>
+where
+    Renderer: text::Renderer,
+    Renderer::Theme: StyleSheet,
+{
     fn clone(&self) -> Self {
         Self {
             content: self.content.clone(),
             size: self.size,
-            color: self.color,
-            font: self.font.clone(),
             width: self.width,
             height: self.height,
             horizontal_alignment: self.horizontal_alignment,
             vertical_alignment: self.vertical_alignment,
+            font: self.font.clone(),
+            style: self.style,
         }
     }
 }
diff --git a/native/src/widget/toggler.rs b/native/src/widget/toggler.rs
index 25391404..0936c271 100644
--- a/native/src/widget/toggler.rs
+++ b/native/src/widget/toggler.rs
@@ -5,7 +5,7 @@ use crate::layout;
 use crate::mouse;
 use crate::renderer;
 use crate::text;
-use crate::widget::{Row, Text};
+use crate::widget::{self, Row, Text};
 use crate::{
     Alignment, Clipboard, Element, Event, Layout, Length, Point, Rectangle,
     Shell, Widget,
@@ -136,7 +136,7 @@ impl<'a, Message, Renderer> Widget<Message, Renderer>
     for Toggler<'a, Message, Renderer>
 where
     Renderer: text::Renderer,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + widget::text::StyleSheet,
 {
     fn width(&self) -> Length {
         self.width
@@ -240,9 +240,9 @@ where
                 style,
                 label_layout,
                 &label,
-                self.font.clone(),
                 self.text_size,
-                None,
+                self.font.clone(),
+                Default::default(),
                 self.text_alignment,
                 alignment::Vertical::Center,
             );
@@ -312,7 +312,7 @@ impl<'a, Message, Renderer> From<Toggler<'a, Message, Renderer>>
 where
     Message: 'a,
     Renderer: 'a + text::Renderer,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + widget::text::StyleSheet,
 {
     fn from(
         toggler: Toggler<'a, Message, Renderer>,
diff --git a/native/src/widget/tooltip.rs b/native/src/widget/tooltip.rs
index d034f648..0548e9da 100644
--- a/native/src/widget/tooltip.rs
+++ b/native/src/widget/tooltip.rs
@@ -4,6 +4,7 @@ use crate::layout;
 use crate::mouse;
 use crate::renderer;
 use crate::text;
+use crate::widget;
 use crate::widget::container;
 use crate::widget::text::Text;
 use crate::{
@@ -16,7 +17,7 @@ use crate::{
 pub struct Tooltip<'a, Message, Renderer>
 where
     Renderer: text::Renderer,
-    Renderer::Theme: container::StyleSheet,
+    Renderer::Theme: container::StyleSheet + widget::text::StyleSheet,
 {
     content: Element<'a, Message, Renderer>,
     tooltip: Text<Renderer>,
@@ -29,7 +30,7 @@ where
 impl<'a, Message, Renderer> Tooltip<'a, Message, Renderer>
 where
     Renderer: text::Renderer,
-    Renderer::Theme: container::StyleSheet,
+    Renderer::Theme: container::StyleSheet + widget::text::StyleSheet,
 {
     /// The default padding of a [`Tooltip`] drawn by this renderer.
     const DEFAULT_PADDING: u16 = 5;
@@ -224,7 +225,7 @@ impl<'a, Message, Renderer> Widget<Message, Renderer>
     for Tooltip<'a, Message, Renderer>
 where
     Renderer: text::Renderer,
-    Renderer::Theme: container::StyleSheet,
+    Renderer::Theme: container::StyleSheet + widget::text::StyleSheet,
 {
     fn width(&self) -> Length {
         self.content.width()
@@ -330,7 +331,7 @@ impl<'a, Message, Renderer> From<Tooltip<'a, Message, Renderer>>
 where
     Message: 'a,
     Renderer: 'a + text::Renderer,
-    Renderer::Theme: container::StyleSheet,
+    Renderer::Theme: container::StyleSheet + widget::text::StyleSheet,
 {
     fn from(
         tooltip: Tooltip<'a, Message, Renderer>,
diff --git a/pure/src/helpers.rs b/pure/src/helpers.rs
index 18791945..88598f9b 100644
--- a/pure/src/helpers.rs
+++ b/pure/src/helpers.rs
@@ -71,7 +71,7 @@ pub fn tooltip<'a, Message, Renderer>(
 ) -> widget::Tooltip<'a, Message, Renderer>
 where
     Renderer: iced_native::text::Renderer,
-    Renderer::Theme: widget::container::StyleSheet,
+    Renderer::Theme: widget::container::StyleSheet + widget::text::StyleSheet,
 {
     widget::Tooltip::new(content, tooltip, position)
 }
@@ -82,6 +82,7 @@ where
 pub fn text<Renderer>(text: impl Into<String>) -> widget::Text<Renderer>
 where
     Renderer: iced_native::text::Renderer,
+    Renderer::Theme: widget::text::StyleSheet,
 {
     widget::Text::new(text)
 }
@@ -96,7 +97,7 @@ pub fn checkbox<'a, Message, Renderer>(
 ) -> widget::Checkbox<'a, Message, Renderer>
 where
     Renderer: iced_native::text::Renderer,
-    Renderer::Theme: widget::checkbox::StyleSheet,
+    Renderer::Theme: widget::checkbox::StyleSheet + widget::text::StyleSheet,
 {
     widget::Checkbox::new(is_checked, label, f)
 }
diff --git a/pure/src/widget.rs b/pure/src/widget.rs
index ab63f7cc..cd825ad8 100644
--- a/pure/src/widget.rs
+++ b/pure/src/widget.rs
@@ -11,6 +11,7 @@ pub mod rule;
 pub mod scrollable;
 pub mod slider;
 pub mod svg;
+pub mod text;
 pub mod text_input;
 pub mod toggler;
 pub mod tooltip;
@@ -19,7 +20,6 @@ pub mod tree;
 mod column;
 mod row;
 mod space;
-mod text;
 
 pub use button::Button;
 pub use checkbox::Checkbox;
diff --git a/pure/src/widget/checkbox.rs b/pure/src/widget/checkbox.rs
index 4128876e..9d6a78ce 100644
--- a/pure/src/widget/checkbox.rs
+++ b/pure/src/widget/checkbox.rs
@@ -7,6 +7,7 @@ use iced_native::layout::{self, Layout};
 use iced_native::mouse;
 use iced_native::renderer;
 use iced_native::text;
+use iced_native::widget;
 use iced_native::{Clipboard, Length, Point, Rectangle, Shell};
 
 pub use iced_native::widget::checkbox::{Appearance, Checkbox, StyleSheet};
@@ -15,7 +16,7 @@ impl<'a, Message, Renderer> Widget<Message, Renderer>
     for Checkbox<'a, Message, Renderer>
 where
     Renderer: text::Renderer,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + widget::text::StyleSheet,
 {
     fn width(&self) -> Length {
         <Self as iced_native::Widget<Message, Renderer>>::width(self)
@@ -100,7 +101,7 @@ impl<'a, Message, Renderer> Into<Element<'a, Message, Renderer>>
 where
     Message: 'a,
     Renderer: text::Renderer + 'a,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + widget::text::StyleSheet,
 {
     fn into(self) -> Element<'a, Message, Renderer> {
         Element::new(self)
diff --git a/pure/src/widget/radio.rs b/pure/src/widget/radio.rs
index 9a8885e0..7a6ffbac 100644
--- a/pure/src/widget/radio.rs
+++ b/pure/src/widget/radio.rs
@@ -7,6 +7,7 @@ use iced_native::layout::{self, Layout};
 use iced_native::mouse;
 use iced_native::renderer;
 use iced_native::text;
+use iced_native::widget;
 use iced_native::{Clipboard, Length, Point, Rectangle, Shell};
 
 pub use iced_native::widget::radio::{Appearance, Radio, StyleSheet};
@@ -15,7 +16,7 @@ impl<Message, Renderer> Widget<Message, Renderer> for Radio<Message, Renderer>
 where
     Message: Clone,
     Renderer: text::Renderer,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + widget::text::StyleSheet,
 {
     fn width(&self) -> Length {
         <Self as iced_native::Widget<Message, Renderer>>::width(self)
@@ -100,7 +101,7 @@ impl<'a, Message, Renderer> Into<Element<'a, Message, Renderer>>
 where
     Message: 'a + Clone,
     Renderer: text::Renderer + 'a,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + widget::text::StyleSheet,
 {
     fn into(self) -> Element<'a, Message, Renderer> {
         Element::new(self)
diff --git a/pure/src/widget/text.rs b/pure/src/widget/text.rs
index 0a51b628..23999a2c 100644
--- a/pure/src/widget/text.rs
+++ b/pure/src/widget/text.rs
@@ -1,16 +1,19 @@
+//! Write some text for your users to read.
 use crate::widget::Tree;
 use crate::{Element, Widget};
 
 use iced_native::layout::{self, Layout};
 use iced_native::renderer;
 use iced_native::text;
+use iced_native::widget;
 use iced_native::{Length, Point, Rectangle};
 
-pub use iced_native::widget::Text;
+pub use iced_native::widget::text::{Appearance, StyleSheet, Text};
 
 impl<Message, Renderer> Widget<Message, Renderer> for Text<Renderer>
 where
     Renderer: text::Renderer,
+    Renderer::Theme: widget::text::StyleSheet,
 {
     fn width(&self) -> Length {
         <Self as iced_native::Widget<Message, Renderer>>::width(self)
@@ -56,6 +59,7 @@ impl<'a, Message, Renderer> Into<Element<'a, Message, Renderer>>
     for Text<Renderer>
 where
     Renderer: text::Renderer + 'a,
+    Renderer::Theme: widget::text::StyleSheet,
 {
     fn into(self) -> Element<'a, Message, Renderer> {
         Element::new(self)
@@ -65,6 +69,7 @@ where
 impl<'a, Message, Renderer> Into<Element<'a, Message, Renderer>> for &'a str
 where
     Renderer: text::Renderer + 'a,
+    Renderer::Theme: widget::text::StyleSheet,
 {
     fn into(self) -> Element<'a, Message, Renderer> {
         Text::new(self).into()
diff --git a/pure/src/widget/toggler.rs b/pure/src/widget/toggler.rs
index fc01a2c9..5efa39ab 100644
--- a/pure/src/widget/toggler.rs
+++ b/pure/src/widget/toggler.rs
@@ -7,6 +7,7 @@ use iced_native::layout::{self, Layout};
 use iced_native::mouse;
 use iced_native::renderer;
 use iced_native::text;
+use iced_native::widget;
 use iced_native::{Clipboard, Length, Point, Rectangle, Shell};
 
 pub use iced_native::widget::toggler::{Appearance, StyleSheet, Toggler};
@@ -15,7 +16,7 @@ impl<'a, Message, Renderer> Widget<Message, Renderer>
     for Toggler<'a, Message, Renderer>
 where
     Renderer: text::Renderer,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + widget::text::StyleSheet,
 {
     fn width(&self) -> Length {
         <Self as iced_native::Widget<Message, Renderer>>::width(self)
@@ -100,7 +101,7 @@ impl<'a, Message, Renderer> Into<Element<'a, Message, Renderer>>
 where
     Message: 'a,
     Renderer: text::Renderer + 'a,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + widget::text::StyleSheet,
 {
     fn into(self) -> Element<'a, Message, Renderer> {
         Element::new(self)
diff --git a/pure/src/widget/tooltip.rs b/pure/src/widget/tooltip.rs
index 745d100d..cbc34722 100644
--- a/pure/src/widget/tooltip.rs
+++ b/pure/src/widget/tooltip.rs
@@ -9,7 +9,7 @@ use iced_native::renderer;
 use iced_native::text;
 use iced_native::widget::container;
 use iced_native::widget::tooltip;
-use iced_native::widget::Text;
+use iced_native::widget::{self, Text};
 use iced_native::{Clipboard, Layout, Length, Point, Rectangle, Shell};
 
 pub use iced_style::container::{Appearance, StyleSheet};
@@ -20,7 +20,7 @@ pub use tooltip::Position;
 pub struct Tooltip<'a, Message, Renderer: text::Renderer>
 where
     Renderer: text::Renderer,
-    Renderer::Theme: container::StyleSheet,
+    Renderer::Theme: container::StyleSheet + widget::text::StyleSheet,
 {
     content: Element<'a, Message, Renderer>,
     tooltip: Text<Renderer>,
@@ -33,7 +33,7 @@ where
 impl<'a, Message, Renderer> Tooltip<'a, Message, Renderer>
 where
     Renderer: text::Renderer,
-    Renderer::Theme: container::StyleSheet,
+    Renderer::Theme: container::StyleSheet + widget::text::StyleSheet,
 {
     /// The default padding of a [`Tooltip`] drawn by this renderer.
     const DEFAULT_PADDING: u16 = 5;
@@ -96,7 +96,7 @@ impl<'a, Message, Renderer> Widget<Message, Renderer>
     for Tooltip<'a, Message, Renderer>
 where
     Renderer: text::Renderer,
-    Renderer::Theme: container::StyleSheet,
+    Renderer::Theme: container::StyleSheet + widget::text::StyleSheet,
 {
     fn children(&self) -> Vec<Tree> {
         vec![Tree::new(&self.content)]
@@ -230,7 +230,7 @@ impl<'a, Message, Renderer> From<Tooltip<'a, Message, Renderer>>
 where
     Message: 'a,
     Renderer: 'a + text::Renderer,
-    Renderer::Theme: container::StyleSheet,
+    Renderer::Theme: container::StyleSheet + widget::text::StyleSheet,
 {
     fn from(
         tooltip: Tooltip<'a, Message, Renderer>,
diff --git a/style/src/lib.rs b/style/src/lib.rs
index 4a0a6a14..ee426e98 100644
--- a/style/src/lib.rs
+++ b/style/src/lib.rs
@@ -21,6 +21,7 @@ pub mod radio;
 pub mod rule;
 pub mod scrollable;
 pub mod slider;
+pub mod text;
 pub mod text_input;
 pub mod theme;
 pub mod toggler;
diff --git a/style/src/text.rs b/style/src/text.rs
new file mode 100644
index 00000000..69a4ed85
--- /dev/null
+++ b/style/src/text.rs
@@ -0,0 +1,18 @@
+use iced_core::Color;
+
+pub trait StyleSheet {
+    type Style: Default + Copy;
+
+    fn appearance(&self, style: Self::Style) -> Appearance;
+}
+
+#[derive(Debug, Clone, Copy)]
+pub struct Appearance {
+    pub color: Option<Color>,
+}
+
+impl Default for Appearance {
+    fn default() -> Self {
+        Self { color: None }
+    }
+}
diff --git a/style/src/theme.rs b/style/src/theme.rs
index b1e18c55..0bae671e 100644
--- a/style/src/theme.rs
+++ b/style/src/theme.rs
@@ -14,6 +14,7 @@ use crate::radio;
 use crate::rule;
 use crate::scrollable;
 use crate::slider;
+use crate::text;
 use crate::text_input;
 use crate::toggler;
 
@@ -602,6 +603,40 @@ impl scrollable::StyleSheet for Theme {
 }
 
 /*
+ * Text
+ */
+#[derive(Clone, Copy)]
+pub enum Text {
+    Default,
+    Color(Color),
+    Custom(fn(&Theme) -> text::Appearance),
+}
+
+impl Default for Text {
+    fn default() -> Self {
+        Self::Default
+    }
+}
+
+impl From<Color> for Text {
+    fn from(color: Color) -> Self {
+        Text::Color(color)
+    }
+}
+
+impl text::StyleSheet for Theme {
+    type Style = Text;
+
+    fn appearance(&self, style: Self::Style) -> text::Appearance {
+        match style {
+            Text::Default => Default::default(),
+            Text::Color(c) => text::Appearance { color: Some(c) },
+            Text::Custom(f) => f(self),
+        }
+    }
+}
+
+/*
  * Text Input
  */
 impl text_input::StyleSheet for Theme {