diff --git a/crates/color/Cargo.toml b/crates/color/Cargo.toml
index fdd34fa2..0b27d817 100644
--- a/crates/color/Cargo.toml
+++ b/crates/color/Cargo.toml
@@ -8,3 +8,4 @@ crate-type = ["rlib"]
 
 [dependencies]
 bytemuck = { version = "1.22.0", features = ["derive"] }
+encase = { version = "0.11.1" }
diff --git a/crates/color/src/linear_rgba.rs b/crates/color/src/linear_rgba.rs
index eeb84867..8c976d1d 100644
--- a/crates/color/src/linear_rgba.rs
+++ b/crates/color/src/linear_rgba.rs
@@ -6,7 +6,7 @@ use crate::{Hsl, Srgba};
 ///
 /// Values are in the range [0.0, 1.0] in linear light.
 #[repr(C)]
-#[derive(Debug, Clone, Copy, PartialEq, Pod, Zeroable)]
+#[derive(Debug, Clone, Copy, PartialEq, Pod, Zeroable, encase::ShaderType)]
 pub struct LinearRgba {
     pub r: f32,
     pub g: f32,
diff --git a/crates/editor/Cargo.toml b/crates/editor/Cargo.toml
index 12c2a8d2..1309c8d2 100644
--- a/crates/editor/Cargo.toml
+++ b/crates/editor/Cargo.toml
@@ -9,6 +9,7 @@ path = "src/main.rs"
 
 [dependencies]
 app = { path = "../app" }
+color = { path = "../color" }
 essential = { path = "../essential" }
 ecs = { path = "../ecs" }
 render = { path = "../render" }
diff --git a/crates/editor/src/layout.rs b/crates/editor/src/layout.rs
index 9addd83f..de2813c4 100644
--- a/crates/editor/src/layout.rs
+++ b/crates/editor/src/layout.rs
@@ -1,3 +1,4 @@
+use color::LinearRgba;
 use derive_more::Deref;
 use ecs::{
     command::CommandQueue,
@@ -24,13 +25,13 @@ use ui::{
 pub struct EditorRttHandle(pub AssetHandle<Texture>);
 
 // ── Colours ───────────────────────────────────────────────────────────────────
-const COL_TITLEBAR: [f32; 4] = [0.11, 0.11, 0.11, 1.0];
-const COL_PANEL: [f32; 4] = [0.10, 0.10, 0.10, 1.0];
-const COL_PANEL_HDR: [f32; 4] = [0.14, 0.14, 0.14, 1.0];
-const COL_VIEWPORT_BG: [f32; 4] = [0.05, 0.05, 0.05, 1.0];
-const COL_BORDER: [f32; 4] = [0.25, 0.25, 0.25, 1.0];
-const COL_SLIDER_TRACK: [f32; 4] = [0.18, 0.18, 0.18, 1.0];
-const COL_INPUT_BG: [f32; 4] = [0.13, 0.13, 0.13, 1.0];
+const COL_TITLEBAR: LinearRgba = LinearRgba::new(0.11, 0.11, 0.11, 1.0);
+const COL_PANEL: LinearRgba = LinearRgba::new(0.10, 0.10, 0.10, 1.0);
+const COL_PANEL_HDR: LinearRgba = LinearRgba::new(0.14, 0.14, 0.14, 1.0);
+const COL_VIEWPORT_BG: LinearRgba = LinearRgba::new(0.05, 0.05, 0.05, 1.0);
+const COL_BORDER: LinearRgba = LinearRgba::new(0.25, 0.25, 0.25, 1.0);
+const COL_SLIDER_TRACK: LinearRgba = LinearRgba::new(0.18, 0.18, 0.18, 1.0);
+const COL_INPUT_BG: LinearRgba = LinearRgba::new(0.13, 0.13, 0.13, 1.0);
 
 // ── Sizes ─────────────────────────────────────────────────────────────────────
 const TITLEBAR_H: f32 = 36.0;
@@ -344,9 +345,9 @@ fn spawn_slider(cmd: &mut CommandQueue, value: f32, min: f32, max: f32) -> Entit
         Interactable,
         UIInteractionStyle {
             normal: COL_SLIDER_TRACK,
-            hovered: [0.22, 0.22, 0.22, 1.0],
-            pressed: [0.16, 0.16, 0.16, 1.0],
-            disabled: [0.12, 0.12, 0.12, 0.5],
+            hovered: LinearRgba::new(0.22, 0.22, 0.22, 1.0),
+            pressed: LinearRgba::new(0.16, 0.16, 0.16, 1.0),
+            disabled: LinearRgba::new(0.12, 0.12, 0.12, 0.5),
         },
     ))
     .entity()
@@ -403,9 +404,9 @@ fn spawn_checkbox_row(cmd: &mut CommandQueue, label: &str, checked: bool) -> Ent
             },
             UIMaterial::with_border(
                 if checked {
-                    [0.20, 0.50, 0.90, 1.0]
+                    LinearRgba::new(0.20, 0.50, 0.90, 1.0)
                 } else {
-                    [0.12, 0.12, 0.12, 1.0]
+                    LinearRgba::new(0.12, 0.12, 0.12, 1.0)
                 },
                 COL_BORDER,
                 1.0,
diff --git a/crates/editor/src/main.rs b/crates/editor/src/main.rs
index a294db68..9d18f3a4 100644
--- a/crates/editor/src/main.rs
+++ b/crates/editor/src/main.rs
@@ -4,6 +4,7 @@ use app::{
     App,
     plugins::{AssetManagerPlugin, TimePlugin, TransformPlugin},
 };
+use color::LinearRgba;
 use ecs::{
     command::CommandQueue,
     component::Component,
@@ -12,7 +13,7 @@ use ecs::{
     system::schedule::UpdateGroup,
 };
 use essential::{time::Time, transform::Transform};
-use glam::{Quat, Vec3, Vec4};
+use glam::{Quat, Vec3};
 use render::{
     components::{
         camera::{Camera, RenderTarget},
@@ -77,7 +78,7 @@ fn spawn_scene(mut cmd: CommandQueue, rtt: Res<EditorRttHandle>) {
 
     cmd.spawn((
         Light {
-            color: Vec4::new(1.0, 0.95, 0.85, 1.0),
+            color: LinearRgba::new(1.0, 0.95, 0.85, 1.0),
             intensity: 15.0,
             light_type: LightType::Spot(SpotLight {
                 cone_angle: 60.0_f32.to_radians(),
diff --git a/crates/gltf-loader/Cargo.toml b/crates/gltf-loader/Cargo.toml
index 0982b79e..49c42d9a 100644
--- a/crates/gltf-loader/Cargo.toml
+++ b/crates/gltf-loader/Cargo.toml
@@ -6,6 +6,7 @@ edition = "2024"
 [dependencies]
 app = { path = "../app" }
 animation = { path = "../animation" }
+color = { path = "../color" }
 essential = { path = "../essential" }
 ecs = { path = "../ecs" }
 render = { path = "../render" }
diff --git a/crates/gltf-loader/src/loader.rs b/crates/gltf-loader/src/loader.rs
index b4b2db29..c24309ff 100644
--- a/crates/gltf-loader/src/loader.rs
+++ b/crates/gltf-loader/src/loader.rs
@@ -12,6 +12,7 @@ use animation::{
 };
 use anyhow::{Context, bail};
 use async_trait::async_trait;
+use color::LinearRgba;
 use ecs::{
     command::CommandQueue,
     component::Component,
@@ -26,7 +27,7 @@ use essential::{
     },
     transform::Transform,
 };
-use glam::{Mat4, Vec3, Vec4};
+use glam::{Mat4, Vec3};
 use gltf::{Node, Primitive, buffer::Data};
 
 use image::ImageBuffer;
@@ -166,7 +167,7 @@ impl AssetLoader for GLTFLoader {
                     .map(|info| texture_handle(info.texture(), false)),
             );
 
-            material.set_base_color_factor(Vec4::from_array(pbr.base_color_factor()));
+            material.set_base_color_factor(LinearRgba::from(pbr.base_color_factor()));
             material.set_metallic_factor(pbr.metallic_factor());
             material.set_roughness_factor(pbr.roughness_factor());
             material.set_emissive_factor(Vec3::from_array(gltf_material.emissive_factor()));
diff --git a/crates/obj-loader/Cargo.toml b/crates/obj-loader/Cargo.toml
index aecc3c86..3380f5b9 100644
--- a/crates/obj-loader/Cargo.toml
+++ b/crates/obj-loader/Cargo.toml
@@ -5,6 +5,7 @@ edition = "2024"
 
 [dependencies]
 app = { path = "../app" }
+color = { path = "../color" }
 essential = { path = "../essential" }
 ecs = { path = "../ecs" }
 render = { path = "../render" }
diff --git a/crates/obj-loader/src/mtl_loader.rs b/crates/obj-loader/src/mtl_loader.rs
index e79fb911..6ca2b962 100644
--- a/crates/obj-loader/src/mtl_loader.rs
+++ b/crates/obj-loader/src/mtl_loader.rs
@@ -2,6 +2,7 @@ use std::io::{BufReader, Cursor};
 
 use anyhow::Context;
 use async_trait::async_trait;
+use color::LinearRgba;
 use essential::assets::{
     Asset, AssetPath, LoadableAsset, asset_loader::AssetLoader, asset_server::AssetLoadContext,
     handle::AssetHandle, utils::load_to_string,
@@ -63,7 +64,7 @@ impl AssetLoader for MTLLoader {
             }
 
             if let Some(diffuse) = m.diffuse {
-                material.set_base_color_factor(glam::Vec4::new(
+                material.set_base_color_factor(LinearRgba::new(
                     diffuse[0], diffuse[1], diffuse[2], 1.0,
                 ));
             }
diff --git a/crates/render/Cargo.toml b/crates/render/Cargo.toml
index 2e1f0493..6839e329 100644
--- a/crates/render/Cargo.toml
+++ b/crates/render/Cargo.toml
@@ -8,6 +8,7 @@ crate-type = ["cdylib", "rlib"]
 
 [dependencies]
 app = { path = "../app" }
+color = { path = "../color" }
 essential = { path = "../essential" }
 ecs = { path = "../ecs" }
 window = { path = "../window" }
diff --git a/crates/render/src/assets/material.rs b/crates/render/src/assets/material.rs
index 92712b4d..b0462473 100644
--- a/crates/render/src/assets/material.rs
+++ b/crates/render/src/assets/material.rs
@@ -1,6 +1,7 @@
 use bytemuck::{Pod, Zeroable};
+use color::LinearRgba;
 use essential::assets::{handle::AssetHandle, Asset};
-use glam::{Vec3, Vec4};
+use glam::Vec3;
 use render_macros::AsBindGroup;
 
 use crate::{
@@ -149,7 +150,7 @@ impl StandardMaterial {
         material
     }
 
-    pub fn with_base_color_factor(mut self, factor: Vec4) -> Self {
+    pub fn with_base_color_factor(mut self, factor: LinearRgba) -> Self {
         self.set_base_color_factor(factor);
         self
     }
@@ -226,12 +227,12 @@ impl StandardMaterial {
 
     /// Multiplied with the base color texture (or used directly when no
     /// texture is set).  Linear RGBA; defaults to white.
-    pub fn set_base_color_factor(&mut self, factor: Vec4) {
-        self.uniform.base_color_factor = factor.to_array();
+    pub fn set_base_color_factor(&mut self, factor: LinearRgba) {
+        self.uniform.base_color_factor = factor;
     }
 
-    pub fn base_color_factor(&self) -> Vec4 {
-        Vec4::from_array(self.uniform.base_color_factor)
+    pub fn base_color_factor(&self) -> LinearRgba {
+        self.uniform.base_color_factor
     }
 
     /// Multiplied with the blue channel of the metallic-roughness texture.
@@ -348,7 +349,7 @@ bitflags! {
 #[repr(C)]
 #[derive(Copy, Clone, Pod, Zeroable)]
 pub(crate) struct MaterialUniform {
-    base_color_factor: [f32; 4],
+    base_color_factor: LinearRgba,
     emissive_factor: [f32; 3],
     metallic_factor: f32,
     roughness_factor: f32,
@@ -364,7 +365,7 @@ const _: () = assert!(std::mem::size_of::<MaterialUniform>() == 64);
 impl Default for MaterialUniform {
     fn default() -> Self {
         Self {
-            base_color_factor: [1.0; 4],
+            base_color_factor: LinearRgba::WHITE,
             emissive_factor: [0.0; 3],
             metallic_factor: 0.0,
             roughness_factor: 0.5,
diff --git a/crates/render/src/components/camera.rs b/crates/render/src/components/camera.rs
index 415918a3..7d3fff94 100644
--- a/crates/render/src/components/camera.rs
+++ b/crates/render/src/components/camera.rs
@@ -1,3 +1,4 @@
+use color::LinearRgba;
 use encase::{ShaderType, UniformBuffer};
 use essential::{
     assets::{asset_store::AssetStore, handle::AssetHandle},
@@ -53,7 +54,7 @@ pub struct Camera {
     pub fovy: f32,
     pub znear: f32,
     pub zfar: f32,
-    pub clear_color: wgpu::Color,
+    pub clear_color: LinearRgba,
     pub render_target: RenderTarget,
 }
 
@@ -80,12 +81,7 @@ impl Default for Camera {
             fovy: std::f32::consts::FRAC_PI_4,
             znear: 0.1,
             zfar: 100.0,
-            clear_color: wgpu::Color {
-                r: 0.118,
-                g: 0.831,
-                b: 0.922,
-                a: 1.0,
-            },
+            clear_color: LinearRgba::new(0.118, 0.831, 0.922, 1.0),
             render_target: RenderTarget::main_window(),
         }
     }
@@ -121,7 +117,7 @@ impl Default for CameraUniform {
 
 #[derive(Component)]
 pub struct RenderCamera {
-    pub(crate) clear_color: wgpu::Color,
+    pub(crate) clear_color: LinearRgba,
     pub camera_bind_group: wgpu::BindGroup,
     pub camera_uniform: CameraUniform,
     pub camera_buffer: wgpu::Buffer,
diff --git a/crates/render/src/components/light.rs b/crates/render/src/components/light.rs
index 69e5fe28..0606250b 100644
--- a/crates/render/src/components/light.rs
+++ b/crates/render/src/components/light.rs
@@ -1,3 +1,4 @@
+use color::LinearRgba;
 use ecs::{
     command::CommandQueue,
     component::Component,
@@ -8,7 +9,7 @@ use ecs::{
 
 use encase::{ShaderType, UniformBuffer};
 use essential::transform::GlobalTransform;
-use glam::{Vec3, Vec4};
+use glam::Vec3;
 use wgpu::{util::DeviceExt, BindGroupDescriptor, Buffer};
 
 use crate::{components::render_entity::RenderEntity, layouts::LightLayout, queue::RenderQueue};
@@ -17,7 +18,7 @@ const MAX_LIGHTS: usize = 128;
 
 #[derive(Component)]
 pub struct Light {
-    pub color: Vec4,
+    pub color: LinearRgba,
     pub intensity: f32,
     pub light_type: LightType,
 }
@@ -52,7 +53,7 @@ pub(crate) struct LightsUniform {
 pub struct RenderLight {
     pub(crate) translation: Vec3,
     pub(crate) intensity: f32,
-    pub(crate) color: Vec4,
+    pub(crate) color: LinearRgba,
     pub(crate) direction: Vec3,
     pub(crate) light_type: u32,
 
@@ -65,7 +66,7 @@ impl RenderLight {
         Self {
             translation: Vec3::ZERO,
             intensity: 0.0,
-            color: Vec4::ZERO,
+            color: LinearRgba::TRANSPARENT,
             direction: Vec3::ZERO,
             light_type: 0,
             cos_cone_angle: 0.0,
diff --git a/crates/render/src/components/world_environment.rs b/crates/render/src/components/world_environment.rs
index bdede5f8..54e4f396 100644
--- a/crates/render/src/components/world_environment.rs
+++ b/crates/render/src/components/world_environment.rs
@@ -1,19 +1,19 @@
+use color::LinearRgba;
 use ecs::resource::Resource;
 use encase::ShaderType;
-use glam::Vec4;
 
 // TODO: Actually use this
 #[derive(Resource, ShaderType)]
 pub struct WorldEnvironment {
-    ambient_color: Vec4,
+    ambient_color: LinearRgba,
 }
 
 impl WorldEnvironment {
-    pub fn new(ambient_color: Vec4) -> Self {
+    pub fn new(ambient_color: LinearRgba) -> Self {
         Self { ambient_color }
     }
 
-    pub fn ambient_color(&self) -> &Vec4 {
+    pub fn ambient_color(&self) -> &LinearRgba {
         &self.ambient_color
     }
 }
diff --git a/crates/render/src/material_plugin.rs b/crates/render/src/material_plugin.rs
index 691d9ba4..f4f3d8c3 100644
--- a/crates/render/src/material_plugin.rs
+++ b/crates/render/src/material_plugin.rs
@@ -178,7 +178,12 @@ pub(crate) fn clear_cameras(
                 view: color_view,
                 resolve_target: None,
                 ops: wgpu::Operations {
-                    load: wgpu::LoadOp::Clear(render_camera.clear_color),
+                    load: wgpu::LoadOp::Clear(wgpu::Color {
+                        r: render_camera.clear_color.r as f64,
+                        g: render_camera.clear_color.g as f64,
+                        b: render_camera.clear_color.b as f64,
+                        a: render_camera.clear_color.a as f64,
+                    }),
                     store: wgpu::StoreOp::Store,
                 },
             })],
diff --git a/crates/render/src/plugin.rs b/crates/render/src/plugin.rs
index b36c9a61..5d59d3e1 100644
--- a/crates/render/src/plugin.rs
+++ b/crates/render/src/plugin.rs
@@ -25,8 +25,8 @@ use crate::{
     },
 };
 use app::plugins::Plugin;
+use color::LinearRgba;
 use ecs::{resource::Resource, system::schedule::UpdateGroup, IntoSystemConfig};
-use glam::Vec4;
 use std::sync::{Arc, Mutex};
 use wgpu::{Adapter, Device, Instance, Limits, MemoryHints, Queue};
 
@@ -242,6 +242,6 @@ impl Plugin for RenderPlugin {
             .insert_resource(skeleton_layout)
             .insert_resource(render_lights)
             .insert_resource(empty_skeleton_buffer)
-            .insert_resource(WorldEnvironment::new(Vec4::new(0.1, 0.1, 0.1, 0.1)));
+            .insert_resource(WorldEnvironment::new(LinearRgba::new(0.1, 0.1, 0.1, 0.1)));
     }
 }
diff --git a/crates/ui/Cargo.toml b/crates/ui/Cargo.toml
index 3c3ab24b..afc760a7 100644
--- a/crates/ui/Cargo.toml
+++ b/crates/ui/Cargo.toml
@@ -8,6 +8,7 @@ crate-type = ["cdylib", "rlib"]
 
 [dependencies]
 app = { path = "../app" }
+color = { path = "../color" }
 essential = { path = "../essential" }
 ecs = { path = "../ecs" }
 render = { path = "../render" }
diff --git a/crates/ui/src/checkbox.rs b/crates/ui/src/checkbox.rs
index 89649029..a1ef0e77 100644
--- a/crates/ui/src/checkbox.rs
+++ b/crates/ui/src/checkbox.rs
@@ -1,3 +1,4 @@
+use color::LinearRgba;
 use ecs::{
     component::Component,
     entity::Entity,
@@ -20,17 +21,17 @@ use crate::{interaction::UIClick, material::UIMaterial};
 pub struct UICheckbox {
     pub checked: bool,
     /// Colour when `checked == true`.
-    pub checked_color: [f32; 4],
+    pub checked_color: LinearRgba,
     /// Colour when `checked == false`.
-    pub unchecked_color: [f32; 4],
+    pub unchecked_color: LinearRgba,
 }
 
 impl UICheckbox {
     pub fn new(checked: bool) -> Self {
         Self {
             checked,
-            checked_color: [0.20, 0.50, 0.90, 1.0],
-            unchecked_color: [0.12, 0.12, 0.12, 1.0],
+            checked_color: LinearRgba::new(0.20, 0.50, 0.90, 1.0),
+            unchecked_color: LinearRgba::new(0.12, 0.12, 0.12, 1.0),
         }
     }
 }
diff --git a/crates/ui/src/interaction.rs b/crates/ui/src/interaction.rs
index 5e16bfbd..292f276e 100644
--- a/crates/ui/src/interaction.rs
+++ b/crates/ui/src/interaction.rs
@@ -1,3 +1,4 @@
+use color::LinearRgba;
 use derive_more::{Deref, DerefMut};
 use ecs::events::event_writer::EventWriter;
 use ecs::{
@@ -42,21 +43,21 @@ pub struct UIDisabled;
 /// ```rust,ignore
 /// (
 ///     UINode::default(),
-///     UIMaterial::flat([0.2, 0.2, 0.2, 1.0]),
+///     UIMaterial::flat(LinearRgba::new(0.2, 0.2, 0.2, 1.0)),
 ///     UIInteractionStyle {
-///         normal:   [0.20, 0.20, 0.20, 1.0],
-///         hovered:  [0.28, 0.28, 0.28, 1.0],
-///         pressed:  [0.14, 0.14, 0.14, 1.0],
-///         disabled: [0.10, 0.10, 0.10, 0.5],
+///         normal:   LinearRgba::new(0.20, 0.20, 0.20, 1.0),
+///         hovered:  LinearRgba::new(0.28, 0.28, 0.28, 1.0),
+///         pressed:  LinearRgba::new(0.14, 0.14, 0.14, 1.0),
+///         disabled: LinearRgba::new(0.10, 0.10, 0.10, 0.5),
 ///     },
 /// )
 /// ```
 #[derive(Component, Clone)]
 pub struct UIInteractionStyle {
-    pub normal: [f32; 4],
-    pub hovered: [f32; 4],
-    pub pressed: [f32; 4],
-    pub disabled: [f32; 4],
+    pub normal: LinearRgba,
+    pub hovered: LinearRgba,
+    pub pressed: LinearRgba,
+    pub disabled: LinearRgba,
 }
 
 /// Fired the frame a UI node is clicked with the left mouse button.
diff --git a/crates/ui/src/material.rs b/crates/ui/src/material.rs
index 50bf71e9..6a96823e 100644
--- a/crates/ui/src/material.rs
+++ b/crates/ui/src/material.rs
@@ -1,3 +1,4 @@
+use color::LinearRgba;
 use ecs::component::Component;
 use essential::assets::Asset;
 use render::{AsBindGroup, assets::vertex::VertexBufferLayout};
@@ -15,10 +16,10 @@ use crate::vertex::UIVertex;
 /// # Example
 /// ```rust,ignore
 /// UIMaterial {
-///     color: [0.15, 0.15, 0.15, 1.0],
-///     border_color: [0.4, 0.4, 0.4, 1.0],
+///     color: LinearRgba::new(0.15, 0.15, 0.15, 1.0),
+///     border_color: LinearRgba::new(0.4, 0.4, 0.4, 1.0),
 ///     border_width: 1.0,
-///     ..UIMaterial::flat([0.15, 0.15, 0.15, 1.0])
+///     ..UIMaterial::flat(LinearRgba::new(0.15, 0.15, 0.15, 1.0))
 /// }
 /// ```
 #[derive(Component, Asset, AsBindGroup)]
@@ -32,11 +33,11 @@ use crate::vertex::UIVertex;
 pub struct UIMaterial {
     /// Background fill colour (RGBA, values in `[0.0, 1.0]`).
     #[uniform(0)]
-    pub color: [f32; 4],
+    pub color: LinearRgba,
 
     /// Border outline colour (RGBA).  Only visible when `border_width > 0`.
     #[uniform(1)]
-    pub border_color: [f32; 4],
+    pub border_color: LinearRgba,
 
     /// GPU-side border parameters — **do not set manually**.
     ///
@@ -53,17 +54,17 @@ pub struct UIMaterial {
 
 impl UIMaterial {
     /// A plain filled rectangle with no border.
-    pub fn flat(color: [f32; 4]) -> Self {
+    pub fn flat(color: LinearRgba) -> Self {
         Self {
             color,
-            border_color: [0.0; 4],
+            border_color: LinearRgba::TRANSPARENT,
             border_width: 0.0,
             border_params: [0.0; 4],
         }
     }
 
     /// A filled rectangle with a solid-colour border.
-    pub fn with_border(color: [f32; 4], border_color: [f32; 4], border_width: f32) -> Self {
+    pub fn with_border(color: LinearRgba, border_color: LinearRgba, border_width: f32) -> Self {
         Self {
             color,
             border_color,
@@ -75,6 +76,6 @@ impl UIMaterial {
 
 impl Default for UIMaterial {
     fn default() -> Self {
-        Self::flat([1.0, 1.0, 1.0, 1.0])
+        Self::flat(LinearRgba::WHITE)
     }
 }
diff --git a/crates/ui/src/slider.rs b/crates/ui/src/slider.rs
index 54d9d1cd..68a1f47f 100644
--- a/crates/ui/src/slider.rs
+++ b/crates/ui/src/slider.rs
@@ -1,3 +1,4 @@
+use color::LinearRgba;
 use ecs::{
     command::CommandQueue,
     component::Component,
@@ -85,7 +86,7 @@ pub(crate) fn setup_slider_visuals(
                     height: UIValue::Percent(1.0),
                     ..Default::default()
                 },
-                UIMaterial::flat([0.25, 0.55, 0.95, 1.0]),
+                UIMaterial::flat(LinearRgba::new(0.25, 0.55, 0.95, 1.0)),
             ))
             .entity();
         cmd.add_child(entity, fill);
diff --git a/crates/ui/src/text_input.rs b/crates/ui/src/text_input.rs
index 410f71a2..e8efbb62 100644
--- a/crates/ui/src/text_input.rs
+++ b/crates/ui/src/text_input.rs
@@ -1,3 +1,4 @@
+use color::LinearRgba;
 use ecs::{
     component::Component,
     entity::Entity,
@@ -144,9 +145,9 @@ pub(crate) fn update_text_inputs(
 
         // Highlight border when focused.
         material.border_color = if is_focused {
-            [0.40, 0.65, 1.00, 1.0]
+            LinearRgba::new(0.40, 0.65, 1.00, 1.0)
         } else {
-            [0.30, 0.30, 0.30, 1.0]
+            LinearRgba::new(0.30, 0.30, 0.30, 1.0)
         };
     }
 }
diff --git a/examples/game/Cargo.toml b/examples/game/Cargo.toml
index b3f49c43..ff7483ee 100644
--- a/examples/game/Cargo.toml
+++ b/examples/game/Cargo.toml
@@ -13,6 +13,7 @@ warnings = "deny"
 [dependencies]
 game-engine = { path = "../.." }
 gameplay = { path = "../../crates/gameplay" }
+color = { path = "../../crates/color" }
 bytemuck = { version = "1.22.0", features = ["derive"] }
 cfg-if = "1.0.0"
 env_logger = "0.11.8"
diff --git a/examples/game/src/custom_material.rs b/examples/game/src/custom_material.rs
index 1ed6c83f..3fdfb5fc 100644
--- a/examples/game/src/custom_material.rs
+++ b/examples/game/src/custom_material.rs
@@ -14,6 +14,7 @@
 /// 5. Attach `MaterialComponent::<UnlitMaterial>` to mesh entities instead of
 ///    the old `CustomMaterialComponent`.
 use bytemuck::{Pod, Zeroable};
+use color::LinearRgba;
 use game_engine::essential::assets::Asset;
 use game_engine::render::wgpu;
 use game_engine::render::{self, AsBindGroup};
@@ -26,7 +27,7 @@ use game_engine::render::{self, AsBindGroup};
 #[derive(Copy, Clone, Debug, Pod, Zeroable)]
 pub struct TintUniform {
     /// RGBA tint colour applied to the whole mesh.
-    pub color: [f32; 4],
+    pub color: LinearRgba,
     /// Explicit padding — keeps the struct at 32 bytes (two `vec4`s).
     pub _padding: [f32; 4],
 }
diff --git a/examples/game/src/main.rs b/examples/game/src/main.rs
index 1710dde0..5e038c73 100644
--- a/examples/game/src/main.rs
+++ b/examples/game/src/main.rs
@@ -1,5 +1,6 @@
 use std::f32::consts::PI;
 
+use color::LinearRgba;
 use game_engine::{
     app::App,
     ecs::{
@@ -31,7 +32,7 @@ use game_engine::{
     DefaultPlugins,
 };
 use gameplay::{movement::first_person_player_fly, player::spawn_first_person_player};
-use glam::{Quat, Vec3, Vec4};
+use glam::{Quat, Vec3};
 use wgpu_types::{
     Extent3d, TextureDescriptor, TextureDimension, TextureFormat, TextureUsages,
     TextureViewDescriptor, TextureViewDimension,
@@ -124,7 +125,7 @@ fn spawn_player(
     ));
 
     let light = Light {
-        color: Vec4::new(1.0, 0.0, 1.0, 1.0),
+        color: LinearRgba::new(1.0, 0.0, 1.0, 1.0),
         intensity: 10.0,
         light_type: LightType::Spot(SpotLight {
             cone_angle: 50.0_f32.to_radians(),
diff --git a/examples/render-test/src/main.rs b/examples/render-test/src/main.rs
index 080ec418..9fa8249c 100644
--- a/examples/render-test/src/main.rs
+++ b/examples/render-test/src/main.rs
@@ -9,7 +9,7 @@ use ecs::{
 };
 use essential::{assets::asset_server::AssetServer, time::Time, transform::Transform};
 use game_engine::{gltf_loader::loader::GLTFSpawnerComponent, DefaultPlugins};
-use glam::{Quat, Vec3, Vec4};
+use glam::{Quat, Vec3};
 use render::{
     assets::{material::StandardMaterial, mesh::Mesh, vertex::Vertex},
     components::{
@@ -107,13 +107,13 @@ fn spawn_camera_terminal(
     let camera = Camera {
         aspect,
         render_target: RenderTarget::texture(rtt),
-        clear_color: wgpu::Color::BLACK,
+        clear_color: LinearRgba::BLACK,
         ..Camera::default()
     };
     cmd.spawn((
         camera,
         Light {
-            color: Vec4::new(1.0, 1.0, 1.0, 1.0),
+            color: LinearRgba::WHITE,
             intensity: 100.0,
             light_type: LightType::Point,
         },
@@ -128,7 +128,7 @@ fn spawn_camera_windowed(mut cmd: CommandQueue) {
         &mut cmd,
         Vec3::new(0.0, 2.0, 0.0),
         Light {
-            color: Vec4::new(1.0, 1.0, 1.0, 1.0),
+            color: LinearRgba::WHITE,
             intensity: 10.0,
             light_type: LightType::Point,
         },