diff --git a/crabfit-frontend/src/components/Button/buttonStyle.ts b/crabfit-frontend/src/components/Button/buttonStyle.ts
index b46842e..7786925 100644
--- a/crabfit-frontend/src/components/Button/buttonStyle.ts
+++ b/crabfit-frontend/src/components/Button/buttonStyle.ts
@@ -26,6 +26,7 @@ export const Top = styled.button`
 	width: var(--btn-width);
 	position: absolute;
 	top: -4px;
+	left: 0;
 	user-select: none;
 	transition: top .15s;
 	outline: none;
diff --git a/crabfit-frontend/src/components/CalendarField/CalendarField.tsx b/crabfit-frontend/src/components/CalendarField/CalendarField.tsx
index 8636276..46e6006 100644
--- a/crabfit-frontend/src/components/CalendarField/CalendarField.tsx
+++ b/crabfit-frontend/src/components/CalendarField/CalendarField.tsx
@@ -8,6 +8,7 @@ import {
 	StyledLabel,
 	StyledSubLabel,
 	CalendarHeader,
+	CalendarDays,
 	CalendarBody,
 	Date,
 	Day,
@@ -141,10 +142,12 @@ const CalendarField = ({
 				>&gt;</Button>
 			</CalendarHeader>
 
-			<CalendarBody>
+			<CalendarDays>
 				{days.map((name, i) =>
 					<Day key={i}>{name}</Day>
 				)}
+			</CalendarDays>
+			<CalendarBody>
 				{dates.length > 0 && dates.map((dateRow, y) =>
 					dateRow.map((date, x) =>
 						<Date
@@ -155,12 +158,13 @@ const CalendarField = ({
 							selected={selectedDates.includes(date.format('DDMMYYYY'))}
 							selecting={selectingDates.includes(date)}
 							mode={mode}
-							onMouseDown={() => {
+							onPointerDown={(e) => {
 								startPos.current = {x, y};
 								setMode(selectedDates.includes(date.format('DDMMYYYY')) ? 'remove' : 'add');
 								setSelectingDates([date]);
+								e.currentTarget.releasePointerCapture(e.pointerId);
 
-								document.addEventListener('mouseup', () => {
+								document.addEventListener('pointerup', () => {
 									if (staticMode.current === 'add') {
 										setSelectedDates([...selectedDates, ...staticSelectingDates.current.map(d => d.format('DDMMYYYY'))]);
 									} else if (staticMode.current === 'remove') {
@@ -170,7 +174,7 @@ const CalendarField = ({
 									setMode(null);
 								}, { once: true });
 							}}
-							onMouseEnter={() => {
+							onPointerEnter={() => {
 								if (staticMode.current) {
 									let found = [];
 									for (let cy = Math.min(startPos.current.y, y); cy < Math.max(startPos.current.y, y)+1; cy++) {
diff --git a/crabfit-frontend/src/components/CalendarField/calendarFieldStyle.ts b/crabfit-frontend/src/components/CalendarField/calendarFieldStyle.ts
index 32d3cbc..a8f7e18 100644
--- a/crabfit-frontend/src/components/CalendarField/calendarFieldStyle.ts
+++ b/crabfit-frontend/src/components/CalendarField/calendarFieldStyle.ts
@@ -27,21 +27,40 @@ export const CalendarHeader = styled.div`
 	font-weight: bold;
 `;
 
-export const CalendarBody = styled.div`
+export const CalendarDays = styled.div`
 	display: grid;
 	grid-template-columns: repeat(7, 1fr);
 	grid-gap: 2px;
 `;
 
+export const CalendarBody = styled.div`
+	display: grid;
+	grid-template-columns: repeat(7, 1fr);
+	grid-gap: 2px;
+
+	& div:first-child {
+		border-top-left-radius: 3px;
+	}
+	& div:nth-child(7) {
+		border-top-right-radius: 3px;
+	}
+	& div:nth-last-child(7) {
+		border-bottom-left-radius: 3px;
+	}
+	& div:last-child {
+		border-bottom-right-radius: 3px;
+	}
+`;
+
 export const Date = styled.div`
-	background-color: ${props => props.theme.primary}22;
+	background-color: ${props => props.theme.primaryBackground};
 	border: 1px solid ${props => props.theme.primaryLight};
 	display: flex;
 	align-items: center;
 	justify-content: center;
 	padding: 10px 0;
-	border-radius: 3px;
 	user-select: none;
+	touch-action: none;
 
 	${props => props.otherMonth && `
 		color: ${props.theme.primaryLight};
@@ -49,6 +68,7 @@ export const Date = styled.div`
 	${props => props.isToday && `
 		font-weight: 900;
 		color: ${props.theme.primaryDark};
+		text-decoration: underline;
 	`}
 	${props => (props.selected || (props.mode === 'add' && props.selecting)) && `
 		color: ${props.otherMonth ? 'rgba(255,255,255,.5)' : '#FFF'};
@@ -56,7 +76,7 @@ export const Date = styled.div`
 		border-color: ${props.theme.primary};
 	`}
 	${props => props.mode === 'remove' && props.selecting && `
-		background-color: ${props.theme.primary}22;
+		background-color: ${props.theme.primaryBackground};
 		border: 1px solid ${props.theme.primaryLight};
 		color: ${props.isToday ? props.theme.primaryDark : (props.otherMonth ? props.theme.primaryLight : 'inherit')};
 	`}
