diff --git a/giraffe/package.json b/giraffe/package.json
index 680dedf1..02950d12 100644
--- a/giraffe/package.json
+++ b/giraffe/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@influxdata/giraffe",
-  "version": "2.36.1",
+  "version": "2.37.0",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "license": "MIT",
diff --git a/giraffe/src/components/SingleStat/SingleStatLayer.tsx b/giraffe/src/components/SingleStat/SingleStatLayer.tsx
index 637fcbae..c8a5457a 100644
--- a/giraffe/src/components/SingleStat/SingleStatLayer.tsx
+++ b/giraffe/src/components/SingleStat/SingleStatLayer.tsx
@@ -6,7 +6,7 @@ import {
   SINGLE_STAT_SVG_DEFAULT_ATTRIBUTES,
   SINGLE_STAT_SVG_TEXT_DEFAULT_ATTRIBUTES,
   SINGLE_STAT_SVG_TEXT_DEFAULT_STYLE,
-} from '../../constants/singleStatStyles'
+} from '../../style/singleStatStyles'
 import {SingleStatLayerConfig} from '../../types'
 import {formatStatValue} from '../../utils/formatStatValue'
 
diff --git a/giraffe/src/index.ts b/giraffe/src/index.ts
index 5efd8529..58b22423 100644
--- a/giraffe/src/index.ts
+++ b/giraffe/src/index.ts
@@ -27,7 +27,7 @@ export {lineTransform} from './transforms/line'
 export * from './constants/colorSchemes'
 export * from './constants/columnKeys'
 export * from './style/gaugeStyles'
-export * from './constants/singleStatStyles'
+export * from './style/singleStatStyles'
 export {DEFAULT_TABLE_COLORS} from './constants/tableGraph'
 
 // Types
diff --git a/giraffe/src/constants/singleStatStyles.ts b/giraffe/src/style/singleStatStyles.ts
similarity index 68%
rename from giraffe/src/constants/singleStatStyles.ts
rename to giraffe/src/style/singleStatStyles.ts
index 5ff51043..cc77af35 100644
--- a/giraffe/src/constants/singleStatStyles.ts
+++ b/giraffe/src/style/singleStatStyles.ts
@@ -1,10 +1,9 @@
-import CSS from 'csstype'
-
+import {CSSProperties} from 'react'
 export const LASER = '#00C9FF'
 
 export const SINGLE_STAT_DEFAULT_TEST_ID = 'giraffe-layer-single-stat'
 
-export const SINGLE_STAT_DEFAULT_STYLE: CSS.Properties = {
+export const SINGLE_STAT_DEFAULT_STYLE: CSSProperties = {
   alignItems: 'center',
   borderRadius: '4px',
   bottom: 0,
@@ -27,7 +26,7 @@ export const SINGLE_STAT_DEFAULT_STYLE: CSS.Properties = {
   width: '100%',
 }
 
-export const SINGLE_STAT_RESIZER_DEFAULT_STYLE: CSS.Properties = {
+export const SINGLE_STAT_RESIZER_DEFAULT_STYLE: CSSProperties = {
   overflow: 'hidden',
   width: '100%',
   height: '100%',
@@ -47,6 +46,14 @@ export const SINGLE_STAT_SVG_TEXT_DEFAULT_ATTRIBUTES = {
   opacity: 1,
 }
 
-export const SINGLE_STAT_SVG_TEXT_DEFAULT_STYLE: CSS.Properties = {
+export const SINGLE_STAT_SVG_TEXT_DEFAULT_STYLE: CSSProperties = {
   fill: LASER,
 }
+
+export const SINGLE_STAT_SVG_NO_USER_SELECT: CSSProperties = {
+  MozUserSelect: 'none',
+  WebkitTouchCallout: 'none',
+  WebkitUserSelect: 'none',
+  msUserSelect: 'none',
+  userSelect: 'none',
+}
diff --git a/giraffe/src/types/index.ts b/giraffe/src/types/index.ts
index d2d82611..fcc6b7fc 100644
--- a/giraffe/src/types/index.ts
+++ b/giraffe/src/types/index.ts
@@ -1,4 +1,3 @@
-import CSS from 'csstype'
 import {CSSProperties, ReactNode} from 'react'
 import {TimeZone} from './timeZones'
 import {GeoLayerConfig} from './geo'
@@ -295,7 +294,7 @@ export interface AnnotationLayerConfig {
   hoverDimension?: LineHoverDimension | 'auto'
   hoverMargin?: number
   svgAttributes?: SVGAttributes
-  svgStyle?: CSS.Properties
+  svgStyle?: CSSProperties
   lineWidth?: number
   handleAnnotationClick?: (id: string) => void
 }
@@ -364,12 +363,12 @@ export interface SingleStatLayerConfig {
   textOpacity?: number
   backgroundColor?: string
   testID?: string
-  style?: CSS.Properties
-  resizerStyle?: CSS.Properties
+  style?: CSSProperties
+  resizerStyle?: CSSProperties
   svgAttributes?: SVGAttributes
-  svgStyle?: CSS.Properties
+  svgStyle?: CSSProperties
   svgTextAttributes?: SVGAttributes
-  svgTextStyle?: CSS.Properties
+  svgTextStyle?: CSSProperties
 }
 
 export type SVGAttributeFunction = (stat: string) => string
diff --git a/stories/package.json b/stories/package.json
index d311cd9c..9d7a0ee3 100644
--- a/stories/package.json
+++ b/stories/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@influxdata/giraffe-stories",
-  "version": "2.36.1",
+  "version": "2.37.0",
   "license": "MIT",
   "repository": {
     "type": "git",
diff --git a/stories/src/singleStat.stories.tsx b/stories/src/singleStat.stories.tsx
index 674bd113..fcc36925 100644
--- a/stories/src/singleStat.stories.tsx
+++ b/stories/src/singleStat.stories.tsx
@@ -1,11 +1,12 @@
-import * as React from 'react'
+import React from 'react'
 import {storiesOf} from '@storybook/react'
 import {boolean, number, select, text, withKnobs} from '@storybook/addon-knobs'
 import {
   Config,
-  Plot,
-  LayerConfig,
   LASER,
+  LayerConfig,
+  Plot,
+  SINGLE_STAT_SVG_NO_USER_SELECT,
   timeFormatter,
 } from '../../giraffe/src'
 
@@ -247,6 +248,7 @@ storiesOf('Single Stat', module)
           viewBox: stat =>
             `${viewBoxX} ${viewBoxY} ${stat.length * viewBoxWidth} 100`,
         },
+        svgStyle: SINGLE_STAT_SVG_NO_USER_SELECT,
       })
     }