diff --git a/components/button.css b/components/button.css
new file mode 100644
index 0000000..84813d0
--- /dev/null
+++ b/components/button.css
@@ -0,0 +1,36 @@
+.button-container {
+  display: flex;
+  position: relative;
+  align-items: flex-start;
+  flex-direction: column;
+}
+.button-text {
+  color: var(--dl-color-gray-white);
+  cursor: pointer;
+  align-self: center;
+  margin-top: var(--dl-space-space-halfunit);
+  transition: 0.3s;
+  margin-left: var(--dl-space-space-halfunit);
+  padding-top: var(--dl-space-space-halfunit);
+  margin-right: var(--dl-space-space-halfunit);
+  padding-left: var(--dl-space-space-oneandhalfunits);
+  border-radius: var(--dl-radius-radius-radius8);
+  margin-bottom: var(--dl-space-space-halfunit);
+  padding-right: var(--dl-space-space-oneandhalfunits);
+  padding-bottom: var(--dl-space-space-halfunit);
+  background-color: var(--dl-color-primary-300);
+}
+.button-text:hover {
+  color: var(--dl-color-primary-300);
+  background-color: var(--dl-color-gray-white);
+}
+
+
+
+
+
+
+
+
+
+