diff --git a/crabfit-frontend/src/components/Center/Center.ts b/crabfit-frontend/src/components/Center/Center.ts
new file mode 100644
index 0000000..672d325
--- /dev/null
+++ b/crabfit-frontend/src/components/Center/Center.ts
@@ -0,0 +1,7 @@
+import styled from '@emotion/styled';
+
+const Center = styled.div`
+	text-align: center;
+`;
+
+export default Center;
diff --git a/crabfit-frontend/src/components/SelectField/SelectField.tsx b/crabfit-frontend/src/components/SelectField/SelectField.tsx
new file mode 100644
index 0000000..9a5c1ed
--- /dev/null
+++ b/crabfit-frontend/src/components/SelectField/SelectField.tsx
@@ -0,0 +1,33 @@
+import {
+	Wrapper,
+	StyledLabel,
+	StyledSubLabel,
+	StyledSelect,
+} from './selectFieldStyle';
+
+const SelectField = ({
+	label,
+	subLabel,
+	id,
+	options = [],
+	register,
+	...props
+}) => (
+	<Wrapper>
+		{label && <StyledLabel htmlFor={id}>{label}</StyledLabel>}
+		{subLabel && <StyledSubLabel htmlFor={id}>{subLabel}</StyledSubLabel>}
+
+		<StyledSelect
+			id={id}
+			ref={register}
+			{...props}
+		>
+			<option value="">Select...</option>
+			{options.map((value, i) =>
+				<option key={i} value={value}>{value}</option>
+			)}
+		</StyledSelect>
+	</Wrapper>
+);
+
+export default SelectField;
diff --git a/crabfit-frontend/src/components/SelectField/selectFieldStyle.ts b/crabfit-frontend/src/components/SelectField/selectFieldStyle.ts
new file mode 100644
index 0000000..f7ea95d
--- /dev/null
+++ b/crabfit-frontend/src/components/SelectField/selectFieldStyle.ts
@@ -0,0 +1,37 @@
+import styled from '@emotion/styled';
+
+export const Wrapper = styled.div`
+	margin: 30px 0;
+`;
+
+export const StyledLabel = styled.label`
+	display: block;
+	padding-bottom: 4px;
+	font-size: 18px;
+`;
+
+export const StyledSubLabel = styled.label`
+	display: block;
+	padding-bottom: 6px;
+	font-size: 13px;
+	opacity: .6;
+`;
+
+export const StyledSelect = styled.select`
+	width: 100%;
+	box-sizing: border-box;
+	font: inherit;
+	background: ${props => props.theme.primaryBackground};
+	color: inherit;
+	padding: 10px 14px;
+	border: 1px solid ${props => props.theme.primaryLight};
+	box-shadow: inset 0 0 0 0 ${props => props.theme.primaryLight};
+	border-radius: 3px;
+	outline: none;
+	transition: border-color .15s, box-shadow .15s;
+
+	&:focus {
+		border: 1px solid ${props => props.theme.primary};
+		box-shadow: inset 0 -3px 0 0 ${props => props.theme.primary};
+	}
+`;
diff --git a/crabfit-frontend/src/components/TextField/textFieldStyle.ts b/crabfit-frontend/src/components/TextField/textFieldStyle.ts
index ac37df0..4cb94c7 100644
--- a/crabfit-frontend/src/components/TextField/textFieldStyle.ts
+++ b/crabfit-frontend/src/components/TextField/textFieldStyle.ts
@@ -21,7 +21,7 @@ export const StyledInput = styled.input`
 	width: 100%;
 	box-sizing: border-box;
 	font: inherit;
-	background: ${props => props.theme.primary}22;
+	background: ${props => props.theme.primaryBackground};
 	color: inherit;
 	padding: 10px 14px;
 	border: 1px solid ${props => props.theme.primaryLight};
diff --git a/crabfit-frontend/src/components/TimeRangeField/timeRangeFieldStyle.ts b/crabfit-frontend/src/components/TimeRangeField/timeRangeFieldStyle.ts
index ddaefb3..71ff617 100644
--- a/crabfit-frontend/src/components/TimeRangeField/timeRangeFieldStyle.ts
+++ b/crabfit-frontend/src/components/TimeRangeField/timeRangeFieldStyle.ts
@@ -19,7 +19,7 @@ export const StyledSubLabel = styled.label`
 
 export const Range = styled.div`
 	user-select: none;
-	background-color: ${props => props.theme.primary}22;
+	background-color: ${props => props.theme.primaryBackground};
 	border: 1px solid ${props => props.theme.primaryLight};
 	border-radius: 3px;
 	height: 50px;
@@ -37,6 +37,7 @@ export const Handle = styled.div`
 	top: -10px;
 	left: calc(${props => props.value * 4.1666666666666666}% - 11px);
 	cursor: ew-resize;
