diff --git a/app/src/recipe.rs b/app/src/recipe.rs
index e7b5610..c7ab484 100644
--- a/app/src/recipe.rs
+++ b/app/src/recipe.rs
@@ -824,12 +824,13 @@ fn RecipeViewerInner(props: &RecipeViewerInnerProps) -> HtmlResult {
                 <ul class="list-group mb-2">
                     {for r.ingredients.iter().map(|(id, info, amount)| {
                         let delete_modal_id = format!("rcpRmIg{id}");
+                        let amount_rounded = amount.round();
                         html!{
                         <li
                             key={*id}
                             class="list-group-item d-flex justify-content-between align-items-center"
                         >
-                            {format!("{amount}{} {}", info.unit.as_deref().unwrap_or(""), info.name)}
+                            {format!("{amount_rounded}{} {}", info.unit.as_deref().unwrap_or(""), info.name)}
                             <div>
                                 <ConfirmDangerModal
                                     id={delete_modal_id.clone()}