diff --git a/CHANGELOG.md b/CHANGELOG.md
index 954871e8f..abf7044c2 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -166,6 +166,7 @@ By @bradwerth [#6216](https://github.com/gfx-rs/wgpu/pull/6216).
 - Invalidate the device when we encounter driver-induced device loss or on unexpected errors. By @teoxoy in [#6229](https://github.com/gfx-rs/wgpu/pull/6229).
 - Make Vulkan error handling more robust. By @teoxoy in [#6119](https://github.com/gfx-rs/wgpu/pull/6119).
 - Add bounds checking to Buffer slice method. By @beholdnec in [#6432](https://github.com/gfx-rs/wgpu/pull/6432).
+- Replace `impl From<StorageFormat> for ScalarKind` with `impl From<StorageFormat> for Scalar` so that byte width is included. By @atlv24 in [#6451](https://github.com/gfx-rs/wgpu/pull/6451).
 
 #### Internal
 
diff --git a/naga/src/back/glsl/mod.rs b/naga/src/back/glsl/mod.rs
index ed373d00b..de4a31b74 100644
--- a/naga/src/back/glsl/mod.rs
+++ b/naga/src/back/glsl/mod.rs
@@ -1095,12 +1095,16 @@ impl<'a, W: Write> Writer<'a, W> {
         // - Array - used if it's an image array
         // - Shadow - used if it's a depth image
         use crate::ImageClass as Ic;
-
-        let (base, kind, ms, comparison) = match class {
-            Ic::Sampled { kind, multi: true } => ("sampler", kind, "MS", ""),
-            Ic::Sampled { kind, multi: false } => ("sampler", kind, "", ""),
-            Ic::Depth { multi: true } => ("sampler", crate::ScalarKind::Float, "MS", ""),
-            Ic::Depth { multi: false } => ("sampler", crate::ScalarKind::Float, "", "Shadow"),
+        use crate::Scalar as S;
+        let float = S {
+            kind: crate::ScalarKind::Float,
+            width: 4,
+        };
+        let (base, scalar, ms, comparison) = match class {
+            Ic::Sampled { kind, multi: true } => ("sampler", S { kind, width: 4 }, "MS", ""),
+            Ic::Sampled { kind, multi: false } => ("sampler", S { kind, width: 4 }, "", ""),
+            Ic::Depth { multi: true } => ("sampler", float, "MS", ""),
+            Ic::Depth { multi: false } => ("sampler", float, "", "Shadow"),
             Ic::Storage { format, .. } => ("image", format.into(), "", ""),
         };
 
@@ -1114,7 +1118,7 @@ impl<'a, W: Write> Writer<'a, W> {
             self.out,
             "{}{}{}{}{}{}{}",
             precision,
-            glsl_scalar(crate::Scalar { kind, width: 4 })?.prefix,
+            glsl_scalar(scalar)?.prefix,
             base,
             glsl_dimension(dim),
             ms,
diff --git a/naga/src/back/msl/writer.rs b/naga/src/back/msl/writer.rs
index 4ba478c85..83d937d48 100644
--- a/naga/src/back/msl/writer.rs
+++ b/naga/src/back/msl/writer.rs
@@ -215,14 +215,15 @@ impl<'a> Display for TypeContext<'a> {
                     crate::ImageDimension::D3 => "3d",
                     crate::ImageDimension::Cube => "cube",
                 };
-                let (texture_str, msaa_str, kind, access) = match class {
+                let (texture_str, msaa_str, scalar, access) = match class {
                     crate::ImageClass::Sampled { kind, multi } => {
                         let (msaa_str, access) = if multi {
                             ("_ms", "read")
                         } else {
                             ("", "sample")
                         };
-                        ("texture", msaa_str, kind, access)
+                        let scalar = crate::Scalar { kind, width: 4 };
+                        ("texture", msaa_str, scalar, access)
                     }
                     crate::ImageClass::Depth { multi } => {
                         let (msaa_str, access) = if multi {
@@ -230,7 +231,11 @@ impl<'a> Display for TypeContext<'a> {
                         } else {
                             ("", "sample")
                         };
-                        ("depth", msaa_str, crate::ScalarKind::Float, access)
+                        let scalar = crate::Scalar {
+                            kind: crate::ScalarKind::Float,
+                            width: 4,
+                        };
+                        ("depth", msaa_str, scalar, access)
                     }
                     crate::ImageClass::Storage { format, .. } => {
                         let access = if self
@@ -254,7 +259,7 @@ impl<'a> Display for TypeContext<'a> {
                         ("texture", "", format.into(), access)
                     }
                 };
-                let base_name = crate::Scalar { kind, width: 4 }.to_msl_name();
+                let base_name = scalar.to_msl_name();
                 let array_str = if arrayed { "_array" } else { "" };
                 write!(
                     out,
diff --git a/naga/src/back/spv/mod.rs b/naga/src/back/spv/mod.rs
index 8a254a3a9..f02958d89 100644
--- a/naga/src/back/spv/mod.rs
+++ b/naga/src/back/spv/mod.rs
@@ -213,7 +213,7 @@ impl Function {
 /// where practical.
 #[derive(Debug, PartialEq, Hash, Eq, Copy, Clone)]
 struct LocalImageType {
-    sampled_type: crate::ScalarKind,
+    sampled_type: crate::Scalar,
     dim: spirv::Dim,
     flags: ImageTypeFlags,
     image_format: spirv::ImageFormat,
@@ -244,19 +244,22 @@ impl LocalImageType {
 
         match class {
             crate::ImageClass::Sampled { kind, multi } => LocalImageType {
-                sampled_type: kind,
+                sampled_type: crate::Scalar { kind, width: 4 },
                 dim,
                 flags: make_flags(multi, ImageTypeFlags::SAMPLED),
                 image_format: spirv::ImageFormat::Unknown,
             },
             crate::ImageClass::Depth { multi } => LocalImageType {
-                sampled_type: crate::ScalarKind::Float,
+                sampled_type: crate::Scalar {
+                    kind: crate::ScalarKind::Float,
+                    width: 4,
+                },
                 dim,
                 flags: make_flags(multi, ImageTypeFlags::DEPTH | ImageTypeFlags::SAMPLED),
                 image_format: spirv::ImageFormat::Unknown,
             },
             crate::ImageClass::Storage { format, access: _ } => LocalImageType {
-                sampled_type: crate::ScalarKind::from(format),
+                sampled_type: format.into(),
                 dim,
                 flags: make_flags(false, ImageTypeFlags::empty()),
                 image_format: format.into(),
diff --git a/naga/src/back/spv/writer.rs b/naga/src/back/spv/writer.rs
index 3e7ef7d37..5cc37de78 100644
--- a/naga/src/back/spv/writer.rs
+++ b/naga/src/back/spv/writer.rs
@@ -902,10 +902,7 @@ impl Writer {
                 Instruction::type_pointer(id, class, type_id)
             }
             LocalType::Image(image) => {
-                let local_type = LocalType::Numeric(NumericType::Scalar(crate::Scalar {
-                    kind: image.sampled_type,
-                    width: 4,
-                }));
+                let local_type = LocalType::Numeric(NumericType::Scalar(image.sampled_type));
                 let type_id = self.get_type_id(LookupType::Local(local_type));
                 Instruction::type_image(id, type_id, image.dim, image.flags, image.image_format)
             }
diff --git a/naga/src/front/glsl/functions.rs b/naga/src/front/glsl/functions.rs
index 2a63c7a02..2ebc8ccfd 100644
--- a/naga/src/front/glsl/functions.rs
+++ b/naga/src/front/glsl/functions.rs
@@ -622,7 +622,7 @@ impl Frontend {
                     // check that the format scalar kind matches
                     let good_format = overload_format == call_format
                         || (overload.internal
-                            && ScalarKind::from(overload_format) == ScalarKind::from(call_format));
+                            && Scalar::from(overload_format) == Scalar::from(call_format));
                     if !(good_size && good_format) {
                         continue 'outer;
                     }
diff --git a/naga/src/proc/mod.rs b/naga/src/proc/mod.rs
index b7a08bc8a..5661e13d5 100644
--- a/naga/src/proc/mod.rs
+++ b/naga/src/proc/mod.rs
@@ -20,10 +20,10 @@ pub use namer::{EntryPointIndex, NameKey, Namer};
 pub use terminator::ensure_block_returns;
 pub use typifier::{ResolveContext, ResolveError, TypeResolution};
 
-impl From<super::StorageFormat> for super::ScalarKind {
+impl From<super::StorageFormat> for super::Scalar {
     fn from(format: super::StorageFormat) -> Self {
         use super::{ScalarKind as Sk, StorageFormat as Sf};
-        match format {
+        let kind = match format {
             Sf::R8Unorm => Sk::Float,
             Sf::R8Snorm => Sk::Float,
             Sf::R8Uint => Sk::Uint,
@@ -64,7 +64,8 @@ impl From<super::StorageFormat> for super::ScalarKind {
             Sf::Rg16Snorm => Sk::Float,
             Sf::Rgba16Unorm => Sk::Float,
             Sf::Rgba16Snorm => Sk::Float,
-        }
+        };
+        super::Scalar { kind, width: 4 }
     }
 }
 
diff --git a/naga/src/proc/typifier.rs b/naga/src/proc/typifier.rs
index 04c776365..a94546fbc 100644
--- a/naga/src/proc/typifier.rs
+++ b/naga/src/proc/typifier.rs
@@ -494,10 +494,7 @@ impl<'a> ResolveContext<'a> {
                         size: crate::VectorSize::Quad,
                     },
                     crate::ImageClass::Storage { format, .. } => Ti::Vector {
-                        scalar: crate::Scalar {
-                            kind: format.into(),
-                            width: 4,
-                        },
+                        scalar: format.into(),
                         size: crate::VectorSize::Quad,
                     },
                 }),
diff --git a/naga/src/valid/function.rs b/naga/src/valid/function.rs
index 23e6204cc..c695d6514 100644
--- a/naga/src/valid/function.rs
+++ b/naga/src/valid/function.rs
@@ -1089,10 +1089,7 @@ impl super::Validator {
                                 crate::ImageClass::Storage { format, .. } => {
                                     crate::TypeInner::Vector {
                                         size: crate::VectorSize::Quad,
-                                        scalar: crate::Scalar {
-                                            kind: format.into(),
-                                            width: 4,
-                                        },
+                                        scalar: format.into(),
                                     }
                                 }
                                 _ => {