+	touch-action: none;
 
 	&:after {
 		content: '|||';
diff --git a/crabfit-frontend/src/components/index.ts b/crabfit-frontend/src/components/index.ts
index 0146924..1d51137 100644
--- a/crabfit-frontend/src/components/index.ts
+++ b/crabfit-frontend/src/components/index.ts
@@ -1,4 +1,6 @@
 export { default as TextField } from './TextField/TextField';
+export { default as SelectField } from './SelectField/SelectField';
 export { default as CalendarField } from './CalendarField/CalendarField';
 export { default as TimeRangeField } from './TimeRangeField/TimeRangeField';
 export { default as Button } from './Button/Button';
+export { default as Center } from './Center/Center';
diff --git a/crabfit-frontend/src/pages/Home/Home.tsx b/crabfit-frontend/src/pages/Home/Home.tsx
index b57eda4..e28421b 100644
--- a/crabfit-frontend/src/pages/Home/Home.tsx
+++ b/crabfit-frontend/src/pages/Home/Home.tsx
@@ -4,7 +4,9 @@ import {
 	TextField,
 	CalendarField,
 	TimeRangeField,
+	SelectField,
 	Button,
+	Center,
 } from 'components';
 
 import {
@@ -12,15 +14,26 @@ import {
 	CreateForm,
 	TitleSmall,
 	TitleLarge,
+	Logo,
 } from './homeStyle';
 
+import logo from 'res/logo.svg';
+import timezones from 'res/timezones.json';
+
 const Home = () => {
-	const { register, handleSubmit } = useForm();
+	const { register, handleSubmit } = useForm({
+		defaultValues: {
+			timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,
+		},
+	});
 
 	const onSubmit = data => console.log('submit', data);
 
 	return (
 		<StyledMain>
+			<Center>
+				<Logo src={logo} alt="" />
+			</Center>
 			<TitleSmall>Create a</TitleSmall>
 			<TitleLarge>CRAB FIT</TitleLarge>
 
@@ -50,7 +63,18 @@ const Home = () => {
 					register={register}
 				/>
 
-				<Button type="submit">Create</Button>
+				<SelectField
+					label="And the timezone"
+					name="timezone"
+					id="timezone"
+					register={register}
+					options={timezones}
+					required
+				/>
+
+				<Center>
+					<Button type="submit">Create</Button>
+				</Center>
 			</CreateForm>
 		</StyledMain>
 	);
diff --git a/crabfit-frontend/src/pages/Home/homeStyle.ts b/crabfit-frontend/src/pages/Home/homeStyle.ts
index c9a75be..f4cb919 100644
--- a/crabfit-frontend/src/pages/Home/homeStyle.ts
+++ b/crabfit-frontend/src/pages/Home/homeStyle.ts
@@ -2,8 +2,8 @@ import styled from '@emotion/styled';
 
 export const StyledMain = styled.main`
 	width: 600px;
-	margin: 30px auto;
-	max-width: calc(100% - 30px);
+	margin: 20px auto;
+	max-width: calc(100% - 60px);
 `;
 
 export const CreateForm = styled.form`
@@ -11,7 +11,7 @@ export const CreateForm = styled.form`
 
 export const TitleSmall = styled.span`
 	display: block;
-	margin: 20px 0 0;
+	margin: 0;
 	font-size: 3rem;
 	text-align: center;
 	font-family: 'CF Samurai Bob';
@@ -30,3 +30,7 @@ export const TitleLarge = styled.h1`
 	text-shadow: 0 4px 0 ${props => props.theme.primaryDark};
 	line-height: 1em;
 `;
+
+export const Logo = styled.img`
+	width: 80px;
+`;
diff --git a/crabfit-frontend/src/res/create_banner.svg b/crabfit-frontend/src/res/create_banner.svg
deleted file mode 100644
index c4c1aff..0000000
--- a/crabfit-frontend/src/res/create_banner.svg
+++ /dev/null
@@ -1,61 +0,0 @@
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" width="1024" height="512" viewBox="0 0 1024 512">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #f79e00;
-      }
-
-      .cls-2 {
-        fill: #f4bb60;
-      }
-
-      .cls-3 {
-        fill: #f47f00;
-        opacity: 0.5;
-      }
-    </style>
-  </defs>
-  <g>
-    <path class="cls-1" d="M197.1,316.71a63.14,63.14,0,0,0-21-4.09c-29.16,0-44.69,26.71-44.69,47.15,0,6,1.36,11.44,4.08,15.53,4.64,7.08,10.63,12.81,21.81,12.81,8.44,0,20.16-3.27,36.51-12l10.08,33.24c-20.71,10.36-38.42,14.72-53.13,14.72-37.34,0-55.87-28.07-55.87-60.23,0-35.42,28.07-86.65,76-86.65A77.44,77.44,0,0,1,199,282.65Z"/>
-    <path class="cls-1" d="M220,289.73h.55c27.79-9.26,50.41-13.62,67.85-13.62,28.61,0,43.33,11.71,43.87,32.7.82,22.61-13.08,46.05-41.42,63.49,13.36,6.54,28.07,12,39,14.44-4.9,10.09-11.17,22.89-16.35,33-16.35-5.45-44.14-18-62.4-29.71.27,9.54.54,19.08,1.36,28.89-12.26.54-23.71,3-36,3.54-.27-11.44-.55-22.62-.55-34.06,0-33,1.37-66.22,4.09-98.38Zm75.49,32.43c4.36-7.9-1.91-10.63-10.9-10.63-10.09,0-24,3.27-31.89,5.18-.82,12.26-1.36,24.8-1.91,37.33C268.22,350.23,290.3,332,295.48,322.16Z"/>
-    <path class="cls-1" d="M402.57,277.2h.54c15.27,44.69,31.34,89.65,51.78,131.07-11.17,3.54-23.16,8.18-34.61,12-1.9-3.54-3.54-7.36-5.18-11.17l-39.78,9c-.82,2.73-1.64,5.45-2.45,7.9-12.54,1.37-26.71,2.46-39.24,3.82C338,397.64,380.22,305.54,402.57,277.2Zm1.63,104.37c-2.72-8.45-5.45-17.17-7.63-26.16-4.63,9-8.44,19.89-12.26,31.33Z"/>
-    <path class="cls-1" d="M455.43,359.49c0-27.25,2.46-51.5,4.36-75.75C479.14,281,502.85,277.47,520,278c36.52.28,48.78,11.72,48.78,24.26,0,12.8-12.81,26.43-26.44,30.52,25.89,2.18,36.25,15.26,35.7,28.07-1.63,42.78-65.94,59.95-117.72,65.4A464.72,464.72,0,0,1,455.43,359.49Zm36.25,26.71c31.34-4.63,45-13.63,45-20.17,0-4.63-6.54-8.17-18.53-8.17-7.36,0-16.62,1.36-27.25,4.36C490.86,370.12,491.13,378,491.68,386.2Zm.82-59.14c25.07-4.9,36.51-12,36.51-16.62,0-2.72-3.81-4.63-11.44-4.63-5.73,0-13.9,1.09-23.71,3.81C493.31,314.26,492.5,322.16,492.5,327.06Z"/>
-    <path class="cls-1" d="M748.11,276.11l.81,34.06c-13.62,1.36-25.34,2.72-39,7.36-1.1,5.72-1.37,13.62-1.64,22.89,10.9-2.18,22.35-3.82,32.7-4.91.27,10.09.55,22.89.55,33A243.26,243.26,0,0,0,709.14,375c.82,16.07,2.18,31.61,3.27,42l-34.61,9.54c-3.27-18.53-4.36-39-4.36-60.5,0-25.88,1.63-53.14,3.81-78.75C699.33,280.19,727.12,276.11,748.11,276.11Z"/>
-    <path class="cls-1" d="M763.36,315.89c0-11.17.28-22.34.55-33.52,12.53-2.18,24-2.18,36.24-4.08-1.36,16.89-1.91,33.79-1.91,50.41,0,29.43,1.91,58.86,4.64,87.47-11.72,2.18-23.71,3.55-35.16,5.73C765,387.56,763.36,351.86,763.36,315.89Z"/>
-    <path class="cls-1" d="M814.59,325.43c-.27-11.72-1.63-24-1.63-36.24a478.75,478.75,0,0,1,83.66-13.08v34.6c-7.9.55-16.08,1.09-24,2.18-1.36,19.08-2.18,37.88-2.18,57,0,16.35.54,32.7,1.91,48.78-12.27.81-23.71,3-36,3.81-.27-11.72-.54-23.43-.54-35.42,0-22.62.54-45.51,1.91-68.13C830.13,320.8,822.22,323,814.59,325.43Z"/>
-  </g>
-  <g>
-    <path class="cls-2" d="M164.83,164.11a40.8,40.8,0,0,0-13.58-2.65c-18.88,0-28.94,17.29-28.94,30.53A18.09,18.09,0,0,0,125,202c3,4.59,6.88,8.3,14.11,8.3,5.47,0,13.06-2.12,23.65-7.77l6.52,21.53c-13.41,6.7-24.87,9.53-34.4,9.53-24.17,0-36.17-18.18-36.17-39,0-22.93,18.17-56.1,49.23-56.1a50.18,50.18,0,0,1,18.17,3.52Z"/>
-    <path class="cls-2" d="M224.29,138.17c14.82,0,27.53,4.94,28.06,21.35.53,15-9,29.11-28.59,39.35,8.83,6.17,19.06,11.64,26.82,14.46-4.06,6.18-9.17,13.94-13.23,19.94-10.06-4.94-27-15.35-37.76-24.35q.27,10.86,1.06,21.71c-7.94.52-15.35,1.94-23.29,2.47-.18-7.41-.35-14.65-.35-22.06,0-21.52.88-43.23,2.64-63.87C187.06,144.7,207.18,138.17,224.29,138.17Zm4.24,30c2.82-5.3-1.06-6.88-6.88-6.88-6.53,0-15.71,1.94-20.82,3.17q-.79,10.32-1.06,20.64C211.06,183.16,225.18,174.52,228.53,168.17Z"/>
-    <path class="cls-2" d="M309.69,140.82l.53,21.52c-9.88.36-15.17.89-25.05,3.53-.53,3.71-1.06,7.24-1.24,10.77a159.38,159.38,0,0,1,26.82-3.71c.35,6.53,1.23,15.17,1.59,21.7a139.35,139.35,0,0,0-27.7,5.3c.17,2.29.53,4.76.88,7.41,10.58-2.65,17.47-2.83,28.58-3.89l1.24,22.41c-18.18,1.06-33.88,5.29-51.88,10.59-2.29-11.82-3.17-25.23-3.17-38.82,0-16.94,1.41-34.58,2.82-51.34A173,173,0,0,1,309.69,140.82Z"/>
-    <path class="cls-2" d="M358,138.7h.36c9.88,28.94,21.87,60.17,35.28,86.81-7.41,2.47-15.17,5.47-22.4,7.94-1.94-3.88-3.89-7.76-5.65-11.82l-24.53,5.47q-.78,2.91-1.58,5.82c-8.12.71-17.47,1.59-25.41,2.47C316.92,214.39,343.57,157.05,358,138.7Zm.53,65.11c-1.76-4.77-3.17-9.53-4.41-14.29a109.48,109.48,0,0,0-6.88,17.29Z"/>
-    <path class="cls-2" d="M384.5,170.28c-.18-7.76-1.06-15.7-1.06-23.46a365.8,365.8,0,0,1,58.93-8.65v22.59c-6.35.17-12.53.7-18.7,1.41-.88,12.35-1.41,24.52-1.41,36.87,0,10.59.35,21.18,1.23,31.59-7.94.35-15.52,1.94-23.46,2.47-.18-7.06-.36-14.12-.36-21.18,0-15.35.53-30.7,1.24-45.87Q392.71,167.9,384.5,170.28Z"/>
-    <path class="cls-2" d="M498.83,140.82l.53,21.52c-9.88.36-15.17.89-25.05,3.53-.53,3.71-1.06,7.24-1.24,10.77a159.38,159.38,0,0,1,26.82-3.71c.35,6.53,1.24,15.17,1.59,21.7a139.35,139.35,0,0,0-27.7,5.3c.17,2.29.53,4.76.88,7.41,10.59-2.65,17.47-2.83,28.58-3.89l1.24,22.41c-18.18,1.06-33.88,5.29-51.87,10.59-2.3-11.82-3.18-25.23-3.18-38.82,0-16.94,1.41-34.58,2.82-51.34A173,173,0,0,1,498.83,140.82Z"/>
-    <path class="cls-2" d="M599.93,138.7h.35c9.88,28.94,21.88,60.17,35.29,86.81-7.41,2.47-15.17,5.47-22.41,7.94-1.94-3.88-3.88-7.76-5.64-11.82L583,227.1l-1.59,5.82c-8.11.71-17.46,1.59-25.4,2.47C558.82,214.39,585.46,157.05,599.93,138.7Zm.53,65.11a148.15,148.15,0,0,1-4.41-14.29,109.48,109.48,0,0,0-6.88,17.29Z"/>
-  </g>
-  <g>
-    <path class="cls-2" d="M768,169.48a75.57,75.57,0,0,1-46.19-96.37h0a75.57,75.57,0,0,1,96.38-46.19L855.4,40,829,52.72l18.81,6.62c-16.21,46-69.41-3.29-89.4,1.57C734.12,66.81,768,169.48,768,169.48Z"/>
-    <g>
-      <rect class="cls-1" x="832.9" y="123.63" width="12.83" height="35.28" rx="6.42" transform="translate(94.54 -270.7) rotate(19.39)"/>
-      <rect class="cls-1" x="808.7" y="115.11" width="12.83" height="35.28" rx="6.42" transform="translate(90.34 -263.14) rotate(19.39)"/>
-    </g>
-    <g>
-      <rect class="cls-2" x="666.34" y="155.3" width="65.76" height="14.43" rx="7.22" transform="translate(93.64 -222.97) rotate(19.39)"/>
-      <rect class="cls-2" x="678.33" y="135.71" width="65.76" height="14.43" rx="7.22" transform="translate(222.82 -393.47) rotate(36.32)"/>
-      <rect class="cls-2" x="661.9" y="177.54" width="65.76" height="14.43" rx="7.22" transform="translate(5.39 -19.2) rotate(1.59)"/>
-      <rect class="cls-2" x="666.86" y="199.69" width="65.76" height="14.43" rx="7.22" transform="translate(-29.89 197.88) rotate(-15.76)"/>
-    </g>
-    <g>
-      <rect class="cls-2" x="876.62" y="229.33" width="65.76" height="14.43" rx="7.22" transform="translate(1688.84 761.68) rotate(-160.61)"/>
-      <rect class="cls-2" x="879.54" y="206.55" width="65.76" height="14.43" rx="7.22" transform="translate(1814.77 466.65) rotate(-177.53)"/>
-      <rect class="cls-2" x="866.14" y="249.44" width="65.76" height="14.43" rx="7.22" transform="translate(1459.94 1004.63) rotate(-142.8)"/>
-      <rect class="cls-2" x="848.4" y="263.6" width="65.76" height="14.43" rx="7.22" transform="translate(1171.77 1145.81) rotate(-125.45)"/>
-    </g>
-    <path class="cls-1" d="M829,52.72l6.89-19.57-17.7-6.23a75.57,75.57,0,0,0-96.38,46.19h0C744.48,33.92,770.6,32.18,829,52.72Z"/>
-    <path class="cls-2" d="M853.45,199.58a75.56,75.56,0,0,0,96.37-46.19h0A75.57,75.57,0,0,0,903.64,57L866.37,43.9l12.68,26.46-18.81-6.63c-16.21,46,56.16,40.92,68.7,57.23C944.14,140.75,853.45,199.58,853.45,199.58Z"/>
-    <path class="cls-1" d="M879.05,70.36l6.89-19.57L903.64,57a75.57,75.57,0,0,1,46.18,96.37h0C956.66,108.62,937.39,90.9,879.05,70.36Z"/>
-    <rect class="cls-1" x="698.46" y="133.23" width="213.31" height="133.12" rx="66.56" transform="translate(112.03 -256.02) rotate(19.39)"/>
-    <circle class="cls-3" cx="783.18" cy="192.07" r="42.5"/>
-    <circle class="cls-3" cx="827.05" cy="207.52" r="42.5"/>
-  </g>
-</svg>
diff --git a/crabfit-frontend/src/res/logo.svg b/crabfit-frontend/src/res/logo.svg
new file mode 100644
index 0000000..87c2c60
--- /dev/null
+++ b/crabfit-frontend/src/res/logo.svg
@@ -0,0 +1,43 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512">
+  <defs>
+    <style>
+      .cls-1 {
+        fill: #f4bb60;
+      }
+
+      .cls-2 {
+        fill: #f79e00;
+      }
+
+      .cls-3 {
+        fill: #f47f00;
+        opacity: 0.5;
+      }
+    </style>
+  </defs>
+  <g>
+    <path class="cls-1" d="M183.85,311.62a123,123,0,0,1-123-123h0a123,123,0,0,1,123-123h64.32L214.4,99.33h32.46c0,79.47-108.36,32.47-136.43,50.75C76.39,172.24,183.85,311.62,183.85,311.62Z"/>
+    <g>
+      <rect class="cls-2" x="267.75" y="200.99" width="20.89" height="57.44" rx="10.44"/>
+      <rect class="cls-2" x="225.97" y="200.99" width="20.89" height="57.44" rx="10.44"/>
+    </g>
+    <g>
+      <rect class="cls-1" x="21" y="326.33" width="107.06" height="23.5" rx="11.75"/>
+      <rect class="cls-1" x="28.83" y="289.77" width="107.06" height="23.5" rx="11.75" transform="translate(91.34 -10.92) rotate(16.92)"/>
+      <rect class="cls-1" x="26.22" y="362.88" width="107.06" height="23.5" rx="11.75" transform="matrix(0.95, -0.31, 0.31, 0.95, -110.74, 42.33)"/>
+      <rect class="cls-1" x="45.81" y="394.21" width="107.06" height="23.5" rx="11.75" transform="translate(-215.65 131.26) rotate(-35.16)"/>
+    </g>
+    <g>
+      <rect class="cls-1" x="383.94" y="326.33" width="107.06" height="23.5" rx="11.75" transform="translate(874.94 676.15) rotate(-180)"/>
+      <rect class="cls-1" x="376.11" y="289.77" width="107.06" height="23.5" rx="11.75" transform="translate(928.45 464.91) rotate(163.08)"/>
+      <rect class="cls-1" x="378.72" y="362.88" width="107.06" height="23.5" rx="11.75" transform="translate(729.24 863.49) rotate(-162.19)"/>
+      <rect class="cls-1" x="359.14" y="394.21" width="107.06" height="23.5" rx="11.75" transform="translate(516.28 975.5) rotate(-144.84)"/>
+    </g>
+    <path class="cls-2" d="M214.4,99.33V65.56H183.85a123,123,0,0,0-123,123h0C74.53,116.13,113.69,99.33,214.4,99.33Z"/>
+    <path class="cls-1" d="M331.42,311.62a123,123,0,0,0,123-123h0a123,123,0,0,0-123-123H267.1l33.77,33.77H268.4c0,79.47,108.36,32.47,136.43,50.75C438.87,172.24,331.42,311.62,331.42,311.62Z"/>
+    <path class="cls-2" d="M300.87,99.33V65.56h30.55a123,123,0,0,1,123,123h0C440.74,116.13,401.57,99.33,300.87,99.33Z"/>
+    <rect class="cls-2" x="83.67" y="229.71" width="347.28" height="216.72" rx="108.36"/>
+    <circle class="cls-3" cx="219.44" cy="338.08" r="69.19"/>
+    <circle class="cls-3" cx="295.17" cy="338.08" r="69.19"/>
+  </g>
+</svg>
diff --git a/crabfit-frontend/src/res/timezones.json b/crabfit-frontend/src/res/timezones.json
new file mode 100644
index 0000000..b58f2e5
--- /dev/null
+++ b/crabfit-frontend/src/res/timezones.json
@@ -0,0 +1,596 @@
+[
+	"Africa/Abidjan",
+	"Africa/Accra",
+	"Africa/Addis_Ababa",
+	"Africa/Algiers",
+	"Africa/Asmara",
+	"Africa/Asmera",
+	"Africa/Bamako",
+	"Africa/Bangui",
+	"Africa/Banjul",
+	"Africa/Bissau",
+	"Africa/Blantyre",
+	"Africa/Brazzaville",
+	"Africa/Bujumbura",
+	"Africa/Cairo",
+	"Africa/Casablanca",
+	"Africa/Ceuta",
+	"Africa/Conakry",
+	"Africa/Dakar",
+	"Africa/Dar_es_Salaam",
+	"Africa/Djibouti",
+	"Africa/Douala",
+	"Africa/El_Aaiun",
+	"Africa/Freetown",
+	"Africa/Gaborone",
+	"Africa/Harare",
+	"Africa/Johannesburg",
+	"Africa/Juba",
+	"Africa/Kampala",
+	"Africa/Khartoum",
+	"Africa/Kigali",
+	"Africa/Kinshasa",
+	"Africa/Lagos",
+	"Africa/Libreville",
+	"Africa/Lome",
+	"Africa/Luanda",
+	"Africa/Lubumbashi",
+	"Africa/Lusaka",
+	"Africa/Malabo",
+	"Africa/Maputo",
+	"Africa/Maseru",
+	"Africa/Mbabane",
+	"Africa/Mogadishu",
+	"Africa/Monrovia",
+	"Africa/Nairobi",
+	"Africa/Ndjamena",
+	"Africa/Niamey",
+	"Africa/Nouakchott",
+	"Africa/Ouagadougou",
+	"Africa/Porto-Novo",
+	"Africa/Sao_Tome",
+	"Africa/Timbuktu",
+	"Africa/Tripoli",
+	"Africa/Tunis",
+	"Africa/Windhoek",
+	"America/Adak",
+	"America/Anchorage",
+	"America/Anguilla",
+	"America/Antigua",
+	"America/Araguaina",
+	"America/Argentina/Buenos_Aires",
+	"America/Argentina/Catamarca",
+	"America/Argentina/ComodRivadavia",
+	"America/Argentina/Cordoba",
+	"America/Argentina/Jujuy",
+	"America/Argentina/La_Rioja",
+	"America/Argentina/Mendoza",
+	"America/Argentina/Rio_Gallegos",
+	"America/Argentina/Salta",
+	"America/Argentina/San_Juan",
+	"America/Argentina/San_Luis",
+	"America/Argentina/Tucuman",
+	"America/Argentina/Ushuaia",
+	"America/Aruba",
+	"America/Asuncion",
+	"America/Atikokan",
+	"America/Atka",
+	"America/Bahia",
+	"America/Bahia_Banderas",
+	"America/Barbados",
+	"America/Belem",
+	"America/Belize",
+	"America/Blanc-Sablon",
+	"America/Boa_Vista",
+	"America/Bogota",
+	"America/Boise",
+	"America/Buenos_Aires",
+	"America/Cambridge_Bay",
+	"America/Campo_Grande",
+	"America/Cancun",
+	"America/Caracas",
+	"America/Catamarca",
+	"America/Cayenne",
+	"America/Cayman",
+	"America/Chicago",
+	"America/Chihuahua",
+	"America/Coral_Harbour",
+	"America/Cordoba",
+	"America/Costa_Rica",
+	"America/Creston",
+	"America/Cuiaba",
+	"America/Curacao",
+	"America/Danmarkshavn",
+	"America/Dawson",
+	"America/Dawson_Creek",
+	"America/Denver",
+	"America/Detroit",
+	"America/Dominica",
+	"America/Edmonton",
+	"America/Eirunepe",
+	"America/El_Salvador",
+	"America/Ensenada",
+	"America/Fort_Nelson",
+	"America/Fort_Wayne",
+	"America/Fortaleza",
+	"America/Glace_Bay",
+	"America/Godthab",
+	"America/Goose_Bay",
+	"America/Grand_Turk",
+	"America/Grenada",
+	"America/Guadeloupe",
+	"America/Guatemala",
+	"America/Guayaquil",
+	"America/Guyana",
+	"America/Halifax",
+	"America/Havana",
+	"America/Hermosillo",
+	"America/Indiana/Indianapolis",
+	"America/Indiana/Knox",
+	"America/Indiana/Marengo",
+	"America/Indiana/Petersburg",
+	"America/Indiana/Tell_City",
+	"America/Indiana/Vevay",
+	"America/Indiana/Vincennes",
+	"America/Indiana/Winamac",
+	"America/Indianapolis",
+	"America/Inuvik",
+	"America/Iqaluit",
+	"America/Jamaica",
+	"America/Jujuy",
+	"America/Juneau",
+	"America/Kentucky/Louisville",
+	"America/Kentucky/Monticello",
+	"America/Knox_IN",
+	"America/Kralendijk",
+	"America/La_Paz",
+	"America/Lima",
+	"America/Los_Angeles",
+	"America/Louisville",
+	"America/Lower_Princes",
+	"America/Maceio",
+	"America/Managua",
+	"America/Manaus",
+	"America/Marigot",
+	"America/Martinique",
+	"America/Matamoros",
+	"America/Mazatlan",
+	"America/Mendoza",
+	"America/Menominee",
+	"America/Merida",
+	"America/Metlakatla",
+	"America/Mexico_City",
+	"America/Miquelon",
+	"America/Moncton",
+	"America/Monterrey",
+	"America/Montevideo",
+	"America/Montreal",
+	"America/Montserrat",
+	"America/Nassau",
+	"America/New_York",
+	"America/Nipigon",
+	"America/Nome",
+	"America/Noronha",
+	"America/North_Dakota/Beulah",
+	"America/North_Dakota/Center",
+	"America/North_Dakota/New_Salem",
+	"America/Nuuk",
+	"America/Ojinaga",
+	"America/Panama",
+	"America/Pangnirtung",
+	"America/Paramaribo",
+	"America/Phoenix",
+	"America/Port-au-Prince",
+	"America/Port_of_Spain",
+	"America/Porto_Acre",
+	"America/Porto_Velho",
+	"America/Puerto_Rico",
+	"America/Punta_Arenas",
+	"America/Rainy_River",
+	"America/Rankin_Inlet",
+	"America/Recife",
+	"America/Regina",
+	"America/Resolute",
+	"America/Rio_Branco",
+	"America/Rosario",
+	"America/Santa_Isabel",
+	"America/Santarem",
+	"America/Santiago",
+	"America/Santo_Domingo",
+	"America/Sao_Paulo",
+	"America/Scoresbysund",
+	"America/Shiprock",
+	"America/Sitka",
+	"America/St_Barthelemy",
+	"America/St_Johns",
+	"America/St_Kitts",
+	"America/St_Lucia",
+	"America/St_Thomas",
+	"America/St_Vincent",
+	"America/Swift_Current",
+	"America/Tegucigalpa",
+	"America/Thule",
+	"America/Thunder_Bay",
+	"America/Tijuana",
+	"America/Toronto",
+	"America/Tortola",
+	"America/Vancouver",
+	"America/Virgin",
+	"America/Whitehorse",
+	"America/Winnipeg",
+	"America/Yakutat",
+	"America/Yellowknife",
+	"Antarctica/Casey",
+	"Antarctica/Davis",
+	"Antarctica/DumontDUrville",
+	"Antarctica/Macquarie",
+	"Antarctica/Mawson",
+	"Antarctica/McMurdo",
+	"Antarctica/Palmer",
+	"Antarctica/Rothera",
+	"Antarctica/South_Pole",
+	"Antarctica/Syowa",
+	"Antarctica/Troll",
+	"Antarctica/Vostok",
+	"Arctic/Longyearbyen",
+	"Asia/Aden",
+	"Asia/Almaty",
+	"Asia/Amman",
+	"Asia/Anadyr",
+	"Asia/Aqtau",
+	"Asia/Aqtobe",
+	"Asia/Ashgabat",
+	"Asia/Ashkhabad",
+	"Asia/Atyrau",
+	"Asia/Baghdad",
+	"Asia/Bahrain",
+	"Asia/Baku",
+	"Asia/Bangkok",
+	"Asia/Barnaul",
+	"Asia/Beirut",
+	"Asia/Bishkek",
+	"Asia/Brunei",
+	"Asia/Calcutta",
+	"Asia/Chita",
+	"Asia/Choibalsan",
+	"Asia/Chongqing",
+	"Asia/Chungking",
+	"Asia/Colombo",
+	"Asia/Dacca",
+	"Asia/Damascus",
+	"Asia/Dhaka",
+	"Asia/Dili",
+	"Asia/Dubai",
+	"Asia/Dushanbe",
+	"Asia/Famagusta",
+	"Asia/Gaza",
+	"Asia/Harbin",
+	"Asia/Hebron",
+	"Asia/Ho_Chi_Minh",
+	"Asia/Hong_Kong",
+	"Asia/Hovd",
+	"Asia/Irkutsk",
+	"Asia/Istanbul",
+	"Asia/Jakarta",
+	"Asia/Jayapura",
+	"Asia/Jerusalem",
+	"Asia/Kabul",
+	"Asia/Kamchatka",
+	"Asia/Karachi",
+	"Asia/Kashgar",
+	"Asia/Kathmandu",
+	"Asia/Katmandu",
+	"Asia/Khandyga",
+	"Asia/Kolkata",
+	"Asia/Krasnoyarsk",
+	"Asia/Kuala_Lumpur",
+	"Asia/Kuching",
+	"Asia/Kuwait",
+	"Asia/Macao",
+	"Asia/Macau",
+	"Asia/Magadan",
+	"Asia/Makassar",
+	"Asia/Manila",
+	"Asia/Muscat",
+	"Asia/Nicosia",
+	"Asia/Novokuznetsk",
+	"Asia/Novosibirsk",
+	"Asia/Omsk",
+	"Asia/Oral",
+	"Asia/Phnom_Penh",
+	"Asia/Pontianak",
+	"Asia/Pyongyang",
+	"Asia/Qatar",
+	"Asia/Qostanay",
+	"Asia/Qyzylorda",
+	"Asia/Rangoon",
+	"Asia/Riyadh",
+	"Asia/Saigon",
+	"Asia/Sakhalin",
+	"Asia/Samarkand",
+	"Asia/Seoul",
+	"Asia/Shanghai",
+	"Asia/Singapore",
+	"Asia/Srednekolymsk",
+	"Asia/Taipei",
+	"Asia/Tashkent",
+	"Asia/Tbilisi",
+	"Asia/Tehran",
+	"Asia/Tel_Aviv",
+	"Asia/Thimbu",
+	"Asia/Thimphu",
+	"Asia/Tokyo",
+	"Asia/Tomsk",
+	"Asia/Ujung_Pandang",
+	"Asia/Ulaanbaatar",
+	"Asia/Ulan_Bator",
+	"Asia/Urumqi",
+	"Asia/Ust-Nera",
+	"Asia/Vientiane",
+	"Asia/Vladivostok",
+	"Asia/Yakutsk",
+	"Asia/Yangon",
+	"Asia/Yekaterinburg",
+	"Asia/Yerevan",
+	"Atlantic/Azores",
+	"Atlantic/Bermuda",
+	"Atlantic/Canary",
+	"Atlantic/Cape_Verde",
+	"Atlantic/Faeroe",
+	"Atlantic/Faroe",
+	"Atlantic/Jan_Mayen",
+	"Atlantic/Madeira",
+	"Atlantic/Reykjavik",
+	"Atlantic/South_Georgia",
+	"Atlantic/St_Helena",
+	"Atlantic/Stanley",
+	"Australia/ACT",
+	"Australia/Adelaide",
+	"Australia/Brisbane",
+	"Australia/Broken_Hill",
+	"Australia/Canberra",
+	"Australia/Currie",
+	"Australia/Darwin",
+	"Australia/Eucla",
+	"Australia/Hobart",
+	"Australia/LHI",
+	"Australia/Lindeman",
+	"Australia/Lord_Howe",
+	"Australia/Melbourne",
+	"Australia/North",
+	"Australia/NSW",
+	"Australia/Perth",
+	"Australia/Queensland",
+	"Australia/South",
+	"Australia/Sydney",
+	"Australia/Tasmania",
+	"Australia/Victoria",
+	"Australia/West",
+	"Australia/Yancowinna",
+	"Brazil/Acre",
+	"Brazil/DeNoronha",
+	"Brazil/East",
+	"Brazil/West",
+	"Canada/Atlantic",
+	"Canada/Central",
+	"Canada/Eastern",
+	"Canada/Mountain",
+	"Canada/Newfoundland",
+	"Canada/Pacific",
+	"Canada/Saskatchewan",
+	"Canada/Yukon",
+	"CET",
+	"Chile/Continental",
+	"Chile/EasterIsland",
+	"CST6CDT",
+	"Cuba",
+	"EET",
+	"Egypt",
+	"Eire",
+	"EST",
+	"EST5EDT",
+	"Etc/GMT",
+	"Etc/GMT+0",
+	"Etc/GMT+1",
+	"Etc/GMT+10",
+	"Etc/GMT+11",
+	"Etc/GMT+12",
+	"Etc/GMT+2",
+	"Etc/GMT+3",
+	"Etc/GMT+4",
+	"Etc/GMT+5",
+	"Etc/GMT+6",
+	"Etc/GMT+7",
+	"Etc/GMT+8",
+	"Etc/GMT+9",
+	"Etc/GMT-0",
+	"Etc/GMT-1",
+	"Etc/GMT-10",
+	"Etc/GMT-11",
+	"Etc/GMT-12",
+	"Etc/GMT-13",
+	"Etc/GMT-14",
+	"Etc/GMT-2",
+	"Etc/GMT-3",
+	"Etc/GMT-4",
+	"Etc/GMT-5",
+	"Etc/GMT-6",
+	"Etc/GMT-7",
+	"Etc/GMT-8",
+	"Etc/GMT-9",
+	"Etc/GMT0",
+	"Etc/Greenwich",
+	"Etc/UCT",
+	"Etc/Universal",
+	"Etc/UTC",
+	"Etc/Zulu",
+	"Europe/Amsterdam",
+	"Europe/Andorra",
+	"Europe/Astrakhan",
+	"Europe/Athens",
+	"Europe/Belfast",
+	"Europe/Belgrade",
+	"Europe/Berlin",
+	"Europe/Bratislava",
+	"Europe/Brussels",
+	"Europe/Bucharest",
+	"Europe/Budapest",
+	"Europe/Busingen",
+	"Europe/Chisinau",
+	"Europe/Copenhagen",
+	"Europe/Dublin",
+	"Europe/Gibraltar",
+	"Europe/Guernsey",
+	"Europe/Helsinki",
+	"Europe/Isle_of_Man",
+	"Europe/Istanbul",
+	"Europe/Jersey",
+	"Europe/Kaliningrad",
+	"Europe/Kiev",
+	"Europe/Kirov",
+	"Europe/Lisbon",
+	"Europe/Ljubljana",
+	"Europe/London",
+	"Europe/Luxembourg",
+	"Europe/Madrid",
+	"Europe/Malta",
+	"Europe/Mariehamn",
+	"Europe/Minsk",
+	"Europe/Monaco",
+	"Europe/Moscow",
+	"Europe/Nicosia",
+	"Europe/Oslo",
+	"Europe/Paris",
+	"Europe/Podgorica",
+	"Europe/Prague",
+	"Europe/Riga",
+	"Europe/Rome",
+	"Europe/Samara",
+	"Europe/San_Marino",
+	"Europe/Sarajevo",
+	"Europe/Saratov",
+	"Europe/Simferopol",
+	"Europe/Skopje",
+	"Europe/Sofia",
+	"Europe/Stockholm",
+	"Europe/Tallinn",
+	"Europe/Tirane",
+	"Europe/Tiraspol",
+	"Europe/Ulyanovsk",
+	"Europe/Uzhgorod",
+	"Europe/Vaduz",
+	"Europe/Vatican",
+	"Europe/Vienna",
+	"Europe/Vilnius",
+	"Europe/Volgograd",
+	"Europe/Warsaw",
+	"Europe/Zagreb",
+	"Europe/Zaporozhye",
+	"Europe/Zurich",
+	"Factory",
+	"GB",
+	"GB-Eire",
+	"GMT",
+	"GMT+0",
+	"GMT-0",
+	"GMT0",
+	"Greenwich",
+	"Hongkong",
+	"HST",
+	"Iceland",
+	"Indian/Antananarivo",
+	"Indian/Chagos",
+	"Indian/Christmas",
+	"Indian/Cocos",
+	"Indian/Comoro",
+	"Indian/Kerguelen",
+	"Indian/Mahe",
+	"Indian/Maldives",
+	"Indian/Mauritius",
+	"Indian/Mayotte",
+	"Indian/Reunion",
+	"Iran",
+	"Israel",
+	"Jamaica",
+	"Japan",
+	"Kwajalein",
+	"Libya",
+	"MET",
+	"Mexico/BajaNorte",
+	"Mexico/BajaSur",
+	"Mexico/General",
+	"MST",
+	"MST7MDT",
+	"Navajo",
+	"NZ",
+	"NZ-CHAT",
+	"Pacific/Apia",
+	"Pacific/Auckland",
+	"Pacific/Bougainville",
+	"Pacific/Chatham",
+	"Pacific/Chuuk",
+	"Pacific/Easter",
+	"Pacific/Efate",
+	"Pacific/Enderbury",
+	"Pacific/Fakaofo",
+	"Pacific/Fiji",
+	"Pacific/Funafuti",
+	"Pacific/Galapagos",
+	"Pacific/Gambier",
+	"Pacific/Guadalcanal",
+	"Pacific/Guam",
+	"Pacific/Honolulu",
+	"Pacific/Johnston",
+	"Pacific/Kiritimati",
+	"Pacific/Kosrae",
+	"Pacific/Kwajalein",
+	"Pacific/Majuro",
+	"Pacific/Marquesas",
+	"Pacific/Midway",
+	"Pacific/Nauru",
+	"Pacific/Niue",
+	"Pacific/Norfolk",
+	"Pacific/Noumea",
+	"Pacific/Pago_Pago",
+	"Pacific/Palau",
+	"Pacific/Pitcairn",
+	"Pacific/Pohnpei",
+	"Pacific/Ponape",
+	"Pacific/Port_Moresby",
+	"Pacific/Rarotonga",
+	"Pacific/Saipan",
+	"Pacific/Samoa",
+	"Pacific/Tahiti",
+	"Pacific/Tarawa",
+	"Pacific/Tongatapu",
+	"Pacific/Truk",
+	"Pacific/Wake",
+	"Pacific/Wallis",
+	"Pacific/Yap",
+	"Poland",
+	"Portugal",
+	"PRC",
+	"PST8PDT",
+	"ROC",
+	"ROK",
+	"Singapore",
+	"Turkey",
+	"UCT",
+	"Universal",
+	"US/Alaska",
+	"US/Aleutian",
+	"US/Arizona",
+	"US/Central",
+	"US/East-Indiana",
+	"US/Eastern",
+	"US/Hawaii",
+	"US/Indiana-Starke",
+	"US/Michigan",
+	"US/Mountain",
+	"US/Pacific",
+	"US/Samoa",
+	"UTC",
+	"W-SU",
+	"WET",
+	"Zulu"
+]
diff --git a/crabfit-frontend/src/theme/index.ts b/crabfit-frontend/src/theme/index.ts
index c6063e2..a35a3c0 100644
--- a/crabfit-frontend/src/theme/index.ts
+++ b/crabfit-frontend/src/theme/index.ts
@@ -6,6 +6,7 @@ const theme = {
 		primary: '#F79E00',
 		primaryDark: '#F48600',
 		primaryLight: '#F4BB60',
+		primaryBackground: '#FEF2DD',
 	},
 	dark: {
 		mode: 'dark',
@@ -14,6 +15,7 @@ const theme = {
 		primary: '#F79E00',
 		primaryDark: '#F4BB60',
 		primaryLight: '#F48600',
+		primaryBackground: '#30240F',
 	},
 };