Adds linear gradient support to 2D meshes in the canvas widget.

10 files changed, 1078 insertions, 370 deletions

diff --git a/wgpu/src/backend.rs b/wgpu/src/backend.rs
index 8c875254..fd688004 100644
--- a/wgpu/src/backend.rs
+++ b/wgpu/src/backend.rs
@@ -94,8 +94,7 @@ impl Backend {
                 staging_belt,
                 encoder,
                 frame,
-                target_size.width,
-                target_size.height,
+                target_size
             );
         }
 
@@ -112,8 +111,7 @@ impl Backend {
         staging_belt: &mut wgpu::util::StagingBelt,
         encoder: &mut wgpu::CommandEncoder,
         target: &wgpu::TextureView,
-        target_width: u32,
-        target_height: u32,
+        target_size: Size<u32>,
     ) {
         let bounds = (layer.bounds * scale_factor).snap();
 
@@ -134,7 +132,7 @@ impl Backend {
             );
         }
 
-        if !layer.meshes.is_empty() {
+        if !layer.meshes.0.is_empty() {
             let scaled = transformation
                 * Transformation::scale(scale_factor, scale_factor);
 
@@ -143,8 +141,7 @@ impl Backend {
                 staging_belt,
                 encoder,
                 target,
-                target_width,
-                target_height,
+                target_size,
                 scaled,
                 scale_factor,
                 &layer.meshes,
diff --git a/wgpu/src/buffers.rs b/wgpu/src/buffers.rs
new file mode 100644
index 00000000..f94d175d
--- /dev/null
+++ b/wgpu/src/buffers.rs
@@ -0,0 +1,3 @@
+//! Utilities for buffer operations.
+pub mod buffer;
+pub mod dynamic_buffers;
\ No newline at end of file
diff --git a/wgpu/src/buffers/buffer.rs b/wgpu/src/buffers/buffer.rs
new file mode 100644
index 00000000..dae3b038
--- /dev/null
+++ b/wgpu/src/buffers/buffer.rs
@@ -0,0 +1,91 @@
+//! Utilities for static buffer operations.
+
+/// A generic buffer struct useful for items which have no alignment requirements
+/// (e.g. Vertex, Index buffers) and are set once and never changed until destroyed.
+///
+/// This buffer is mapped to the GPU on creation, so must be initialized with the correct capacity.
+#[derive(Debug)]
+pub(crate) struct StaticBuffer {
+    //stored sequentially per mesh iteration
+    offsets: Vec<wgpu::BufferAddress>,
+    gpu: wgpu::Buffer,
+    //the static size of the buffer
+    size: wgpu::BufferAddress,
+}
+
+impl StaticBuffer {
+    pub fn new(
+        device: &wgpu::Device,
+        label: &'static str,
+        size: u64,
+        usage: wgpu::BufferUsages,
+        total_offsets: usize,
+    ) -> Self {
+        Self {
+            offsets: Vec::with_capacity(total_offsets),
+            gpu: device.create_buffer(&wgpu::BufferDescriptor {
+                label: Some(label),
+                size,
+                usage,
+                mapped_at_creation: true,
+            }),
+            size,
+        }
+    }
+
+    /// Resolves pending write operations & unmaps buffer from host memory.
+    pub fn flush(&self) {
+        (&self.gpu).unmap();
+    }
+
+    /// Returns whether or not the buffer needs to be recreated. This can happen whenever the mesh 
+    /// data is re-submitted.
+    pub fn needs_recreate(&self, new_size: usize) -> bool {
+        self.size != new_size as u64
+    }
+
+    /// Writes the current vertex data to the gpu buffer with a memcpy & stores its offset.
+    pub fn write(&mut self, offset: u64, content: &[u8]) {
+        //offset has to be divisible by 8 for alignment reasons
+        let actual_offset = if offset % 8 != 0 {
+            offset + 4
+        } else {
+            offset
+        };
+
+        let mut buffer = self
+            .gpu
+            .slice(actual_offset..(actual_offset + content.len() as u64))
+            .get_mapped_range_mut();
+        buffer.copy_from_slice(content);
+        self.offsets.push(actual_offset);
+    }
+
+    fn offset_at(&self, index: usize) -> &wgpu::BufferAddress {
+        self.offsets
+            .get(index)
+            .expect(&format!("Offset index {} is not in range.", index))
+    }
+
+    /// Returns the slice calculated from the offset stored at the given index.
+    /// e.g. to calculate the slice for the 2nd mesh in the layer, this would be the offset at index 
+    /// 1 that we stored earlier when writing.
+    pub fn slice_from_index<T>(
+        &self,
+        index: usize,
+    ) -> wgpu::BufferSlice<'_> {
+        self.gpu.slice(self.offset_at(index)..)
+    }
+}
+
+/// Returns true if the current buffer doesn't exist & needs to be created, or if it's too small 
+/// for the new content.
+pub(crate) fn needs_recreate(
+    buffer: &Option<StaticBuffer>,
+    new_size: usize,
+) -> bool {
+    match buffer {
+        None => true,
+        Some(buf) => buf.needs_recreate(new_size),
+    }
+}
diff --git a/wgpu/src/buffers/dynamic_buffers.rs b/wgpu/src/buffers/dynamic_buffers.rs
new file mode 100644
index 00000000..d81529ce
--- /dev/null
+++ b/wgpu/src/buffers/dynamic_buffers.rs
@@ -0,0 +1,202 @@
+//! Utilities for uniform buffer operations.
+use encase::private::WriteInto;
+use encase::ShaderType;
+use std::marker::PhantomData;
+
+// Currently supported dynamic buffers.
+enum DynamicBufferType {
+    Uniform(encase::DynamicUniformBuffer<Vec<u8>>),
+    Storage(encase::DynamicStorageBuffer<Vec<u8>>),
+}
+
+impl DynamicBufferType {
+    /// Writes the current value to its CPU buffer with proper alignment.
+    pub(super) fn write<T: ShaderType + WriteInto>(
+        &mut self,
+        value: &T,
+    ) -> wgpu::DynamicOffset {
+        match self {
+            DynamicBufferType::Uniform(buf) => buf
+                .write(value)
+                .expect("Error when writing to dynamic uniform buffer.")
+                as u32,
+            DynamicBufferType::Storage(buf) => buf
+                .write(value)
+                .expect("Error when writing to dynamic storage buffer.")
+                as u32,
+        }
+    }
+
+    /// Returns bytearray of aligned CPU buffer.
+    pub(super) fn get_ref(&self) -> &Vec<u8> {
+        match self {
+            DynamicBufferType::Uniform(buf) => buf.as_ref(),
+            DynamicBufferType::Storage(buf) => buf.as_ref(),
+        }
+    }
+
+    /// Resets the CPU buffer.
+    pub(super) fn clear(&mut self) {
+        match self {
+            DynamicBufferType::Uniform(buf) => {
+                buf.as_mut().clear();
+                buf.set_offset(0);
+            }
+            DynamicBufferType::Storage(buf) => {
+                buf.as_mut().clear();
+                buf.set_offset(0);
+            }
+        }
+    }
+}
+
+//TODO think about making cpu & gpu buffers optional
+pub(crate) struct DynamicBuffer<T: ShaderType> {
+    offsets: Vec<wgpu::DynamicOffset>,
+    cpu: DynamicBufferType,
+    gpu: wgpu::Buffer,
+    label: &'static str,
+    size: u64,
+    _data: PhantomData<T>,
+}
+
+impl<T: ShaderType + WriteInto> DynamicBuffer<T> {
+    /// Creates a new dynamic uniform buffer.
+    pub fn uniform(device: &wgpu::Device, label: &'static str) -> Self {
+        DynamicBuffer::new(
+            device,
+            DynamicBufferType::Uniform(encase::DynamicUniformBuffer::new(
+                Vec::new(),
+            )),
+            label,
+            wgpu::BufferUsages::UNIFORM | wgpu::BufferUsages::COPY_DST,
+        )
+    }
+
+    /// Creates a new dynamic storage buffer.
+    pub fn storage(device: &wgpu::Device, label: &'static str) -> Self {
+        DynamicBuffer::new(
+            device,
+            DynamicBufferType::Storage(encase::DynamicStorageBuffer::new(
+                Vec::new(),
+            )),
+            label,
+            wgpu::BufferUsages::STORAGE | wgpu::BufferUsages::COPY_DST,
+        )
+    }
+
+    fn new(
+        device: &wgpu::Device,
+        dynamic_buffer_type: DynamicBufferType,
+        label: &'static str,
+        usage: wgpu::BufferUsages,
+    ) -> Self {
+        let initial_size = u64::from(T::min_size());
+
+        Self {
+            offsets: Vec::new(),
+            cpu: dynamic_buffer_type,
+            gpu: DynamicBuffer::<T>::create_gpu_buffer(
+                device,
+                label,
+                usage,
+                initial_size,
+            ),
+            label,
+            size: initial_size,
+            _data: Default::default(),
+        }
+    }
+
+    fn create_gpu_buffer(
+        device: &wgpu::Device,
+        label: &'static str,
+        usage: wgpu::BufferUsages,
+        size: u64,
+    ) -> wgpu::Buffer {
+        device.create_buffer(&wgpu::BufferDescriptor {
+            label: Some(label),
+            size,
+            usage,
+            mapped_at_creation: false,
+        })
+    }
+
+    /// Write a new value to the CPU buffer with proper alignment. Stores the returned offset value
+    /// in the buffer for future use.
+    pub fn push(&mut self, value: &T) {
+        //this write operation on the buffer will adjust for uniform alignment requirements
+        let offset = self.cpu.write(value);
+        self.offsets.push(offset as u32);
+    }
+
+    /// Resize buffer contents if necessary. This will re-create the GPU buffer if current size is
+    /// less than the newly computed size from the CPU buffer.
+    pub fn resize(&mut self, device: &wgpu::Device) -> bool {
+        let new_size = self.cpu.get_ref().len() as u64;
+
+        if self.size < new_size {
+            let usages = match self.cpu {
+                DynamicBufferType::Uniform(_) => {
+                    wgpu::BufferUsages::UNIFORM | wgpu::BufferUsages::COPY_DST
+                }
+                DynamicBufferType::Storage(_) => {
+                    wgpu::BufferUsages::STORAGE | wgpu::BufferUsages::COPY_DST
+                }
+            };
+
+            //Re-create the GPU buffer since it needs to be resized.
+            self.gpu = DynamicBuffer::<T>::create_gpu_buffer(
+                device, self.label, usages, new_size,
+            );
+            self.size = new_size;
+            true
+        } else {
+            false
+        }
+    }
+
+    /// Write the contents of this dynamic buffer to the GPU via staging belt command.
+    pub fn write(
+        &mut self,
+        device: &wgpu::Device,
+        staging_belt: &mut wgpu::util::StagingBelt,
+        encoder: &mut wgpu::CommandEncoder,
+    ) {
+        let size = self.cpu.get_ref().len();
+
+        if let Some(buffer_size) = wgpu::BufferSize::new(size as u64) {
+            let mut buffer = staging_belt.write_buffer(
+                encoder,
+                &self.gpu,
+                0,
+                buffer_size,
+                device,
+            );
+
+            buffer.copy_from_slice(self.cpu.get_ref());
+        }
+    }
+
+    // Gets the aligned offset at the given index from the CPU buffer.
+    pub fn offset_at_index(&self, index: usize) -> wgpu::DynamicOffset {
+        let offset = self
+            .offsets
+            .get(index)
+            .expect(&format!("Index {} not found in offsets.", index))
+            .clone();
+
+        offset
+    }
+
+    /// Returns a reference to the GPU buffer.
+    pub fn raw(&self) -> &wgpu::Buffer {
+        &self.gpu
+    }
+
+    /// Reset the buffer.
+    pub fn clear(&mut self) {
+        self.offsets.clear();
+        self.cpu.clear();
+    }
+}
diff --git a/wgpu/src/lib.rs b/wgpu/src/lib.rs
index 3a98c6bd..42cf712e 100644
--- a/wgpu/src/lib.rs
+++ b/wgpu/src/lib.rs
@@ -41,6 +41,7 @@
 pub mod settings;
 pub mod triangle;
 pub mod window;
+pub mod buffers;
 
 mod backend;
 mod quad;
diff --git a/wgpu/src/shader/triangle_gradient.wgsl b/wgpu/src/shader/triangle_gradient.wgsl
new file mode 100644
index 00000000..cb35b61c
--- /dev/null
+++ b/wgpu/src/shader/triangle_gradient.wgsl
@@ -0,0 +1,83 @@
+// uniforms
+struct GradientUniforms {
+    transform: mat4x4<f32>,
+    @size(16) start: vec2<f32>,
+    @size(16) end: vec2<f32>,
+    @size(16) start_stop: i32,
+    @size(16) end_stop: i32,
+}
+
+struct Stop {
+    color: vec4<f32>,
+    offset: f32,
+};
+
+@group(0) @binding(0)
+var<uniform> gradient_uniforms: GradientUniforms;
+
+@group(0) @binding(1)
+var<storage, read> color_stops: array<Stop>;
+
+struct VertexOutput {
+    @builtin(position) position: vec4<f32>,
+    @location(0) raw_position: vec2<f32>
+}
+
+@vertex
+fn vs_main(@location(0) input: vec2<f32>) -> VertexOutput {
+    var output: VertexOutput;
+    output.position = gradient_uniforms.transform * vec4<f32>(input.xy, 0.0, 1.0);
+    output.raw_position = input;
+
+    return output;
+}
+
+@fragment
+fn fs_gradient(input: VertexOutput) -> @location(0) vec4<f32> {
+    let v1 = gradient_uniforms.end - gradient_uniforms.start;
+    let v2 = input.raw_position.xy - gradient_uniforms.start;
+    let unit = normalize(v1);
+    let offset = dot(unit, v2) / length(v1);
+
+    let min_stop = color_stops[gradient_uniforms.start_stop];
+    let max_stop = color_stops[gradient_uniforms.end_stop];
+
+    var color: vec4<f32>;
+
+    if (offset <= min_stop.offset) {
+        color = min_stop.color;
+    } else if (offset >= max_stop.offset) {
+        color = max_stop.color;
+    } else {
+        var min = min_stop;
+        var max = max_stop;
+        var min_index = gradient_uniforms.start_stop;
+        var max_index = gradient_uniforms.end_stop;
+
+        loop {
+            if (min_index >= max_index - 1) {
+                break;
+            }
+
+            let index = min_index + (max_index - min_index) / 2;
+
+            let stop = color_stops[index];
+
+            if (offset <= stop.offset) {
+                max = stop;
+                max_index = index;
+            } else {
+                min = stop;
+                min_index = index;
+            }
+        }
+
+        color = mix(min.color, max.color, smoothstep(
+            min.offset,
+            max.offset,
+            offset
+        ));
+    }
+
+    return color;
+}
\ No newline at end of file
diff --git a/wgpu/src/shader/triangle_solid.wgsl b/wgpu/src/shader/triangle_solid.wgsl
new file mode 100644
index 00000000..126eceaa
--- /dev/null
+++ b/wgpu/src/shader/triangle_solid.wgsl
@@ -0,0 +1,18 @@
+// uniforms
+struct SolidUniforms {
+    transform: mat4x4<f32>,
+    color: vec4<f32>
+}
+
+@group(0) @binding(0)
+var<uniform> solid_uniforms: SolidUniforms;
+
+@vertex
+fn vs_main(@location(0) input: vec2<f32>) -> @builtin(position) vec4<f32> {
+    return solid_uniforms.transform * vec4<f32>(input.xy, 0.0, 1.0);
+}
+
+@fragment
+fn fs_solid() -> @location(0) vec4<f32> {
+    return solid_uniforms.color;
+}
\ No newline at end of file
diff --git a/wgpu/src/triangle.rs b/wgpu/src/triangle.rs
index fd06dddf..d632c26c 100644
--- a/wgpu/src/triangle.rs
+++ b/wgpu/src/triangle.rs
@@ -1,429 +1,308 @@
 //! Draw meshes of triangles.
 use crate::{settings, Transformation};
-use iced_graphics::layer;
+use core::fmt;
+use std::fmt::Formatter;
 
-use bytemuck::{Pod, Zeroable};
-use std::mem;
+use iced_graphics::layer::Meshes;
+use iced_graphics::shader::Shader;
+use iced_graphics::Size;
 
+use crate::buffers::buffer::{needs_recreate, StaticBuffer};
+use crate::triangle::gradient::GradientPipeline;
+use crate::triangle::solid::SolidPipeline;
 pub use iced_graphics::triangle::{Mesh2D, Vertex2D};
 
+mod gradient;
 mod msaa;
+mod solid;
 
-const UNIFORM_BUFFER_SIZE: usize = 50;
-const VERTEX_BUFFER_SIZE: usize = 10_000;
-const INDEX_BUFFER_SIZE: usize = 10_000;
-
+/// Triangle pipeline for all mesh layers in a [`iced_graphics::Canvas`] widget.
 #[derive(Debug)]
 pub(crate) struct Pipeline {
-    pipeline: wgpu::RenderPipeline,
     blit: Option<msaa::Blit>,
-    constants_layout: wgpu::BindGroupLayout,
-    constants: wgpu::BindGroup,
-    uniforms_buffer: Buffer<Uniforms>,
-    vertex_buffer: Buffer<Vertex2D>,
-    index_buffer: Buffer<u32>,
+    // these are optional so we don't allocate any memory to the GPU if
+    // application has no triangle meshes.
+    vertex_buffer: Option<StaticBuffer>,
+    index_buffer: Option<StaticBuffer>,
+    pipelines: TrianglePipelines,
 }
 
-#[derive(Debug)]
-struct Buffer<T> {
-    label: &'static str,
-    raw: wgpu::Buffer,
-    size: usize,
-    usage: wgpu::BufferUsages,
-    _type: std::marker::PhantomData<T>,
+/// Supported triangle pipelines for different fills. Both use the same vertex shader.
+pub(crate) struct TrianglePipelines {
+    solid: SolidPipeline,
+    gradient: GradientPipeline,
 }
 
-impl<T> Buffer<T> {
-    pub fn new(
-        label: &'static str,
-        device: &wgpu::Device,
-        size: usize,
-        usage: wgpu::BufferUsages,
-    ) -> Self {
-        let raw = device.create_buffer(&wgpu::BufferDescriptor {
-            label: Some(label),
-            size: (std::mem::size_of::<T>() * size) as u64,
-            usage,
-            mapped_at_creation: false,
-        });
-
-        Buffer {
-            label,
-            raw,
-            size,
-            usage,
-            _type: std::marker::PhantomData,
-        }
+impl fmt::Debug for TrianglePipelines {
+    fn fmt(&self, f: &mut Formatter<'_>) -> fmt::Result {
+        f.debug_struct("TrianglePipelines").finish()
     }
+}
 
-    pub fn expand(&mut self, device: &wgpu::Device, size: usize) -> bool {
-        let needs_resize = self.size < size;
-
-        if needs_resize {
-            self.raw = device.create_buffer(&wgpu::BufferDescriptor {
-                label: Some(self.label),
-                size: (std::mem::size_of::<T>() * size) as u64,
-                usage: self.usage,
-                mapped_at_creation: false,
-            });
-
-            self.size = size;
-        }
+impl TrianglePipelines {
+    /// Resets each pipeline's buffers.
+    fn clear(&mut self) {
+        self.solid.buffer.clear();
+        self.gradient.uniform_buffer.clear();
+        self.gradient.storage_buffer.clear();
+    }
 
-        needs_resize
+    /// Writes the contents of each pipeline's CPU buffer to the GPU, resizing the GPU buffer
+    /// beforehand if necessary.
+    fn write(
+        &mut self,
+        device: &wgpu::Device,
+        staging_belt: &mut wgpu::util::StagingBelt,
+        encoder: &mut wgpu::CommandEncoder,
+    ) {
+        self.solid.write(device, staging_belt, encoder);
+        self.gradient.write(device, staging_belt, encoder);
     }
 }
 
 impl Pipeline {
+    /// Creates supported GL programs, listed in [TrianglePipelines].
     pub fn new(
         device: &wgpu::Device,
         format: wgpu::TextureFormat,
         antialiasing: Option<settings::Antialiasing>,
     ) -> Pipeline {
-        let constants_layout =
-            device.create_bind_group_layout(&wgpu::BindGroupLayoutDescriptor {
-                label: Some("iced_wgpu::triangle uniforms layout"),
-                entries: &[wgpu::BindGroupLayoutEntry {
-                    binding: 0,
-                    visibility: wgpu::ShaderStages::VERTEX,
-                    ty: wgpu::BindingType::Buffer {
-                        ty: wgpu::BufferBindingType::Uniform,
-                        has_dynamic_offset: true,
-                        min_binding_size: wgpu::BufferSize::new(
-                            mem::size_of::<Uniforms>() as u64,
-                        ),
-                    },
-                    count: None,
-                }],
-            });
-
-        let constants_buffer = Buffer::new(
-            "iced_wgpu::triangle uniforms buffer",
-            device,
-            UNIFORM_BUFFER_SIZE,
-            wgpu::BufferUsages::UNIFORM | wgpu::BufferUsages::COPY_DST,
-        );
-
-        let constant_bind_group =
-            device.create_bind_group(&wgpu::BindGroupDescriptor {
-                label: Some("iced_wgpu::triangle uniforms bind group"),
-                layout: &constants_layout,
-                entries: &[wgpu::BindGroupEntry {
-                    binding: 0,
-                    resource: wgpu::BindingResource::Buffer(
-                        wgpu::BufferBinding {
-                            buffer: &constants_buffer.raw,
-                            offset: 0,
-                            size: wgpu::BufferSize::new(std::mem::size_of::<
-                                Uniforms,
-                            >(
-                            )
-                                as u64),
-                        },
-                    ),
-                }],
-            });
-
-        let layout =
-            device.create_pipeline_layout(&wgpu::PipelineLayoutDescriptor {
-                label: Some("iced_wgpu::triangle pipeline layout"),
-                push_constant_ranges: &[],
-                bind_group_layouts: &[&constants_layout],
-            });
-
-        let shader =
-            device.create_shader_module(wgpu::ShaderModuleDescriptor {
-                label: Some("iced_wgpu::triangle::shader"),
-                source: wgpu::ShaderSource::Wgsl(std::borrow::Cow::Borrowed(
-                    include_str!("shader/triangle.wgsl"),
-                )),
-            });
-
-        let pipeline =
-            device.create_render_pipeline(&wgpu::RenderPipelineDescriptor {
-                label: Some("iced_wgpu::triangle pipeline"),
-                layout: Some(&layout),
-                vertex: wgpu::VertexState {
-                    module: &shader,
-                    entry_point: "vs_main",
-                    buffers: &[wgpu::VertexBufferLayout {
-                        array_stride: mem::size_of::<Vertex2D>() as u64,
-                        step_mode: wgpu::VertexStepMode::Vertex,
-                        attributes: &wgpu::vertex_attr_array!(
-                            // Position
-                            0 => Float32x2,
-                            // Color
-                            1 => Float32x4,
-                        ),
-                    }],
-                },
-                fragment: Some(wgpu::FragmentState {
-                    module: &shader,
-                    entry_point: "fs_main",
-                    targets: &[Some(wgpu::ColorTargetState {
-                        format,
-                        blend: Some(wgpu::BlendState::ALPHA_BLENDING),
-                        write_mask: wgpu::ColorWrites::ALL,
-                    })],
-                }),
-                primitive: wgpu::PrimitiveState {
-                    topology: wgpu::PrimitiveTopology::TriangleList,
-                    front_face: wgpu::FrontFace::Cw,
-                    ..Default::default()
-                },
-                depth_stencil: None,
-                multisample: wgpu::MultisampleState {
-                    count: antialiasing.map(|a| a.sample_count()).unwrap_or(1),
-                    mask: !0,
-                    alpha_to_coverage_enabled: false,
-                },
-                multiview: None,
-            });
-
         Pipeline {
-            pipeline,
             blit: antialiasing.map(|a| msaa::Blit::new(device, format, a)),
-            constants_layout,
-            constants: constant_bind_group,
-            uniforms_buffer: constants_buffer,
-            vertex_buffer: Buffer::new(
-                "iced_wgpu::triangle vertex buffer",
-                device,
-                VERTEX_BUFFER_SIZE,
-                wgpu::BufferUsages::VERTEX | wgpu::BufferUsages::COPY_DST,
-            ),
-            index_buffer: Buffer::new(
-                "iced_wgpu::triangle index buffer",
-                device,
-                INDEX_BUFFER_SIZE,
-                wgpu::BufferUsages::INDEX | wgpu::BufferUsages::COPY_DST,
-            ),
+            vertex_buffer: None,
+            index_buffer: None,
+            pipelines: TrianglePipelines {
+                solid: SolidPipeline::new(device, format, antialiasing),
+                gradient: GradientPipeline::new(device, format, antialiasing),
+            },
         }
     }
 
+    /// Draws the contents of the current layer's meshes to the [target].
     pub fn draw(
         &mut self,
         device: &wgpu::Device,
         staging_belt: &mut wgpu::util::StagingBelt,
         encoder: &mut wgpu::CommandEncoder,
         target: &wgpu::TextureView,
-        target_width: u32,
-        target_height: u32,
+        target_size: Size<u32>,
         transformation: Transformation,
         scale_factor: f32,
-        meshes: &[layer::Mesh<'_>],
+        meshes: &Meshes<'_>,
     ) {
-        // This looks a bit crazy, but we are just counting how many vertices
-        // and indices we will need to handle.
-        // TODO: Improve readability
-        let (total_vertices, total_indices) = meshes
-            .iter()
-            .map(|layer::Mesh { buffers, .. }| {
-                (buffers.vertices.len(), buffers.indices.len())
-            })
-            .fold((0, 0), |(total_v, total_i), (v, i)| {
-                (total_v + v, total_i + i)
-            });
-
-        // Then we ensure the current buffers are big enough, resizing if
-        // necessary
-        let _ = self.vertex_buffer.expand(device, total_vertices);
-        let _ = self.index_buffer.expand(device, total_indices);
-
-        // If the uniforms buffer is resized, then we need to recreate its
-        // bind group.
-        if self.uniforms_buffer.expand(device, meshes.len()) {
-            self.constants =
-                device.create_bind_group(&wgpu::BindGroupDescriptor {
-                    label: Some("iced_wgpu::triangle uniforms buffer"),
-                    layout: &self.constants_layout,
-                    entries: &[wgpu::BindGroupEntry {
-                        binding: 0,
-                        resource: wgpu::BindingResource::Buffer(
-                            wgpu::BufferBinding {
-                                buffer: &self.uniforms_buffer.raw,
-                                offset: 0,
-                                size: wgpu::BufferSize::new(
-                                    std::mem::size_of::<Uniforms>() as u64,
-                                ),
-                            },
-                        ),
-                    }],
-                });
+        //count the total number of vertices & indices we need to handle
+        let (total_vertices, total_indices) = meshes.attribute_count();
+        println!("total vertices: {}, total indices: {}", total_vertices, total_indices);
+
+        //Only create buffers if they need to be re-sized or don't exist
+        if needs_recreate(&self.vertex_buffer, total_vertices) {
+            //mapped to GPU at creation with total vertices
+            self.vertex_buffer = Some(StaticBuffer::new(
+                device,
+                "iced_wgpu::triangle vertex buffer",
+                //TODO: a more reasonable default to prevent frequent resizing calls
+                // before this was 10_000
+                (std::mem::size_of::<Vertex2D>() * total_vertices) as u64,
+                wgpu::BufferUsages::VERTEX,
+                meshes.0.len(),
+            ))
         }
 
-        let mut uniforms: Vec<Uniforms> = Vec::with_capacity(meshes.len());
-        let mut offsets: Vec<(
-            wgpu::BufferAddress,
-            wgpu::BufferAddress,
-            usize,
-        )> = Vec::with_capacity(meshes.len());
-        let mut last_vertex = 0;
-        let mut last_index = 0;
-
-        // We upload everything upfront
-        for mesh in meshes {
-            let transform = (transformation
-                * Transformation::translate(mesh.origin.x, mesh.origin.y))
-            .into();
-
-            let vertices = bytemuck::cast_slice(&mesh.buffers.vertices);
-            let indices = bytemuck::cast_slice(&mesh.buffers.indices);
-
-            if let (Some(vertices_size), Some(indices_size)) = (
-                wgpu::BufferSize::new(vertices.len() as u64),
-                wgpu::BufferSize::new(indices.len() as u64),
-            ) {
-                {
-                    let mut vertex_buffer = staging_belt.write_buffer(
-                        encoder,
-                        &self.vertex_buffer.raw,
-                        (std::mem::size_of::<Vertex2D>() * last_vertex) as u64,
-                        vertices_size,
-                        device,
-                    );
+        if needs_recreate(&self.index_buffer, total_indices) {
+            //mapped to GPU at creation with total indices
+            self.index_buffer = Some(StaticBuffer::new(
+                device,
+                "iced_wgpu::triangle index buffer",
+                //TODO: a more reasonable default to prevent frequent resizing calls
+                // before this was 10_000
+                (std::mem::size_of::<Vertex2D>() * total_indices) as u64,
+                wgpu::BufferUsages::INDEX,
+                meshes.0.len(),
+            ));
+        }
 
-                    vertex_buffer.copy_from_slice(vertices);
+        if let Some(vertex_buffer) = &mut self.vertex_buffer {
+            if let Some(index_buffer) = &mut self.index_buffer {
+                let mut offset_v = 0;
+                let mut offset_i = 0;
+                //TODO: store this more efficiently
+                let mut indices_lengths = Vec::with_capacity(meshes.0.len());
+
+                //iterate through meshes to write all attribute data
+                for mesh in meshes.0.iter() {
+                    let transform = transformation
+                        * Transformation::translate(
+                            mesh.origin.x,
+                            mesh.origin.y,
+                        );
+
+                    println!("Mesh attribute data: Vertex: {:?}, Index: {:?}", mesh.buffers.vertices, mesh.buffers.indices);
+
+                    let vertices = bytemuck::cast_slice(&mesh.buffers.vertices);
+                    let indices = bytemuck::cast_slice(&mesh.buffers.indices);
+
+                    //TODO: it's (probably) more efficient to reduce this write command and
+                    // iterate first and then upload
+                    println!("vertex buffer len: {}, index length: {}", vertices.len(), indices.len());
+                    vertex_buffer.write(offset_v, vertices);
+                    index_buffer.write(offset_i, indices);
+
+                    offset_v += vertices.len() as u64;
+                    offset_i += indices.len() as u64;
+                    indices_lengths.push(mesh.buffers.indices.len());
+
+                    match mesh.shader {
+                        Shader::Solid(color) => {
+                            self.pipelines.solid.push(transform, color);
+                        }
+                        Shader::Gradient(gradient) => {
+                            self.pipelines.gradient.push(transform, gradient);
+                        }
+                    }
                 }
 
+                //done writing to gpu buffer, unmap from host memory since we don't need it
+                //anymore
+                vertex_buffer.flush();
+                index_buffer.flush();
+
+                //resize & memcpy uniforms from CPU buffers to GPU buffers for all pipelines
+                self.pipelines.write(device, staging_belt, encoder);
+
+                //configure the render pass now that the data is uploaded to the GPU
                 {
-                    let mut index_buffer = staging_belt.write_buffer(
-                        encoder,
-                        &self.index_buffer.raw,
-                        (std::mem::size_of::<u32>() * last_index) as u64,
-                        indices_size,
-                        device,
+                    //configure antialiasing pass
+                    let (attachment, resolve_target, load) =
+                        if let Some(blit) = &mut self.blit {
+                            let (attachment, resolve_target) = blit.targets(
+                                device,
+                                target_size.width,
+                                target_size.height,
+                            );
+
+                            (
+                                attachment,
+                                Some(resolve_target),
+                                wgpu::LoadOp::Clear(wgpu::Color::TRANSPARENT),
+                            )
+                        } else {
+                            (target, None, wgpu::LoadOp::Load)
+                        };
+
+                    let mut render_pass = encoder.begin_render_pass(
+                        &wgpu::RenderPassDescriptor {
+                            label: Some("iced_wgpu::triangle render pass"),
+                            color_attachments: &[Some(
+                                wgpu::RenderPassColorAttachment {
+                                    view: attachment,
+                                    resolve_target,
+                                    ops: wgpu::Operations { load, store: true },
+                                },
+                            )],
+                            depth_stencil_attachment: None,
+                        },
                     );
 
-                    index_buffer.copy_from_slice(indices);
+                    //TODO: do this a better way; store it in the respective pipelines perhaps
+                    // to be more readable
+                    let mut num_solids = 0;
+                    let mut num_gradients = 0;
+
+                    //TODO: try to avoid this extra iteration if possible
+                    for index in 0..meshes.0.len() {
+                        let clip_bounds =
+                            (meshes.0[index].clip_bounds * scale_factor).snap();
+
+                        render_pass.set_scissor_rect(
+                            clip_bounds.x,
+                            clip_bounds.y,
+                            clip_bounds.width,
+                            clip_bounds.height,
+                        );
+
+                        match meshes.0[index].shader {
+                            Shader::Solid(_) => {
+                                self.pipelines.solid.configure_render_pass(
+                                    &mut render_pass,
+                                    num_solids,
+                                );
+                                num_solids += 1;
+                            }
+                            Shader::Gradient(_) => {
+                                self.pipelines.gradient.configure_render_pass(
+                                    &mut render_pass,
+                                    num_gradients,
+                                );
+                                num_gradients += 1;
+                            }
+                        }
+
+                        render_pass.set_index_buffer(
+                            index_buffer.slice_from_index::<u32>(index),
+                            wgpu::IndexFormat::Uint32,
+                        );
+
+                        render_pass.set_vertex_buffer(
+                            0,
+                            vertex_buffer.slice_from_index::<Vertex2D>(index),
+                        );
+
+                        render_pass.draw_indexed(
+                            0..(indices_lengths[index] as u32),
+                            0,
+                            0..1,
+                        );
+                    }
                 }
-
-                uniforms.push(transform);
-                offsets.push((
-                    last_vertex as u64,
-                    last_index as u64,
-                    mesh.buffers.indices.len(),
-                ));
-
-                last_vertex += mesh.buffers.vertices.len();
-                last_index += mesh.buffers.indices.len();
-            }
-        }
-
-        let uniforms = bytemuck::cast_slice(&uniforms);
-
-        if let Some(uniforms_size) =
-            wgpu::BufferSize::new(uniforms.len() as u64)
-        {
-            let mut uniforms_buffer = staging_belt.write_buffer(
-                encoder,
-                &self.uniforms_buffer.raw,
-                0,
-                uniforms_size,
-                device,
-            );
-
-            uniforms_buffer.copy_from_slice(uniforms);
-        }
-
-        {
-            let (attachment, resolve_target, load) =
-                if let Some(blit) = &mut self.blit {
-                    let (attachment, resolve_target) =
-                        blit.targets(device, target_width, target_height);
-
-                    (
-                        attachment,
-                        Some(resolve_target),
-                        wgpu::LoadOp::Clear(wgpu::Color::TRANSPARENT),
-                    )
-                } else {
-                    (target, None, wgpu::LoadOp::Load)
-                };
-
-            let mut render_pass =
-                encoder.begin_render_pass(&wgpu::RenderPassDescriptor {
-                    label: Some("iced_wgpu::triangle render pass"),
-                    color_attachments: &[Some(
-                        wgpu::RenderPassColorAttachment {
-                            view: attachment,
-                            resolve_target,
-                            ops: wgpu::Operations { load, store: true },
-                        },
-                    )],
-                    depth_stencil_attachment: None,
-                });
-
-            render_pass.set_pipeline(&self.pipeline);
-
-            for (i, (vertex_offset, index_offset, indices)) in
-                offsets.into_iter().enumerate()
-            {
-                let clip_bounds = (meshes[i].clip_bounds * scale_factor).snap();
-
-                render_pass.set_scissor_rect(
-                    clip_bounds.x,
-                    clip_bounds.y,
-                    clip_bounds.width,
-                    clip_bounds.height,
-                );
-
-                render_pass.set_bind_group(
-                    0,
-                    &self.constants,
-                    &[(std::mem::size_of::<Uniforms>() * i) as u32],
-                );
-
-                render_pass.set_index_buffer(
-                    self.index_buffer
-                        .raw
-                        .slice(index_offset * mem::size_of::<u32>() as u64..),
-                    wgpu::IndexFormat::Uint32,
-                );
-
-                render_pass.set_vertex_buffer(
-                    0,
-                    self.vertex_buffer.raw.slice(
-                        vertex_offset * mem::size_of::<Vertex2D>() as u64..,
-                    ),
-                );
-
-                render_pass.draw_indexed(0..indices as u32, 0, 0..1);
             }
         }
 
         if let Some(blit) = &mut self.blit {
             blit.draw(encoder, target);
         }
+
+        //cleanup
+        self.pipelines.clear();
     }
 }
 
-#[repr(C)]
-#[derive(Debug, Clone, Copy, Zeroable, Pod)]
-struct Uniforms {
-    transform: [f32; 16],
-    // We need to align this to 256 bytes to please `wgpu`...
-    // TODO: Be smarter and stop wasting memory!
-    _padding_a: [f32; 32],
-    _padding_b: [f32; 16],
+//utility functions for individual pipelines with shared functionality
+fn vertex_buffer_layout<'a>() -> wgpu::VertexBufferLayout<'a> {
+    wgpu::VertexBufferLayout {
+        array_stride: std::mem::size_of::<Vertex2D>() as u64,
+        step_mode: wgpu::VertexStepMode::Vertex,
+        attributes: &[wgpu::VertexAttribute {
+            format: wgpu::VertexFormat::Float32x2,
+            offset: 0,
+            shader_location: 0,
+        }],
+    }
 }
 
-impl Default for Uniforms {
-    fn default() -> Self {
-        Self {
-            transform: *Transformation::identity().as_ref(),
-            _padding_a: [0.0; 32],
-            _padding_b: [0.0; 16],
-        }
+fn default_fragment_target(
+    texture_format: wgpu::TextureFormat,
+) -> Option<wgpu::ColorTargetState> {
+    Some(wgpu::ColorTargetState {
+        format: texture_format,
+        blend: Some(wgpu::BlendState::ALPHA_BLENDING),
+        write_mask: wgpu::ColorWrites::ALL,
+    })
+}
+
+fn default_triangle_primitive_state() -> wgpu::PrimitiveState {
+    wgpu::PrimitiveState {
+        topology: wgpu::PrimitiveTopology::TriangleList,
+        front_face: wgpu::FrontFace::Cw,
+        ..Default::default()
     }
 }
 
-impl From<Transformation> for Uniforms {
-    fn from(transformation: Transformation) -> Uniforms {
-        Self {
-            transform: transformation.into(),
-            _padding_a: [0.0; 32],
-            _padding_b: [0.0; 16],
-        }
+fn default_multisample_state(
+    antialiasing: Option<settings::Antialiasing>,
+) -> wgpu::MultisampleState {
+    wgpu::MultisampleState {
+        count: antialiasing.map(|a| a.sample_count()).unwrap_or(1),
+        mask: !0,
+        alpha_to_coverage_enabled: false,
     }
 }
diff --git a/wgpu/src/triangle/gradient.rs b/wgpu/src/triangle/gradient.rs
new file mode 100644
index 00000000..471b204c
--- /dev/null
+++ b/wgpu/src/triangle/gradient.rs
@@ -0,0 +1,265 @@
+use crate::buffers::dynamic_buffers::DynamicBuffer;
+use crate::settings;
+use crate::triangle::{
+    default_fragment_target, default_multisample_state,
+    default_triangle_primitive_state, vertex_buffer_layout,
+};
+use encase::ShaderType;
+use glam::{Vec2, Vec4};
+use iced_graphics::gradient::Gradient;
+use iced_graphics::Transformation;
+
+pub(super) struct GradientPipeline {
+    pipeline: wgpu::RenderPipeline,
+    pub(super) uniform_buffer: DynamicBuffer<GradientUniforms>,
+    pub(super) storage_buffer: DynamicBuffer<GradientStorage>,
+    color_stop_offset: i32,
+    //Need to store these and then write them all at once
+    //or else they will be padded to 256 and cause gaps in the storage buffer
+    color_stops_pending_write: GradientStorage,
+    bind_group_layout: wgpu::BindGroupLayout,
+    bind_group: wgpu::BindGroup,
+}
+
+//TODO I can tightly pack this by rearranging/consolidating some fields
+#[derive(Debug, ShaderType)]
+pub(super) struct GradientUniforms {
+    transform: glam::Mat4,
+    start: Vec2,
+    #[align(16)]
+    end: Vec2,
+    #[align(16)]
+    start_stop: i32,
+    #[align(16)]
+    end_stop: i32,
+}
+
+#[derive(Debug, ShaderType)]
+pub(super) struct ColorStop {
+    color: Vec4,
+    offset: f32,
+}
+
+#[derive(ShaderType)]
+pub(super) struct GradientStorage {
+    #[size(runtime)]
+    pub color_stops: Vec<ColorStop>,
+}
+
+impl GradientPipeline {
+    /// Creates a new [GradientPipeline] using `triangle_gradient.wgsl` shader.
+    pub(super) fn new(
+        device: &wgpu::Device,
+        format: wgpu::TextureFormat,
+        antialiasing: Option<settings::Antialiasing>,
+    ) -> Self {
+        let uniform_buffer = DynamicBuffer::uniform(
+            device,
+            "iced_wgpu::triangle [GRADIENT] uniforms",
+        );
+
+        //TODO: With a WASM target storage buffers are not supported. Will need to use UBOs & static 
+        // sized array (64 on OpenGL side right now) to make gradients work
+        let storage_buffer = DynamicBuffer::storage(
+            device,
+            "iced_wgpu::triangle [GRADIENT] storage",
+        );
+
+        let bind_group_layout =
+            device.create_bind_group_layout(&wgpu::BindGroupLayoutDescriptor {
+                label: Some("iced_wgpu::triangle [GRADIENT] bind group layout"),
+                entries: &[
+                    wgpu::BindGroupLayoutEntry {
+                        binding: 0,
+                        visibility: wgpu::ShaderStages::VERTEX_FRAGMENT,
+                        ty: wgpu::BindingType::Buffer {
+                            ty: wgpu::BufferBindingType::Uniform,
+                            has_dynamic_offset: true,
+                            min_binding_size: Some(GradientUniforms::min_size()),
+                        },
+                        count: None,
+                    },
+                    wgpu::BindGroupLayoutEntry {
+                        binding: 1,
+                        visibility: wgpu::ShaderStages::FRAGMENT,
+                        ty: wgpu::BindingType::Buffer {
+                            ty: wgpu::BufferBindingType::Storage {
+                                read_only: true,
+                            },
+                            has_dynamic_offset: false,
+                            min_binding_size: Some(GradientStorage::min_size()),
+                        },
+                        count: None,
+                    },
+                ],
+            });
+
+        let bind_group = GradientPipeline::bind_group(
+            device,
+            uniform_buffer.raw(),
+            storage_buffer.raw(),
+            &bind_group_layout,
+        );
+
+        let layout =
+            device.create_pipeline_layout(&wgpu::PipelineLayoutDescriptor {
+                label: Some("iced_wgpu::triangle [GRADIENT] pipeline layout"),
+                bind_group_layouts: &[&bind_group_layout],
+                push_constant_ranges: &[],
+            });
+
+        let shader =
+            device.create_shader_module(wgpu::ShaderModuleDescriptor {
+                label: Some(
+                    "iced_wgpu::triangle [GRADIENT] create shader module",
+                ),
+                source: wgpu::ShaderSource::Wgsl(std::borrow::Cow::Borrowed(
+                    include_str!("../shader/triangle_gradient.wgsl"),
+                )),
+            });
+
+        let pipeline =
+            device.create_render_pipeline(&wgpu::RenderPipelineDescriptor {
+                label: Some("iced_wgpu::triangle [GRADIENT] pipeline"),
+                layout: Some(&layout),
+                vertex: wgpu::VertexState {
+                    module: &shader,
+                    entry_point: "vs_main",
+                    buffers: &[vertex_buffer_layout()],
+                },
+                fragment: Some(wgpu::FragmentState {
+                    module: &shader,
+                    entry_point: "fs_gradient",
+                    targets: &[default_fragment_target(format)],
+                }),
+                primitive: default_triangle_primitive_state(),
+                depth_stencil: None,
+                multisample: default_multisample_state(antialiasing),
+                multiview: None,
+            });
+
+        Self {
+            pipeline,
+            uniform_buffer,
+            storage_buffer,
+            color_stop_offset: 0,
+            color_stops_pending_write: GradientStorage { color_stops: vec![] },
+            bind_group_layout,
+            bind_group,
+        }
+    }
+
+    /// Pushes a new gradient uniform to the CPU buffer.
+    pub fn push(&mut self, transform: Transformation, gradient: &Gradient) {
+        match gradient {
+            Gradient::Linear(linear) => {
+                let start_offset = self.color_stop_offset;
+                let end_offset =
+                    (linear.color_stops.len() as i32) + start_offset - 1;
+
+                self.uniform_buffer.push(&GradientUniforms {
+                    transform: transform.into(),
+                    start: Vec2::new(linear.start.x, linear.start.y),
+                    end: Vec2::new(linear.end.x, linear.end.y),
+                    start_stop: start_offset,
+                    end_stop: end_offset,
+                });
+
+                self.color_stop_offset = end_offset + 1;
+
+                let stops: Vec<ColorStop> = linear
+                    .color_stops
+                    .iter()
+                    .map(|stop| ColorStop {
+                        offset: stop.offset,
+                        color: Vec4::new(
+                            stop.color.r,
+                            stop.color.g,
+                            stop.color.b,
+                            stop.color.a,
+                        ),
+                    })
+                    .collect();
+
+                self.color_stops_pending_write.color_stops.extend(stops);
+            }
+        }
+    }
+
+    fn bind_group(
+        device: &wgpu::Device,
+        uniform_buffer: &wgpu::Buffer,
+        storage_buffer: &wgpu::Buffer,
+        layout: &wgpu::BindGroupLayout,
+    ) -> wgpu::BindGroup {
+        device.create_bind_group(&wgpu::BindGroupDescriptor {
+            label: Some("iced_wgpu::triangle [GRADIENT] bind group"),
+            layout,
+            entries: &[
+                wgpu::BindGroupEntry {
+                    binding: 0,
+                    resource: wgpu::BindingResource::Buffer(
+                        wgpu::BufferBinding {
+                            buffer: uniform_buffer,
+                            offset: 0,
+                            size: Some(GradientUniforms::min_size())
+                        }
+                    )
+                },
+                wgpu::BindGroupEntry {
+                    binding: 1,
+                    resource: storage_buffer.as_entire_binding()
+                },
+            ],
+        })
+    }
+
+    /// Writes the contents of the gradient CPU buffer to the GPU buffer, resizing the GPU buffer
+    /// beforehand if necessary.
+    pub fn write(
+        &mut self,
+        device: &wgpu::Device,
+        staging_belt: &mut wgpu::util::StagingBelt,
+        encoder: &mut wgpu::CommandEncoder,
+    ) {
+        //first write the pending color stops to the CPU buffer
+        self.storage_buffer.push(&self.color_stops_pending_write);
+
+        //resize buffers if needed
+        let uniforms_resized = self.uniform_buffer.resize(device);
+        let storage_resized = self.storage_buffer.resize(device);
+
+        if uniforms_resized || storage_resized {
+            //recreate bind groups if any buffers were resized
+            self.bind_group = GradientPipeline::bind_group(
+                device,
+                self.uniform_buffer.raw(),
+                self.storage_buffer.raw(),
+                &self.bind_group_layout,
+            );
+        }
+
+        //write to GPU
+        self.uniform_buffer.write(device, staging_belt, encoder);
+        self.storage_buffer.write(device, staging_belt, encoder);
+
+        //cleanup
+        self.color_stop_offset = 0;
+        self.color_stops_pending_write.color_stops.clear();
+    }
+
+    /// Configures the current render pass to draw the gradient at its offset stored in the
+    /// [DynamicBuffer] at [index].
+    pub fn configure_render_pass<'a>(
+        &'a self,
+        render_pass: &mut wgpu::RenderPass<'a>,
+        index: usize,
+    ) {
+        render_pass.set_pipeline(&self.pipeline);
+        render_pass.set_bind_group(
+            0,
+            &self.bind_group,
+            &[self.uniform_buffer.offset_at_index(index)],
+        );
+    }
+}
diff --git a/wgpu/src/triangle/solid.rs b/wgpu/src/triangle/solid.rs
new file mode 100644
index 00000000..a3cbd72b
--- /dev/null
+++ b/wgpu/src/triangle/solid.rs
@@ -0,0 +1,169 @@
+use crate::buffers::dynamic_buffers::DynamicBuffer;
+use crate::triangle::{
+    default_fragment_target, default_multisample_state,
+    default_triangle_primitive_state, vertex_buffer_layout,
+};
+use crate::{settings, Color};
+use encase::ShaderType;
+use glam::Vec4;
+use iced_graphics::Transformation;
+
+pub(super) struct SolidPipeline {
+    pipeline: wgpu::RenderPipeline,
+    pub(super) buffer: DynamicBuffer<SolidUniforms>,
+    bind_group_layout: wgpu::BindGroupLayout,
+    bind_group: wgpu::BindGroup,
+}
+
+#[derive(Debug, Clone, Copy, ShaderType)]
+pub(super) struct SolidUniforms {
+    transform: glam::Mat4,
+    color: Vec4,
+}
+
+impl SolidUniforms {
+    pub fn new(transform: Transformation, color: Color) -> Self {
+        Self {
+            transform: transform.into(),
+            color: Vec4::new(color.r, color.g, color.b, color.a),
+        }
+    }
+}
+
+impl SolidPipeline {
+    /// Creates a new [SolidPipeline] using `triangle_solid.wgsl` shader.
+    pub fn new(
+        device: &wgpu::Device,
+        format: wgpu::TextureFormat,
+        antialiasing: Option<settings::Antialiasing>,
+    ) -> Self {
+        let buffer = DynamicBuffer::uniform(
+            device,
+            "iced_wgpu::triangle [SOLID] uniforms",
+        );
+
+        let bind_group_layout =
+            device.create_bind_group_layout(&wgpu::BindGroupLayoutDescriptor {
+                label: Some("iced_wgpu::triangle [SOLID] bind group layout"),
+                entries: &[wgpu::BindGroupLayoutEntry {
+                    binding: 0,
+                    visibility: wgpu::ShaderStages::VERTEX_FRAGMENT,
+                    ty: wgpu::BindingType::Buffer {
+                        ty: wgpu::BufferBindingType::Uniform,
+                        has_dynamic_offset: true,
+                        min_binding_size: Some(SolidUniforms::min_size()),
+                    },
+                    count: None,
+                }],
+            });
+
+        let bind_group = SolidPipeline::bind_group(
+            device,
+            &buffer.raw(),
+            &bind_group_layout,
+        );
+
+        let layout =
+            device.create_pipeline_layout(&wgpu::PipelineLayoutDescriptor {
+                label: Some("iced_wgpu::triangle [SOLID] pipeline layout"),
+                bind_group_layouts: &[&bind_group_layout],
+                push_constant_ranges: &[],
+            });
+
+        let shader =
+            device.create_shader_module(wgpu::ShaderModuleDescriptor {
+                label: Some("iced_wgpu::triangle [SOLID] create shader module"),
+                source: wgpu::ShaderSource::Wgsl(std::borrow::Cow::Borrowed(
+                    include_str!("../shader/triangle_solid.wgsl"),
+                )),
+            });
+
+        let pipeline =
+            device.create_render_pipeline(&wgpu::RenderPipelineDescriptor {
+                label: Some("iced_wgpu::triangle [SOLID] pipeline"),
+                layout: Some(&layout),
+                vertex: wgpu::VertexState {
+                    module: &shader,
+                    entry_point: "vs_main",
+                    buffers: &[vertex_buffer_layout()],
+                },
+                fragment: Some(wgpu::FragmentState {
+                    module: &shader,
+                    entry_point: "fs_solid",
+                    targets: &[default_fragment_target(format)],
+                }),
+                primitive: default_triangle_primitive_state(),
+                depth_stencil: None,
+                multisample: default_multisample_state(antialiasing),
+                multiview: None,
+            });
+
+        Self {
+            pipeline,
+            buffer,
+            bind_group_layout,
+            bind_group,
+        }
+    }
+
+    fn bind_group(
+        device: &wgpu::Device,
+        buffer: &wgpu::Buffer,
+        layout: &wgpu::BindGroupLayout,
+    ) -> wgpu::BindGroup {
+        device.create_bind_group(&wgpu::BindGroupDescriptor {
+            label: Some("iced_wgpu::triangle [SOLID] bind group"),
+            layout,
+            entries: &[wgpu::BindGroupEntry {
+                binding: 0,
+                resource: wgpu::BindingResource::Buffer(wgpu::BufferBinding {
+                    buffer,
+                    offset: 0,
+                    size: Some(SolidUniforms::min_size()),
+                }),
+            }],
+        })
+    }
+
+    /// Pushes a new solid uniform to the CPU buffer.
+    pub fn push(&mut self, transform: Transformation, color: &Color) {
+        self.buffer.push(&SolidUniforms::new(transform, *color));
+    }
+
+    /// Writes the contents of the solid CPU buffer to the GPU buffer, resizing the GPU buffer
+    /// beforehand if necessary.
+    pub fn write(
+        &mut self,
+        device: &wgpu::Device,
+        staging_belt: &mut wgpu::util::StagingBelt,
+        encoder: &mut wgpu::CommandEncoder,
+    ) {
+        let uniforms_resized = self.buffer.resize(device);
+
+        if uniforms_resized {
+            self.bind_group = SolidPipeline::bind_group(
+                device,
+                self.buffer.raw(),
+                &self.bind_group_layout,
+            )
+        }
+
+        self.buffer.write(device, staging_belt, encoder);
+    }
+
+    /// Configures the current render pass to draw the solid at its offset stored in the
+    /// [DynamicBuffer] at [index].
+    pub fn configure_render_pass<'a>(
+        &'a self,
+        render_pass: &mut wgpu::RenderPass<'a>,
+        index: usize,
+    ) {
+        render_pass.set_pipeline(&self.pipeline);
+
+        render_pass.set_bind_group(
+            0,
+            &self.bind_group,
+            &[self.buffer.offset_at_index(index)],
+        );
+    }
+}
\ No newline at end of file