diff --git a/stopwatch/static/util.js b/stopwatch/static/util.js
new file mode 100644
index 0000000..634bd7b
--- /dev/null
+++ b/stopwatch/static/util.js
@@ -0,0 +1,57 @@
+scrollUpButton()
+
+function scrollUpButton() {
+ var body = document.querySelector('body');
+ var button = document.createElement('div');
+ var offset = (document.querySelector('body').clientWidth - document.querySelector('main').clientWidth) / 2;
+ window.showScrollUp = false
+
+ button.id = 'scroll-up-button'
+ css(button, {
+ position: "fixed",
+ width: "40px",
+ height: "40px",
+ bottom: "30px",
+ right: `${offset + 30}px`,
+ color: "#333333 !important",
+ opacity: 0,
+ cursor: 'pointer',
+ visibility: 'hidden',
+ transition: '0.3s ease opacity'
+ })
+
+ button.innerHTML += ``
+
+ var svg = button.querySelector('svg')
+ css(svg, {
+ borderRadius: '20px',
+ background: 'white'
+ })
+
+ button.addEventListener("click", () => {
+ window.scrollTo(0, 0);
+ })
+
+ body.append(button)
+
+ document.addEventListener("scroll", () => {
+ if (window.scrollY > window.innerHeight && !window.showScrollUp) {
+ var el = document.getElementById('scroll-up-button');
+ window.showScrollUp = true
+ css(el, { opacity: 1, visibility: 'visible' })
+ }
+ if (window.scrollY < window.innerHeight && window.showScrollUp) {
+ var el = document.getElementById('scroll-up-button');
+ window.showScrollUp = false
+ css(el, { opacity: 0 })
+ setTimeout(() => css(el, { visibility: 'hidden' }), 300)
+ }
+ });
+}
+
+function css(element, style) {
+ for (const property in style)
+ element.style[property] = style[property];
+}
\ No newline at end of file
diff --git a/stopwatch/templates/base.html b/stopwatch/templates/base.html
index 9ec8a0d..c5734f1 100644
--- a/stopwatch/templates/base.html
+++ b/stopwatch/templates/base.html
@@ -255,6 +255,7 @@
+
{% block extra_js %}