Implements color variables and updates components

1 files changed, 3 insertions, 3 deletions

diff --git a/packages/dev-tools-pages/ts/components/Intro.tsx b/packages/dev-tools-pages/ts/components/Intro.tsx
index c16c888b7..2d4a30f9f 100644
--- a/packages/dev-tools-pages/ts/components/Intro.tsx
+++ b/packages/dev-tools-pages/ts/components/Intro.tsx
@@ -1,10 +1,11 @@
 import * as React from 'react';
 import styled from 'styled-components';
+import variables from '../variables';
 
 import { Alpha, Beta } from './Typography';
 
 const Main = styled.div`
-    background-color: #f1f4f5;
+    background-color: ${variables.colors.lightGray};
     padding: 6.25rem;
     display: flex;
     justify-content: space-between;
@@ -16,13 +17,12 @@ const Title = styled(Alpha)`
 
 const Content = styled.div`
     max-width: 25.9375rem;
-
     display: flex;
     flex-direction: column;
 `;
 
 const Code = styled.div`
-    background-color: #e9eced;
+    background-color: ${variables.colors.darkGray};
     width: 520px;
     height: 350px;
 `;