@ornikar/bumper 1.1.0

package/src/themes/palettes/__snapshots__/deepPurpleColorPalette.stories.tsx.snap

@@ -0,0 +1,2770 @@
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+
+exports[`bumper/Core Tokens Deep Purple Palette 1`] = `
+<RNCSafeAreaProvider
+  onInsetsChange={[Function]}
+  style={
+    [
+      {
+        "flex": 1,
+      },
+      undefined,
+    ]
+  }
+>
+  <View
+    style={
+      {
+        "flexDirection": "column",
+        "paddingBottom": 4,
+        "paddingLeft": 4,
+        "paddingRight": 4,
+        "paddingTop": 4,
+      }
+    }
+  >
+    <Text
+      style={
+        {
+          "fontFamily": "GTStandardSemibold",
+          "fontSize": 38,
+          "letterSpacing": 0,
+          "lineHeight": 48,
+          "marginBottom": 4,
+        }
+      }
+      suppressHighlighting={true}
+    >
+      Palette
+    </Text>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        deepPurple.5
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #936C93
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#936C93",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        deepPurple.6
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #7A587A
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#7A587A",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        deepPurple.7
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #6E4D6E
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#6E4D6E",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        deepPurple.8
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #563B56
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#563B56",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        deepPurple.9
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #452F45
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#452F45",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        beige.1
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #F7F4EE
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#F7F4EE",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        beige.2
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #F1ECE4
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#F1ECE4",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        beige.3
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #EAE3D6
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#EAE3D6",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        beige.4
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #E5DCCA
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#E5DCCA",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        beige.5
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #DDD0B8
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#DDD0B8",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        beige.6
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #C1B59F
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#C1B59F",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        lightning.4
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #FFF966
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#FFF966",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        lightning.5
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #FFF500
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#FFF500",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        lightning.8
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #594D0D
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#594D0D",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        lightning.9
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #43390A
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#43390A",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        rainbow.pink
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #E4A4F9
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#E4A4F9",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        rainbow.brick
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #951D12
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#951D12",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        rainbow.orange
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #DB6E2E
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#DB6E2E",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        rainbow.gold
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #9A7600
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#9A7600",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        rainbow.sun
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #EFD346
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#EFD346",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        rainbow.green-pine
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #1C5D47
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#1C5D47",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        rainbow.green-grass
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #4DA00A
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#4DA00A",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        rainbow.green-apple
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #DEF985
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#DEF985",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        rainbow.blue-electric
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #2850C4
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#2850C4",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        rainbow.blue-sky
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #B2F0FD
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#B2F0FD",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        grey.0
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #ffffff
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#ffffff",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        grey.1
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #ECECEC
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#ECECEC",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        grey.2
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #CDCED0
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#CDCED0",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        grey.3
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #A8A8A8
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#A8A8A8",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        grey.5
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #838383
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#838383",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        grey.7
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #505050
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#505050",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        grey.9
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #101010
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#101010",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        blue.1
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #E9F4FC
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#E9F4FC",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        blue.2
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #BCDFF6
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#BCDFF6",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        blue.6
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #1772AB
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#1772AB",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        blue.7
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #125A87
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#125A87",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        green.1
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #ECFEDD
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#ECFEDD",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        green.2
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #DBFAC1
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#DBFAC1",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        green.6
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #438D06
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#438D06",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        green.7
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #357105
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#357105",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        yellow.1
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #FDF8E7
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#FDF8E7",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        yellow.2
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #FAEBB8
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#FAEBB8",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        yellow.6
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #EFC11F
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#EFC11F",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        yellow.7
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #BA930B
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#BA930B",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        red.1
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #FDE4E3
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#FDE4E3",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        red.2
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #FAB8B8
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#FAB8B8",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        red.6
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #F14847
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#F14847",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        red.7
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #BD100F
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#BD100F",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        beige-alpha.25
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #C1B59F40
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#C1B59F40",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        beige-alpha.40
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #C1B59F66
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#C1B59F66",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        beige-alpha.50
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #C1B59F80
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#C1B59F80",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        grey-alpha.25
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #10101040
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#10101040",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        grey-alpha.35
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #10101059
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#10101059",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        grey-alpha.50
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #10101080
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#10101080",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        white-alpha.10
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #FFFFFF1A
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#FFFFFF1A",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        white-alpha.20
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #FFFFFF33
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#FFFFFF33",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        white-alpha.60
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #FFFFFF99
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#FFFFFF99",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        white-alpha.80
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #FFFFFFCC
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#FFFFFFCC",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        white-alpha.90
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #FFFFFFE5
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#FFFFFFE5",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        white
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #FFFFFF
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#FFFFFF",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        black
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        #000000
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "#000000",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        {
+          "backgroundColor": "#ffffff",
+          "borderBottomColor": "#A8A8A8",
+          "borderBottomWidth": 2,
+          "borderStyle": "solid",
+          "paddingBottom": 8,
+          "paddingLeft": 8,
+          "paddingRight": 8,
+          "paddingTop": 8,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        transparent
+      </Text>
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandard",
+          }
+        }
+        suppressHighlighting={true}
+      >
+        transparent
+      </Text>
+      <View
+        style={
+          {
+            "backgroundColor": "transparent",
+            "height": 20,
+            "width": 20,
+          }
+        }
+      />
+    </View>
+  </View>
+</RNCSafeAreaProvider>
+`;