diff --git a/components/calendar.js b/components/calendar.js
index 3ab41df680d138f15e66789141d8c7442297e247..80ac49f9ef59b3d7d800df33ace6ed6653d2212a 100644
--- a/components/calendar.js
+++ b/components/calendar.js
@@ -14,13 +14,13 @@ import {
   calendarTheme,
   predictionToCalFormat,
   toCalFormat,
-  todayToCalFormat
+  todayToCalFormat,
 } from './helpers/calendar'
 
 class CalendarView extends Component {
   static propTypes = {
     setDate: PropTypes.func.isRequired,
-    navigate: PropTypes.func.isRequired
+    navigate: PropTypes.func.isRequired,
   }
 
   constructor(props) {
@@ -30,7 +30,7 @@ class CalendarView extends Component {
     this.state = {
       bleedingDaysInCalFormat: toCalFormat(this.bleedingDays),
       predictedBleedingDaysInCalFormat: predictionToCalFormat(predictedMenses),
-      todayInCalFormat: todayToCalFormat()
+      todayInCalFormat: todayToCalFormat(),
     }
 
     this.bleedingDays.addListener(this.setStateWithCalFormattedDays)
@@ -42,7 +42,7 @@ class CalendarView extends Component {
     this.setState({
       bleedingDaysInCalFormat: toCalFormat(this.bleedingDays),
       predictedBleedingDaysInCalFormat: predictionToCalFormat(predictedMenses),
-      todayInCalFormat: todayToCalFormat()
+      todayInCalFormat: todayToCalFormat(),
     })
   }
 
@@ -59,7 +59,7 @@ class CalendarView extends Component {
     const {
       todayInCalFormat,
       bleedingDaysInCalFormat,
-      predictedBleedingDaysInCalFormat
+      predictedBleedingDaysInCalFormat,
     } = this.state
     const markedDates = Object.assign(
       {},
@@ -75,7 +75,7 @@ class CalendarView extends Component {
           firstDay={1}
           onDayPress={this.passDateToDayView.bind(this)}
           markedDates={markedDates}
-          markingType={'custom'}
+          markingType='custom'
           theme={calendarTheme}
           // Max amount of months allowed to scroll to the past.
           pastScrollRange={120}
@@ -86,17 +86,14 @@ class CalendarView extends Component {
 }
 
 const styles = StyleSheet.create({
-  container: { flex: 1 }
+  container: { flex: 1 },
 })
 
 const mapDispatchToProps = (dispatch) => {
-  return({
+  return {
     setDate: (date) => dispatch(setDate(date)),
     navigate: (page) => dispatch(navigate(page)),
-  })
+  }
 }
 
-export default connect(
-  null,
-  mapDispatchToProps,
-)(CalendarView)
+export default connect(null, mapDispatchToProps)(CalendarView)
diff --git a/components/chart/chart.js b/components/chart/chart.js
index 021f492871eb09a5069cd096254cfe4dcf57b4c0..0dc364e09778500f5da5859602ae937615b7e793 100644
--- a/components/chart/chart.js
+++ b/components/chart/chart.js
@@ -229,7 +229,7 @@ const styles = StyleSheet.create({
   },
   loadingContainer: {
     height: '100%',
-    backgroundColor: Colors.tourquiseLight,
+    backgroundColor: Colors.turquoiseLight,
     justifyContent: 'center'
   },
   page: {
diff --git a/components/chart/dot-and-line.js b/components/chart/dot-and-line.js
index e3be7aa66da06dd0a3f6ccba64c417120c791fd6..d2618c3f54489fdbd945e91c38de4622b511a4de 100644
--- a/components/chart/dot-and-line.js
+++ b/components/chart/dot-and-line.js
@@ -54,11 +54,11 @@ export default class DotAndLine extends Component {
     const dot = new Path().moveTo(CHART_COLUMN_MIDDLE , y - CHART_DOT_RADIUS)
       .arc(0, CHART_DOT_RADIUS * 2, CHART_DOT_RADIUS)
       .arc(0, CHART_DOT_RADIUS * -2, CHART_DOT_RADIUS)
-    const dotColor = exclude ? Colors.tourquise : Colors.tourquiseDark
+    const dotColor = exclude ? Colors.turquoise : Colors.turquoiseDark
     const lineColorLeft = excludeLeftLine ?
-      Colors.tourquise : Colors.tourquiseDark
+      Colors.turquoise : Colors.turquoiseDark
     const lineColorRight = excludeRightLine ?
-      Colors.tourquise : Colors.tourquiseDark
+      Colors.turquoise : Colors.turquoiseDark
 
     return(
       <React.Fragment>
diff --git a/components/common/app-page.js b/components/common/app-page.js
index 61817008ea0f8b3f8d24ef86c7736f34c01c9479..0ffde8d04c29f2b9a00277ff65be2c31bd0b4cdb 100644
--- a/components/common/app-page.js
+++ b/components/common/app-page.js
@@ -36,11 +36,11 @@ AppPage.propTypes = {
 
 const styles = StyleSheet.create({
   container: {
-    backgroundColor: Colors.tourquiseLight,
+    backgroundColor: Colors.turquoiseLight,
     flex: 1
   },
   scrollView: {
-    backgroundColor: Colors.tourquiseLight,
+    backgroundColor: Colors.turquoiseLight,
     flexGrow: 1
   },
   title: {
diff --git a/components/header/logo.js b/components/header/logo.js
index 4bd63fe12472c3ac6aa05ed178bbc9eda1f3f695..da2759be704580250e9ef1e51cbc824c04334f1c 100644
--- a/components/header/logo.js
+++ b/components/header/logo.js
@@ -23,7 +23,7 @@ Logo.propTypes = {
 
 const styles = StyleSheet.create({
   logo: {
-    color: Colors.tourquiseDark,
+    color: Colors.turquoiseDark,
     fontFamily: Fonts.bold,
     fontSize: Sizes.title
   }
diff --git a/components/helpers/calendar.js b/components/helpers/calendar.js
index e765dd9699b0f6787d9beb018980c9aeb2b76bd4..fdedfa8fce86f0246f77fe4fe5df7f1f2456cc7c 100644
--- a/components/helpers/calendar.js
+++ b/components/helpers/calendar.js
@@ -12,11 +12,13 @@ export const toCalFormat = (bleedingDaysSortedByDate) => {
       customStyles: {
         container: {
           backgroundColor: shades[day.bleeding.value],
-        }
-      }
-    }
-    if (day.date === todayDateString) {
-      acc[day.date].customStyles.text = styles.calendarToday
+          paddingTop: 2,
+        },
+        text: {
+          color: Colors.turquoiseLight,
+          ...(day.date === todayDateString && styles.calendarToday),
+        },
+      },
     }
     return acc
   }, {})
@@ -31,12 +33,11 @@ export const predictionToCalFormat = (predictedDays) => {
       accSet[day] = {
         customStyles: {
           container: {
-            borderColor: (i === middleIndex) ? shades[3] : shades[0],
-            borderStyle: (i === middleIndex) ? 'solid' : 'dashed',
+            borderColor: i === middleIndex ? shades[3] : shades[0],
+            borderStyle: i === middleIndex ? 'solid' : 'dashed',
             borderWidth: 1,
           },
-
-        }
+        },
       }
       if (day === todayDateString) {
         accSet[day].customStyles.text = styles.calendarToday
@@ -50,24 +51,24 @@ export const predictionToCalFormat = (predictedDays) => {
 
 export const todayToCalFormat = () => {
   const todayDateString = LocalDate.now().toString()
-  const todayFormated = {}
-  todayFormated[todayDateString] = {
-    customStyles: {
-      text: styles.calendarToday
-    }
+  return {
+    [todayDateString]: {
+      customStyles: {
+        text: styles.calendarToday,
+      },
+    },
   }
-  return todayFormated
 }
 
 const styles = {
   calendarToday: {
     fontFamily: Fonts.bold,
-    color: Colors.purple
+    color: Colors.purple,
   },
 }
 
 export const calendarTheme = {
-  calendarBackground: Colors.tourquiseLight,
+  calendarBackground: Colors.turquoiseLight,
   dayTextColor: Colors.greyDark,
   monthTextColor: Colors.purple,
   textDayFontFamily: Fonts.main,
diff --git a/components/home.js b/components/home.js
index ad2ff53e9d55ffa6b07b60bcb9c8e06315b25579..423d82ae8ce5c3b8411b72f7df1e46952a5d84d3 100644
--- a/components/home.js
+++ b/components/home.js
@@ -77,21 +77,21 @@ class Home extends Component {
         {cycleDayNumber &&
           <View style={styles.line}>
             <AppText style={styles.whiteSubtitle}>{cycleDayText}</AppText>
-            <AppText style={styles.tourquiseText}>{labels.cycleDay}</AppText>
+            <AppText style={styles.turquoiseText}>{labels.cycleDay}</AppText>
           </View>
         }
         {phase &&
           <View style={styles.line}>
             <AppText style={styles.whiteSubtitle}>{phaseText}</AppText>
-            <AppText style={styles.tourquiseText}>
+            <AppText style={styles.turquoiseText}>
               {labels.cyclePhase}
             </AppText>
-            <AppText style={styles.tourquiseText}>{status}</AppText>
+            <AppText style={styles.turquoiseText}>{status}</AppText>
             <Asterisk />
           </View>
         }
         <View style={styles.line}>
-          <AppText style={styles.tourquiseText}>{prediction}</AppText>
+          <AppText style={styles.turquoiseText}>{prediction}</AppText>
         </View>
         <Button isCTA isSmall={false} onPress={this.navigateToCycleDayView}>
           {labels.addData}
@@ -137,8 +137,8 @@ const styles = StyleSheet.create({
     fontSize: Sizes.huge,
     marginVertical: Spacing.base,
   },
-  tourquiseText: {
-    color: Colors.tourquise,
+  turquoiseText: {
+    color: Colors.turquoise,
     fontSize: Sizes.subtitle,
   },
   whiteSubtitle: {
diff --git a/components/settings/nfp-settings/temperature-slider.js b/components/settings/nfp-settings/temperature-slider.js
index 01cfdb0c05ea0648bfc146038288fc6171730e03..86b9c53d66792d254e1ee2f90f1cc4e20b474e5d 100644
--- a/components/settings/nfp-settings/temperature-slider.js
+++ b/components/settings/nfp-settings/temperature-slider.js
@@ -61,7 +61,7 @@ const styles = StyleSheet.create({
     paddingTop: Sizes.base
   },
   marker: {
-    backgroundColor: Colors.tourquiseDark,
+    backgroundColor: Colors.turquoiseDark,
     borderRadius: 50,
     elevation: 4,
     height: Sizes.subtitle,
@@ -72,9 +72,9 @@ const styles = StyleSheet.create({
     height: Sizes.small
   },
   sliderAccentBackground: {
-    backgroundColor: Colors.tourquiseDark
+    backgroundColor: Colors.turquoiseDark
   },
   sliderBackground: {
-    backgroundColor: Colors.tourquise
+    backgroundColor: Colors.turquoise
   },
 })
diff --git a/styles/colors.js b/styles/colors.js
index 533e1a8b108ae24c871390c49bb835d7ba76ade0..047a60fd61507ea66f4c1ffee32c5361d84cd3fe 100644
--- a/styles/colors.js
+++ b/styles/colors.js
@@ -19,9 +19,9 @@ export default {
   orange: '#F38337',
   purple: '#3A2671',
   purpleLight: '#938EB2',
-  tourquiseDark: '#69CBC1',
-  tourquise: '#CFECEA',
-  tourquiseLight: '#E9F2ED',
+  turquoiseDark: '#69CBC1',
+  turquoise: '#CFECEA',
+  turquoiseLight: '#E9F2ED',
   iconColors: {
     'bleeding': {
       color: redColor,