diff --git a/.size-snapshot.json b/.size-snapshot.json
index d758abc0e..8c027cdc7 100644
--- a/.size-snapshot.json
+++ b/.size-snapshot.json
@@ -1,13 +1,13 @@
 {
   "bundle.js": {
-    "bundled": 827853,
-    "minified": 758593,
-    "gzipped": 91427
+    "bundled": 823005,
+    "minified": 753745,
+    "gzipped": 91062
   },
   "bundle.umd.js": {
-    "bundled": 837385,
-    "minified": 734631,
-    "gzipped": 87482
+    "bundled": 832537,
+    "minified": 729783,
+    "gzipped": 87250
   },
   "constants/themes/secondaryTheme.js": {
     "bundled": 177,
@@ -234,9 +234,9 @@
     }
   },
   "shared-components/progressBar/style.js": {
-    "bundled": 7971,
-    "minified": 7515,
-    "gzipped": 2253,
+    "bundled": 7851,
+    "minified": 7395,
+    "gzipped": 2196,
     "treeshaked": {
       "rollup": {
         "code": 1495,
@@ -472,9 +472,9 @@
     }
   },
   "shared-components/carousel/style.js": {
-    "bundled": 20523,
-    "minified": 19882,
-    "gzipped": 4875,
+    "bundled": 20339,
+    "minified": 19698,
+    "gzipped": 4811,
     "treeshaked": {
       "rollup": {
         "code": 3136,
@@ -514,9 +514,9 @@
     }
   },
   "shared-components/toggle/style.js": {
-    "bundled": 7101,
-    "minified": 6871,
-    "gzipped": 2513,
+    "bundled": 6921,
+    "minified": 6691,
+    "gzipped": 2463,
     "treeshaked": {
       "rollup": {
         "code": 735,
@@ -626,9 +626,9 @@
     }
   },
   "shared-components/accordion/style.js": {
-    "bundled": 36238,
-    "minified": 35182,
-    "gzipped": 4829,
+    "bundled": 36006,
+    "minified": 34950,
+    "gzipped": 4790,
     "treeshaked": {
       "rollup": {
         "code": 2701,
@@ -654,9 +654,9 @@
     }
   },
   "shared-components/field/style.js": {
-    "bundled": 35325,
-    "minified": 34582,
-    "gzipped": 4808,
+    "bundled": 34905,
+    "minified": 34162,
+    "gzipped": 4780,
     "treeshaked": {
       "rollup": {
         "code": 2492,
@@ -906,9 +906,9 @@
     }
   },
   "shared-components/container/style.js": {
-    "bundled": 17553,
-    "minified": 16808,
-    "gzipped": 2931,
+    "bundled": 17313,
+    "minified": 16568,
+    "gzipped": 2878,
     "treeshaked": {
       "rollup": {
         "code": 1322,
@@ -948,9 +948,9 @@
     }
   },
   "shared-components/banner/style.js": {
-    "bundled": 14830,
-    "minified": 14290,
-    "gzipped": 3374,
+    "bundled": 14602,
+    "minified": 14062,
+    "gzipped": 3327,
     "treeshaked": {
       "rollup": {
         "code": 1593,
@@ -1032,9 +1032,9 @@
     }
   },
   "shared-components/alert/style.js": {
-    "bundled": 35497,
-    "minified": 34532,
-    "gzipped": 5262,
+    "bundled": 35145,
+    "minified": 34180,
+    "gzipped": 5189,
     "treeshaked": {
       "rollup": {
         "code": 3041,
@@ -1074,9 +1074,9 @@
     }
   },
   "shared-components/selectorButton/style.js": {
-    "bundled": 23956,
-    "minified": 23222,
-    "gzipped": 4195,
+    "bundled": 23656,
+    "minified": 22922,
+    "gzipped": 4162,
     "treeshaked": {
       "rollup": {
         "code": 2157,
@@ -1088,9 +1088,9 @@
     }
   },
   "shared-components/typography/index.js": {
-    "bundled": 53389,
-    "minified": 52342,
-    "gzipped": 3556,
+    "bundled": 52849,
+    "minified": 51802,
+    "gzipped": 3508,
     "treeshaked": {
       "rollup": {
         "code": 2693,
@@ -1116,9 +1116,9 @@
     }
   },
   "shared-components/loadingSpinner/style.js": {
-    "bundled": 9621,
-    "minified": 9240,
-    "gzipped": 2786,
+    "bundled": 9585,
+    "minified": 9204,
+    "gzipped": 2761,
     "treeshaked": {
       "rollup": {
         "code": 1413,
@@ -1144,9 +1144,9 @@
     }
   },
   "shared-components/button/style.js": {
-    "bundled": 35978,
-    "minified": 34110,
-    "gzipped": 6768,
+    "bundled": 35866,
+    "minified": 33998,
+    "gzipped": 6763,
     "treeshaked": {
       "rollup": {
         "code": 4650,
@@ -1172,9 +1172,9 @@
     }
   },
   "shared-components/button/shared-components/loader/style.js": {
-    "bundled": 6674,
-    "minified": 5905,
-    "gzipped": 2574,
+    "bundled": 6670,
+    "minified": 5901,
+    "gzipped": 2570,
     "treeshaked": {
       "rollup": {
         "code": 1710,
@@ -1186,9 +1186,9 @@
     }
   },
   "shared-components/immersiveModal/style.js": {
-    "bundled": 103824,
-    "minified": 102608,
-    "gzipped": 7728,
+    "bundled": 103152,
+    "minified": 101936,
+    "gzipped": 7724,
     "treeshaked": {
       "rollup": {
         "code": 4482,
@@ -1284,9 +1284,9 @@
     }
   },
   "shared-components/button/components/linkButton/style.js": {
-    "bundled": 1753,
-    "minified": 1504,
-    "gzipped": 874,
+    "bundled": 1745,
+    "minified": 1496,
+    "gzipped": 860,
     "treeshaked": {
       "rollup": {
         "code": 41,
@@ -1326,9 +1326,9 @@
     }
   },
   "shared-components/dropdown/style.js": {
-    "bundled": 44533,
-    "minified": 43354,
-    "gzipped": 5931,
+    "bundled": 44185,
+    "minified": 43006,
+    "gzipped": 5906,
     "treeshaked": {
       "rollup": {
         "code": 2644,
@@ -1340,9 +1340,9 @@
     }
   },
   "shared-components/optionButton/style.js": {
-    "bundled": 38541,
-    "minified": 37360,
-    "gzipped": 4891,
+    "bundled": 38105,
+    "minified": 36924,
+    "gzipped": 4850,
     "treeshaked": {
       "rollup": {
         "code": 2620,
@@ -1368,9 +1368,9 @@
     }
   },
   "shared-components/chip/style.js": {
-    "bundled": 7380,
-    "minified": 6895,
-    "gzipped": 2630,
+    "bundled": 7256,
+    "minified": 6771,
+    "gzipped": 2590,
     "treeshaked": {
       "rollup": {
         "code": 1300,
@@ -1410,9 +1410,9 @@
     }
   },
   "shared-components/button/components/roundButton/style.js": {
-    "bundled": 28975,
-    "minified": 27269,
-    "gzipped": 5194,
+    "bundled": 28663,
+    "minified": 26957,
+    "gzipped": 5167,
     "treeshaked": {
       "rollup": {
         "code": 594,
diff --git a/src/constants/index.ts b/src/constants/index.ts
index ae9558be7..a4015eb98 100644
--- a/src/constants/index.ts
+++ b/src/constants/index.ts
@@ -9,6 +9,6 @@ export { default as LAYOUT } from './layout';
 export { default as MEDIA_QUERIES } from './mediaQueries';
 export { default as PROGRESS_BAR_STATUS } from './progressBarStatus';
 export { default as SPACER } from './spacer';
-export { primaryTheme, secondaryTheme, COLORS_PROP_TYPES } from './themes';
+export * from './themes';
 export { default as TYPOGRAPHY_CONSTANTS } from './typography';
 export { default as Z_SCALE } from './zScale';
diff --git a/src/constants/themes/index.ts b/src/constants/themes/index.ts
index c1ddb02b4..1e38de32d 100644
--- a/src/constants/themes/index.ts
+++ b/src/constants/themes/index.ts
@@ -1,3 +1,3 @@
 export { primaryTheme } from './primaryTheme';
 export { secondaryTheme } from './secondaryTheme';
-export { COLORS_PROP_TYPES } from './types';
+export * from './types';
diff --git a/src/shared-components/accordion/style.ts b/src/shared-components/accordion/style.ts
index 71582dd77..1a544d4fb 100644
--- a/src/shared-components/accordion/style.ts
+++ b/src/shared-components/accordion/style.ts
@@ -1,6 +1,12 @@
 import styled from '@emotion/styled';
-import { ANIMATION, BREAKPOINTS, BOX_SHADOWS, SPACER } from 'src/constants';
-import { ThemeType } from 'src/constants/themes/types';
+
+import {
+  ANIMATION,
+  BREAKPOINTS,
+  BOX_SHADOWS,
+  SPACER,
+  ThemeType,
+} from '../../constants';
 
 export const Content = styled.div`
   padding: ${SPACER.medium};
diff --git a/src/shared-components/alert/style.ts b/src/shared-components/alert/style.ts
index 209cae7bf..6ae4a0882 100644
--- a/src/shared-components/alert/style.ts
+++ b/src/shared-components/alert/style.ts
@@ -1,12 +1,12 @@
 import styled from '@emotion/styled';
 import { keyframes } from '@emotion/core';
-import { ThemeType } from 'src/constants/themes/types';
 
 import {
   BOX_SHADOWS,
   MEDIA_QUERIES,
   SPACER,
   ANIMATION,
+  ThemeType,
   TYPOGRAPHY_CONSTANTS,
 } from '../../constants';
 
diff --git a/src/shared-components/banner/style.ts b/src/shared-components/banner/style.ts
index d9400295e..5e3adf1cb 100644
--- a/src/shared-components/banner/style.ts
+++ b/src/shared-components/banner/style.ts
@@ -1,11 +1,11 @@
 import styled from '@emotion/styled';
 import { buttonReset } from 'src/utils/styles/buttonReset';
-import { ThemeType } from 'src/constants/themes/types';
 
 import {
   BOX_SHADOWS,
   MEDIA_QUERIES,
   SPACER,
+  ThemeType,
   TYPOGRAPHY_CONSTANTS,
 } from '../../constants';
 
diff --git a/src/shared-components/button/components/linkButton/index.tsx b/src/shared-components/button/components/linkButton/index.tsx
index 31120beef..19d1bc0cb 100644
--- a/src/shared-components/button/components/linkButton/index.tsx
+++ b/src/shared-components/button/components/linkButton/index.tsx
@@ -1,12 +1,12 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { COLORS_PROP_TYPES, ThemeColors } from 'src/constants/themes/types';
 import { useTheme } from 'emotion-theming';
 
 import Container from '../../shared-components/container';
 import { ButtonType } from '../..';
 import { ButtonContents, ButtonText } from '../../style';
 import { linkButtonStyles } from './style';
+import { COLORS_PROP_TYPES, ThemeColors } from '../../../../constants';
 
 type LinkProps = {
   /**
diff --git a/src/shared-components/button/components/linkButton/style.ts b/src/shared-components/button/components/linkButton/style.ts
index 78c1dd2c6..701fd0d80 100644
--- a/src/shared-components/button/components/linkButton/style.ts
+++ b/src/shared-components/button/components/linkButton/style.ts
@@ -1,7 +1,7 @@
 import { css } from '@emotion/core';
-import { ThemeColors, ThemeType } from 'src/constants/themes/types';
 
 import { ButtonType } from '../..';
+import { ThemeColors, ThemeType } from '../../../../constants';
 import { baseButtonStyles } from '../../style';
 
 export const linkButtonStyles = ({
diff --git a/src/shared-components/button/components/roundButton/index.tsx b/src/shared-components/button/components/roundButton/index.tsx
index b8b40543c..e5d43bac6 100644
--- a/src/shared-components/button/components/roundButton/index.tsx
+++ b/src/shared-components/button/components/roundButton/index.tsx
@@ -1,6 +1,5 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { COLORS_PROP_TYPES, ThemeColors } from 'src/constants/themes/types';
 import { useTheme } from 'emotion-theming';
 
 import Loader from '../../shared-components/loader';
@@ -17,6 +16,7 @@ import {
   deprecatedProperties,
   isLoadingPropFunction,
 } from '../../deprecatedPropsHandler';
+import { COLORS_PROP_TYPES, ThemeColors } from '../../../../constants';
 
 type RoundButtonProps = {
   buttonColor?: ThemeColors;
diff --git a/src/shared-components/button/components/roundButton/style.ts b/src/shared-components/button/components/roundButton/style.ts
index 114913d21..b858c61c9 100644
--- a/src/shared-components/button/components/roundButton/style.ts
+++ b/src/shared-components/button/components/roundButton/style.ts
@@ -1,9 +1,8 @@
 import styled from '@emotion/styled';
 import { css } from '@emotion/core';
 import tinycolor from 'tinycolor2';
-import { ThemeColors, ThemeType } from 'src/constants/themes/types';
 
-import { ANIMATION } from '../../../../constants';
+import { ANIMATION, ThemeColors, ThemeType } from '../../../../constants';
 import { ButtonBase } from '../../style';
 import { textColorsAssociatedWithColors } from '../../constants';
 
diff --git a/src/shared-components/button/constants.ts b/src/shared-components/button/constants.ts
index 8b18d7c2a..abe9ec955 100644
--- a/src/shared-components/button/constants.ts
+++ b/src/shared-components/button/constants.ts
@@ -1,4 +1,4 @@
-import { ThemeType } from 'src/constants/themes/types';
+import { ThemeType } from '../../constants';
 
 // TODO: potentially break out these pairings to the color constants file
 export const textColorsAssociatedWithColors = (theme: ThemeType) =>
diff --git a/src/shared-components/button/index.tsx b/src/shared-components/button/index.tsx
index aafa1a3ec..09301b54d 100644
--- a/src/shared-components/button/index.tsx
+++ b/src/shared-components/button/index.tsx
@@ -1,7 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { useTheme } from 'emotion-theming';
-import { COLORS_PROP_TYPES, ThemeColors } from 'src/constants/themes/types';
 
 import Loader from './shared-components/loader';
 import Container from './shared-components/container';
@@ -14,6 +13,7 @@ import {
   deprecatedProperties,
   isLoadingPropFunction,
 } from './deprecatedPropsHandler';
+import { COLORS_PROP_TYPES, ThemeColors } from '../../constants';
 
 export type ButtonType = 'primary' | 'secondary' | 'tertiary' | 'quaternary';
 /**
diff --git a/src/shared-components/button/shared-components/loader/index.tsx b/src/shared-components/button/shared-components/loader/index.tsx
index e27a3c623..4e4b1d0f6 100644
--- a/src/shared-components/button/shared-components/loader/index.tsx
+++ b/src/shared-components/button/shared-components/loader/index.tsx
@@ -1,8 +1,8 @@
 import React from 'react';
-import { ThemeColors } from 'src/constants/themes/types';
 
 import ButtonLoader from './style';
 import { ButtonTypeWithAction } from '../..';
+import { ThemeColors } from '../../../../constants';
 
 type LoaderProps = {
   buttonColor: ThemeColors;
diff --git a/src/shared-components/button/shared-components/loader/style.ts b/src/shared-components/button/shared-components/loader/style.ts
index af92ebd94..cff5033fb 100644
--- a/src/shared-components/button/shared-components/loader/style.ts
+++ b/src/shared-components/button/shared-components/loader/style.ts
@@ -1,9 +1,9 @@
 import styled from '@emotion/styled';
 import tinycolor from 'tinycolor2';
 import { keyframes } from '@emotion/core';
-import { ThemeColors, ThemeType } from 'src/constants/themes/types';
 
 import { ButtonTypeWithAction } from '../..';
+import { ThemeColors, ThemeType } from '../../../../constants';
 
 const statefulLoader = keyframes`
   0% { opacity: 1; transform: translate3d(0, 0, 0) scale(1, 1); }
diff --git a/src/shared-components/button/style.ts b/src/shared-components/button/style.ts
index 42a7e0bcc..cbfffe6f3 100644
--- a/src/shared-components/button/style.ts
+++ b/src/shared-components/button/style.ts
@@ -1,9 +1,14 @@
 import styled from '@emotion/styled';
 import tinycolor from 'tinycolor2';
-import { ThemeColors, ThemeType } from 'src/constants/themes/types';
 
 import { style as TYPOGRAPHY_STYLE } from '../typography';
-import { ANIMATION, SPACER, BOX_SHADOWS } from '../../constants';
+import {
+  ANIMATION,
+  SPACER,
+  BOX_SHADOWS,
+  ThemeColors,
+  ThemeType,
+} from '../../constants';
 import { textColorsAssociatedWithColors } from './constants';
 
 import { ButtonTypeWithAction } from '.';
diff --git a/src/shared-components/callout/index.tsx b/src/shared-components/callout/index.tsx
index 3a423bd1f..da65dca20 100644
--- a/src/shared-components/callout/index.tsx
+++ b/src/shared-components/callout/index.tsx
@@ -1,9 +1,9 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { useTheme } from 'emotion-theming';
-import { COLORS_PROP_TYPES, ThemeColors } from 'src/constants/themes/types';
 
 import { CalloutContainer, Text, Icon, ParentContainer } from './style';
+import { COLORS_PROP_TYPES, ThemeColors } from '../../constants';
 
 type CalloutProps = {
   /**
diff --git a/src/shared-components/carousel/style.ts b/src/shared-components/carousel/style.ts
index f28911152..a8e4fabe8 100644
--- a/src/shared-components/carousel/style.ts
+++ b/src/shared-components/carousel/style.ts
@@ -1,7 +1,6 @@
 import styled from '@emotion/styled';
-import { ThemeType } from 'src/constants/themes/types';
 
-import { SPACER } from '../../constants';
+import { SPACER, ThemeType } from '../../constants';
 
 import { CarouselType } from '.';
 
diff --git a/src/shared-components/chip/style.ts b/src/shared-components/chip/style.ts
index 5588d8ef2..80223bc91 100644
--- a/src/shared-components/chip/style.ts
+++ b/src/shared-components/chip/style.ts
@@ -1,8 +1,7 @@
 import styled from '@emotion/styled';
-import { ThemeType } from 'src/constants/themes/types';
 
 import { style as TYPOGRAPHY_STYLE } from '../typography';
-import { SPACER, TYPOGRAPHY_CONSTANTS } from '../../constants';
+import { SPACER, TYPOGRAPHY_CONSTANTS, ThemeType } from '../../constants';
 
 import { StatusType } from '.';
 
diff --git a/src/shared-components/container/style.ts b/src/shared-components/container/style.ts
index b08b7d491..7fefbaf2b 100644
--- a/src/shared-components/container/style.ts
+++ b/src/shared-components/container/style.ts
@@ -1,9 +1,8 @@
 import { DetailedHTMLProps, HTMLAttributes } from 'react';
 import styled, { StyledComponent } from '@emotion/styled';
 import PropTypes from 'prop-types';
-import { ThemeType } from 'src/constants/themes/types';
 
-import { SPACER, BOX_SHADOWS, MEDIA_QUERIES } from '../../constants';
+import { SPACER, BOX_SHADOWS, MEDIA_QUERIES, ThemeType } from '../../constants';
 
 const clickableStyle = `
   box-shadow: ${BOX_SHADOWS.clickable};
diff --git a/src/shared-components/dropdown/style.ts b/src/shared-components/dropdown/style.ts
index c4b4bca11..21f9315ea 100644
--- a/src/shared-components/dropdown/style.ts
+++ b/src/shared-components/dropdown/style.ts
@@ -1,11 +1,11 @@
 import styled from '@emotion/styled';
 import { css } from '@emotion/core';
-import { ThemeType } from 'src/constants/themes/types';
 
 import {
   BOX_SHADOWS,
   SPACER,
   ANIMATION,
+  ThemeType,
   TYPOGRAPHY_CONSTANTS,
 } from '../../constants';
 
diff --git a/src/shared-components/field/style.ts b/src/shared-components/field/style.ts
index e1d142325..3ad1f0f30 100644
--- a/src/shared-components/field/style.ts
+++ b/src/shared-components/field/style.ts
@@ -1,9 +1,8 @@
 import styled from '@emotion/styled';
 import { css } from '@emotion/core';
-import { ThemeType } from 'src/constants/themes/types';
 
 import { style as TYPOGRAPHY_STYLE } from '../typography';
-import { BOX_SHADOWS, SPACER, ANIMATION } from '../../constants';
+import { BOX_SHADOWS, SPACER, ANIMATION, ThemeType } from '../../constants';
 import { MessagesTypes } from '../verificationMessages';
 
 export const HintItem = styled.div`
diff --git a/src/shared-components/immersiveModal/style.ts b/src/shared-components/immersiveModal/style.ts
index a3cdc2805..f0fe0736e 100644
--- a/src/shared-components/immersiveModal/style.ts
+++ b/src/shared-components/immersiveModal/style.ts
@@ -1,6 +1,5 @@
 import styled from '@emotion/styled';
 import { buttonReset } from 'src/utils/styles/buttonReset';
-import { ThemeType } from 'src/constants/themes/types';
 
 import Typography from '../typography';
 import {
@@ -9,6 +8,7 @@ import {
   SPACER,
   Z_SCALE,
   ANIMATION,
+  ThemeType,
   TYPOGRAPHY_CONSTANTS,
 } from '../../constants';
 
diff --git a/src/shared-components/loadingSpinner/index.tsx b/src/shared-components/loadingSpinner/index.tsx
index 960b86bac..b03615cdd 100644
--- a/src/shared-components/loadingSpinner/index.tsx
+++ b/src/shared-components/loadingSpinner/index.tsx
@@ -1,9 +1,9 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { ThemeColors } from 'src/constants/themes/types';
 import { useTheme } from 'emotion-theming';
 
 import { LoadingSpinnerContainer, Overlay, Dot } from './style';
+import { ThemeColors } from '../../constants';
 
 type LoadingSpinnerProps = {
   /**
diff --git a/src/shared-components/loadingSpinner/style.ts b/src/shared-components/loadingSpinner/style.ts
index c3e653a6f..d04e2050c 100644
--- a/src/shared-components/loadingSpinner/style.ts
+++ b/src/shared-components/loadingSpinner/style.ts
@@ -1,6 +1,7 @@
 import styled from '@emotion/styled';
 import { keyframes } from '@emotion/core';
-import { ThemeColors } from 'src/constants/themes/types';
+
+import { ThemeColors } from '../../constants';
 
 const appPreloader = (translateX: string) => keyframes`
   0% { opacity: 0; transform: translate3d(${translateX}, 0, 0) }
diff --git a/src/shared-components/optionButton/style.ts b/src/shared-components/optionButton/style.ts
index 834c95bd5..7336fc817 100644
--- a/src/shared-components/optionButton/style.ts
+++ b/src/shared-components/optionButton/style.ts
@@ -1,8 +1,7 @@
 import styled from '@emotion/styled';
-import { ThemeType } from 'src/constants/themes/types';
 
 import { style as TYPOGRAPHY_STYLE } from '../typography';
-import { ANIMATION, SPACER, BOX_SHADOWS } from '../../constants';
+import { ANIMATION, SPACER, BOX_SHADOWS, ThemeType } from '../../constants';
 import { containerStyles, ContainerType } from '../container/style';
 
 type BaseIconWrapperStylesProps = {
diff --git a/src/shared-components/progressBar/index.tsx b/src/shared-components/progressBar/index.tsx
index 13ca2277b..8a425c40b 100644
--- a/src/shared-components/progressBar/index.tsx
+++ b/src/shared-components/progressBar/index.tsx
@@ -1,9 +1,8 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { useTheme } from 'emotion-theming';
-import { ThemeColors } from 'src/constants/themes/types';
 
-import { PROGRESS_BAR_STATUS } from '../../constants';
+import { PROGRESS_BAR_STATUS, ThemeColors } from '../../constants';
 import { OuterContainer, InnerBar } from './style';
 
 export type ProgressBarStatusType = valueof<typeof PROGRESS_BAR_STATUS>;
diff --git a/src/shared-components/progressBar/style.ts b/src/shared-components/progressBar/style.ts
index d5e138b77..6f7334e68 100644
--- a/src/shared-components/progressBar/style.ts
+++ b/src/shared-components/progressBar/style.ts
@@ -1,8 +1,7 @@
 import styled from '@emotion/styled';
 import { keyframes } from '@emotion/core';
-import { ThemeType } from 'src/constants/themes/types';
 
-import { ANIMATION, PROGRESS_BAR_STATUS } from '../../constants';
+import { ANIMATION, PROGRESS_BAR_STATUS, ThemeType } from '../../constants';
 
 import { ProgressBarStatusType } from '.';
 
diff --git a/src/shared-components/selectorButton/style.ts b/src/shared-components/selectorButton/style.ts
index b5c842fff..7e29dc8ea 100644
--- a/src/shared-components/selectorButton/style.ts
+++ b/src/shared-components/selectorButton/style.ts
@@ -1,7 +1,6 @@
 import styled from '@emotion/styled';
-import { ThemeType } from 'src/constants/themes/types';
 
-import { SPACER, ANIMATION, BOX_SHADOWS } from '../../constants';
+import { SPACER, ANIMATION, BOX_SHADOWS, ThemeType } from '../../constants';
 
 import { SelectorType, SizeType, StyleType } from '.';
 
diff --git a/src/shared-components/toggle/style.ts b/src/shared-components/toggle/style.ts
index b3604baa5..48fd5c9b6 100644
--- a/src/shared-components/toggle/style.ts
+++ b/src/shared-components/toggle/style.ts
@@ -1,7 +1,6 @@
 import styled from '@emotion/styled';
-import { ThemeType } from 'src/constants/themes/types';
 
-import { BOX_SHADOWS, SPACER } from '../../constants';
+import { BOX_SHADOWS, SPACER, ThemeType } from '../../constants';
 
 export const Container = styled.div`
   position: relative;
diff --git a/src/shared-components/typography/index.ts b/src/shared-components/typography/index.ts
index 1878a51c4..de8ae5fbc 100644
--- a/src/shared-components/typography/index.ts
+++ b/src/shared-components/typography/index.ts
@@ -1,9 +1,8 @@
 import styled from '@emotion/styled';
 import round from 'lodash.round';
-import { ThemeType } from 'src/constants/themes/types';
 
 import { withDeprecationWarning } from '../../utils';
-import { TYPOGRAPHY_CONSTANTS } from '../../constants';
+import { TYPOGRAPHY_CONSTANTS, ThemeType } from '../../constants';
 
 const displayStyle = (theme: ThemeType) => `
   color: ${theme.COLORS.primary};
diff --git a/src/tests/enzymeHelpers.tsx b/src/tests/enzymeHelpers.tsx
index f98483549..fba9d3804 100644
--- a/src/tests/enzymeHelpers.tsx
+++ b/src/tests/enzymeHelpers.tsx
@@ -6,8 +6,8 @@ import {
 } from 'enzyme';
 import React from 'react';
 import { ThemeProvider } from 'emotion-theming';
-import { ThemeType } from 'src/constants/themes/types';
-import { primaryTheme } from 'src/constants';
+
+import { primaryTheme, ThemeType } from '../constants';
 
 // We customize enzyme helper methods to bake-in theming and keep unit tests DRY
 export const mount = (
diff --git a/src/tests/reactTestRendererHelpers.tsx b/src/tests/reactTestRendererHelpers.tsx
index 6773371c6..4768efe82 100644
--- a/src/tests/reactTestRendererHelpers.tsx
+++ b/src/tests/reactTestRendererHelpers.tsx
@@ -1,8 +1,8 @@
 import React from 'react';
 import TestRenderer from 'react-test-renderer';
 import { ThemeProvider } from 'emotion-theming';
-import { primaryTheme } from 'src/constants';
-import { ThemeType } from 'src/constants/themes/types';
+
+import { primaryTheme, ThemeType } from '../constants';
 
 // We customize react-test-renderer methods to bake-in theming and keep unit tests DRY
 export const renderer = {
diff --git a/src/types/@emotion/styled/index.ts b/src/types/@emotion/styled/index.ts
index 8df2d7a44..a2793b410 100644
--- a/src/types/@emotion/styled/index.ts
+++ b/src/types/@emotion/styled/index.ts
@@ -1,5 +1,4 @@
-import { ThemeType } from 'src/constants/themes/types';
-
+import { ThemeType } from '../../../constants/themes/types';
 /**
  * We rely on TypeScript path aliasing in order to decorate our `@emotion/styled` import
  * with built-in type information, so for this one import we need to use relative imports
diff --git a/src/types/emotion-theming/index.ts b/src/types/emotion-theming/index.ts
index 1cb51860e..bc988ca87 100644
--- a/src/types/emotion-theming/index.ts
+++ b/src/types/emotion-theming/index.ts
@@ -1,5 +1,4 @@
-import { ThemeType } from 'src/constants/themes/types';
-
+import { ThemeType } from '../../constants/themes/types';
 /**
  * We rely on TypeScript path aliasing in order to decorate our `emotion-theming` imports
  * with built-in type information, so for this one import we need to use relative imports
diff --git a/src/utils/injectGlobalStyles/style.ts b/src/utils/injectGlobalStyles/style.ts
index 467d8139d..59d24fb58 100644
--- a/src/utils/injectGlobalStyles/style.ts
+++ b/src/utils/injectGlobalStyles/style.ts
@@ -1,7 +1,6 @@
 import 'focus-visible';
-import { ThemeType } from 'src/constants/themes/types';
 
-import { FONTS, TYPOGRAPHY_CONSTANTS } from '../../constants';
+import { FONTS, ThemeType, TYPOGRAPHY_CONSTANTS } from '../../constants';
 import { baseBodyStyles } from '../../shared-components/typography';
 
 /**