diff --git a/app/assets/javascripts/feedback/score.ts b/app/assets/javascripts/feedback/score.ts
index 8151cc82d2..2b728a06bd 100644
--- a/app/assets/javascripts/feedback/score.ts
+++ b/app/assets/javascripts/feedback/score.ts
@@ -14,7 +14,7 @@ import FeedbackActions from "feedback/actions";
 export default class ScoreForm {
     private readonly input: HTMLInputElement;
     private readonly expectedScore: HTMLInputElement;
-    private readonly spinner: HTMLElement;
+    private readonly scoreState: HTMLElement;
     private readonly deleteButton: HTMLButtonElement;
     private readonly zeroButton: HTMLButtonElement;
     private readonly maxButton: HTMLButtonElement;
@@ -32,7 +32,7 @@ export default class ScoreForm {
 
         this.form = element.querySelector(".score-form") as HTMLFormElement;
         this.input = this.form.querySelector("input.score-input");
-        this.spinner = this.form.querySelector(".dodona-progress");
+        this.scoreState = this.form.querySelector(".score-state");
         this.expectedScore = this.form.querySelector(".score-form input.expected-score");
         this.deleteButton = this.form.parentElement.querySelector(".delete-button");
         this.zeroButton = this.form.parentElement.querySelector(".single-zero-button");
@@ -61,8 +61,12 @@ export default class ScoreForm {
         });
         const delay = createDelayer();
         this.input.addEventListener("change", ev => {
-            // If the score is not valid, don't do anything.
+            // If the score is not valid, show warning.
             if (!this.input.reportValidity()) {
+                const icon = document.createElement("i");
+                icon.classList.add("mdi", "mdi-alert-circle-outline", "mdi-18", "colored-wrong");
+                icon.setAttribute("aria-hidden", "true");
+                this.scoreState.replaceChildren(icon);
                 return;
             }
             // Mark as busy to show we are aware an update should happen.
@@ -207,7 +211,11 @@ export default class ScoreForm {
         this.parent.registerUpdating(this.scoreItemId);
         this.input.classList.add("in-progress");
         this.maxText.classList.add("in-progress");
-        this.spinner.style.visibility = "visible";
+
+        const span = document.createElement("span");
+        span.classList.add("spinner-border", "spinner-border-sm", "colored-warning");
+        span.setAttribute("aria-hidden", "true");
+        this.scoreState.replaceChildren(span);
     }
 
     public markBusy(): void {
diff --git a/app/assets/stylesheets/base.css.scss b/app/assets/stylesheets/base.css.scss
index 30fdb8fb7f..f0a1ca42c5 100644
--- a/app/assets/stylesheets/base.css.scss
+++ b/app/assets/stylesheets/base.css.scss
@@ -52,7 +52,7 @@
 @import "../../../node_modules/bootstrap/scss/tooltip";
 @import "../../../node_modules/bootstrap/scss/popover";
 //@import "../../../node_modules/bootstrap/scss/carousel";
-//@import "../../../node_modules/bootstrap/scss/spinners";
+@import "../../../node_modules/bootstrap/scss/spinners";
 //@import "../../../node_modules/bootstrap/scss/offcanvas";
 @import "../../../node_modules/bootstrap/scss/helpers";
 @import "../../../node_modules/bootstrap/scss/utilities/api";
diff --git a/app/assets/stylesheets/components/evaluations.css.scss b/app/assets/stylesheets/components/evaluations.css.scss
index 7f6ed1b7f5..7a63bd0405 100644
--- a/app/assets/stylesheets/components/evaluations.css.scss
+++ b/app/assets/stylesheets/components/evaluations.css.scss
@@ -75,7 +75,7 @@
         color: $text-color;
         text-align: center;
         background-color: $input-group-addon-bg;
-        border: 1px solid $input-group-addon-border-color;
+        border: 1px solid $border-color;
         opacity: 1;
         cursor: auto;
       }
@@ -85,6 +85,19 @@
         border-bottom-right-radius: 0;
       }
 
+      .score-input{
+        border-right: none;
+        border-color: $border-color;
+        margin-right: -28px;
+        padding-right: 28px;
+      }
+      .score-state{
+        border-left: none;
+        width: 28px;
+        background-color: $input-bg;
+        padding: 0;
+      }
+
       .dodona-progress .bar {
         border-bottom-left-radius: 6px;
         border-bottom-right-radius: 6px;
diff --git a/app/views/feedbacks/_score_actions.html.erb b/app/views/feedbacks/_score_actions.html.erb
index dbb4e51646..2abce9aa30 100644
--- a/app/views/feedbacks/_score_actions.html.erb
+++ b/app/views/feedbacks/_score_actions.html.erb
@@ -17,6 +17,12 @@
                              min: 0,
                              max: score_item.maximum,
                              value: format_score(f.object.score, lang='en', numeric_only=true) %>
+
+          <%= button_tag class: "btn btn-secondary score-state", disabled: true, type: :button do %>
+            <% unless score.score.nil? %>
+              <i class="mdi mdi-check mdi-18 colored-info" aria-hidden='true'></i>
+            <% end %>
+          <% end %>
           <%= button_tag class: "btn btn-secondary max-text", disabled: true, type: :button, data: { max: format_score(score_item.maximum, lang='en', numeric_only=true) } do %>
             / <%= format_score(score_item.maximum) %>
           <% end %>
@@ -27,11 +33,6 @@
             <i class="mdi mdi-thumb-up-outline mdi-12" aria-hidden='true'></i>
           <% end %>
         </div>
-        <div class="dodona-progress dodona-progress-indeterminate">
-          <div class="progressbar bar bar1" style="width: 0;"></div>
-          <div class="bufferbar bar bar2" style="width: 100%;"></div>
-          <div class="auxbar bar bar3" style="width: 0;"></div>
-        </div>
       </div>
     </div>
     <%= f.hidden_field :score_item_id, class: "score-item" %>