diff --git a/src/components/legacy/AirshipModal.tsx b/src/components/legacy/AirshipModal.tsx
deleted file mode 100644
index ba7676532ae..00000000000
--- a/src/components/legacy/AirshipModal.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import * as React from 'react'
-import { StyleSheet } from 'react-native'
-import { AirshipBridge, AirshipModal as RealAirshipModal } from 'react-native-airship'
-import { BlurView } from 'rn-id-blurview'
-
-import { THEME } from '../../theme/variables/airbitz'
-import { scale } from '../../util/scaling'
-
-interface Props<T> {
-  bridge: AirshipBridge<T>
-  children: React.ReactNode
-
-  // True to have the modal float in the center of the screen,
-  // or false for a bottom modal:
-  center?: boolean
-
-  // Called when the user taps outside the modal or clicks the back button:
-  onCancel: () => void
-}
-
-/**
- * A modal that slides a modal up from the bottom of the screen
- * and dims the rest of the app.
- */
-export function AirshipModal<T>(props: Props<T>) {
-  const { bridge, children, center, onCancel } = props
-  return (
-    <RealAirshipModal
-      backgroundColor={THEME.COLORS.WHITE}
-      borderRadius={scale(16)}
-      bridge={bridge}
-      center={center}
-      margin={[THEME.rem(2), 0, 0, 0]}
-      onCancel={onCancel}
-      underlay={<BlurView blurType="dark" style={StyleSheet.absoluteFill} />}
-    >
-      {children}
-    </RealAirshipModal>
-  )
-}
diff --git a/src/components/legacy/Buttons/PrimaryButton.ui.tsx b/src/components/legacy/Buttons/PrimaryButton.ui.tsx
index 943e52adaba..fcc6bebb81a 100644
--- a/src/components/legacy/Buttons/PrimaryButton.ui.tsx
+++ b/src/components/legacy/Buttons/PrimaryButton.ui.tsx
@@ -1,7 +1,8 @@
 import * as React from 'react'
-import { Text as RNText, TextStyle, TouchableHighlight, TouchableHighlightProps, View } from 'react-native'
+import { StyleSheet, Text as RNText, TextStyle, TouchableHighlight, TouchableHighlightProps, View } from 'react-native'
 
-import { primaryButtonUnderlay, styles } from './style'
+import { THEME } from '../../../theme/variables/airbitz'
+import { scale } from '../../../util/scaling'
 
 interface TextProps {
   children: React.ReactNode
@@ -35,3 +36,29 @@ export class PrimaryButton extends React.Component<Props> {
     )
   }
 }
+
+const primaryButtonUnderlay = { color: THEME.COLORS.PRIMARY }
+
+const styles = StyleSheet.create({
+  button: {
+    padding: 14,
+    borderRadius: 5,
+    alignItems: 'center',
+    justifyContent: 'center',
+    flex: -1
+  },
+  buttonText: {
+    fontFamily: THEME.FONTS.DEFAULT,
+    fontSize: scale(18),
+    lineHeight: scale(18),
+    position: 'relative',
+    top: 1
+  },
+  // PRIMARY BUTTON
+  primaryButton: {
+    backgroundColor: THEME.COLORS.SECONDARY
+  },
+  primaryButtonText: {
+    color: THEME.COLORS.WHITE
+  }
+})
diff --git a/src/components/legacy/Buttons/SecondaryButton.ui.tsx b/src/components/legacy/Buttons/SecondaryButton.ui.tsx
deleted file mode 100644
index 104a68ada7e..00000000000
--- a/src/components/legacy/Buttons/SecondaryButton.ui.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import * as React from 'react'
-import { Text as RNText, TextStyle, TouchableHighlight, View } from 'react-native'
-
-import { secondaryButtonUnderlay, styles } from './style'
-
-export interface TextProps {
-  children: React.ReactNode
-  style?: TextStyle
-}
-class Text extends React.Component<TextProps> {
-  render() {
-    const { children, style, ...props } = this.props
-    return (
-      <RNText numberOfLines={1} ellipsizeMode="middle" style={[styles.buttonText, styles.secondaryButtonText, style]} {...props}>
-        {children}
-      </RNText>
-    )
-  }
-}
-
-export interface Props {
-  children: React.ReactNode
-  style?: TextStyle
-  onPress: () => void
-}
-export class SecondaryButton extends React.Component<Props> {
-  static Text = Text
-  render() {
-    const { children, style, ...props } = this.props
-    return (
-      <TouchableHighlight underlayColor={secondaryButtonUnderlay.color} style={[styles.button, styles.secondaryButton, style]} {...props}>
-        <View>{children}</View>
-      </TouchableHighlight>
-    )
-  }
-}
diff --git a/src/components/legacy/Buttons/TertiaryButton.ui.tsx b/src/components/legacy/Buttons/TertiaryButton.ui.tsx
deleted file mode 100644
index dedfc8f0165..00000000000
--- a/src/components/legacy/Buttons/TertiaryButton.ui.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import * as React from 'react'
-import { Text as RNText, TextStyle, TouchableHighlight, View } from 'react-native'
-
-import { styles, tertiaryButtonUnderlay } from './style'
-
-export interface TextProps {
-  children: React.ReactNode
-  style?: TextStyle
-}
-class Text extends React.Component<TextProps> {
-  render() {
-    const { children, style, ...props } = this.props
-    return (
-      <RNText numberOfLines={1} ellipsizeMode="middle" style={[styles.buttonText, styles.tertiaryButtonText, style]} {...props}>
-        {children}
-      </RNText>
-    )
-  }
-}
-
-export interface Props {
-  children: React.ReactNode
-  style?: TextStyle
-  onPress?: () => unknown
-}
-export class TertiaryButton extends React.Component<Props> {
-  static Text = Text
-  render() {
-    const { children, style, ...props } = this.props
-    return (
-      <TouchableHighlight underlayColor={tertiaryButtonUnderlay.color} style={[styles.button, styles.tertiaryButton, style]} {...props}>
-        <View>{children}</View>
-      </TouchableHighlight>
-    )
-  }
-}
diff --git a/src/components/legacy/Buttons/style.ts b/src/components/legacy/Buttons/style.ts
deleted file mode 100644
index 0eae61f3361..00000000000
--- a/src/components/legacy/Buttons/style.ts
+++ /dev/null
@@ -1,62 +0,0 @@
-import { StyleSheet } from 'react-native'
-
-import { THEME } from '../../../theme/variables/airbitz'
-import { scale } from '../../../util/scaling'
-
-export const primaryButtonUnderlay = { color: THEME.COLORS.PRIMARY }
-export const secondaryButtonUnderlay = { color: THEME.COLORS.GRAY_1 }
-export const tertiaryButtonUnderlay = { color: THEME.COLORS.GRAY_3 }
-
-export const styles = StyleSheet.create({
-  button: {
-    padding: 14,
-    borderRadius: 5,
-    alignItems: 'center',
-    justifyContent: 'center',
-    flex: -1
-  },
-  buttonText: {
-    fontFamily: THEME.FONTS.DEFAULT,
-    fontSize: scale(18),
-    lineHeight: scale(18),
-    position: 'relative',
-    top: 1
-  },
-  text: {
-    fontFamily: THEME.FONTS.DEFAULT
-  },
-  // PRIMARY BUTTON
-  primaryButton: {
-    backgroundColor: THEME.COLORS.SECONDARY
-  },
-  primaryButtonText: {
-    color: THEME.COLORS.WHITE
-  },
-
-  // SECONDARY BUTTON
-  secondaryButton: {
-    backgroundColor: THEME.COLORS.GRAY_2
-  },
-  secondaryButtonText: {
-    color: THEME.COLORS.WHITE
-  },
-
-  //  TERTIARY BUTTON
-  tertiaryButton: {
-    backgroundColor: THEME.COLORS.WHITE,
-    borderWidth: 2,
-    borderColor: THEME.COLORS.SECONDARY,
-    padding: scale(12)
-  },
-  tertiaryButtonText: {
-    color: THEME.COLORS.PRIMARY
-  },
-  // Text BUTTON
-  textButton: {
-    backgroundColor: THEME.COLORS.TRANSPARENT
-  },
-  textButtonUnderlay: { color: THEME.COLORS.TRANSPARENT },
-  textButtonText: {
-    color: THEME.COLORS.WHITE
-  }
-})
diff --git a/src/components/legacy/ContentArea.tsx b/src/components/legacy/ContentArea.tsx
deleted file mode 100644
index 3800832a0e7..00000000000
--- a/src/components/legacy/ContentArea.tsx
+++ /dev/null
@@ -1,58 +0,0 @@
-import * as React from 'react'
-import { View } from 'react-native'
-
-import { THEME } from '../../theme/variables/airbitz'
-import { LadderLayout } from './LadderLayout'
-
-type BackgroundOptions =
-  | 'none' // Don't draw any background
-  | 'body' // White content
-  | 'tray' // Off-white tray area
-
-interface Props {
-  children: React.ReactNode
-  background?: BackgroundOptions
-
-  // True if we should expand to fill all available space,
-  // or false be tight to the content. Defaults to false:
-  grow?: boolean
-
-  // Space to put around and between all items. Defaults to 1rem:
-  padding?: number | 'wide'
-
-  // True to use a horizontal layout. Defaults to false:
-  horizontal?: boolean
-}
-
-export function ContentArea(props: Props) {
-  const { children, grow = false, horizontal = false } = props
-  const padding = parsePadding(props.padding)
-  const backgroundColor = parseBackground(props.background)
-
-  const style: any = {
-    // Layout:
-    padding,
-    flexGrow: grow ? 1 : 0,
-
-    // Visuals:
-    backgroundColor,
-
-    // Children:
-    alignItems: 'stretch',
-    flexDirection: horizontal ? 'row' : 'column',
-    justifyContent: 'flex-start'
-  }
-
-  return <View style={style}>{LadderLayout({ children, horizontal, padding })}</View>
-}
-
-function parsePadding(padding?: number | 'wide'): number {
-  if (typeof padding === 'number') return padding
-  if (padding === 'wide') return THEME.rem(1.4)
-  return THEME.rem(1)
-}
-
-function parseBackground(background?: BackgroundOptions): string | undefined {
-  if (background === 'body') return THEME.COLORS.WHITE
-  if (background === 'tray') return THEME.COLORS.GRAY_4
-}
diff --git a/src/components/legacy/IconCircle.tsx b/src/components/legacy/IconCircle.tsx
deleted file mode 100644
index 157f3e1e60b..00000000000
--- a/src/components/legacy/IconCircle.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import * as React from 'react'
-import { StyleSheet, View } from 'react-native'
-
-import { THEME } from '../../theme/variables/airbitz'
-import { scale } from '../../util/scaling'
-
-interface Props {
-  children: React.ReactNode
-}
-
-export const iconSize = THEME.rem(3.5)
-
-/**
- * Place this inside a modal (before the content box) to get an
- * offset circle for holding an icon.
- */
-export function IconCircle(props: Props) {
-  return <View style={styles.iconCircle}>{props.children}</View>
-}
-
-const styles = StyleSheet.create({
-  iconCircle: {
-    // Layout:
-    alignSelf: 'center',
-    marginTop: -iconSize / 2,
-    height: iconSize,
-    width: iconSize,
-
-    // Visuals:
-    backgroundColor: THEME.COLORS.WHITE,
-    borderColor: THEME.COLORS.SECONDARY,
-    borderRadius: iconSize / 2,
-    borderWidth: scale(4),
-
-    // Children:
-    alignItems: 'center',
-    justifyContent: 'center',
-    overflow: 'hidden'
-  }
-})
diff --git a/src/components/legacy/LadderLayout.tsx b/src/components/legacy/LadderLayout.tsx
deleted file mode 100644
index 474548817a3..00000000000
--- a/src/components/legacy/LadderLayout.tsx
+++ /dev/null
@@ -1,78 +0,0 @@
-import * as React from 'react'
-import { Image, Text, View } from 'react-native'
-
-interface Props {
-  children: React.ReactNode
-
-  // Space to put between all items:
-  padding: number
-
-  // True to use a horizontal layout. Defaults to false:
-  horizontal?: boolean
-}
-
-/**
- * Lays out a collection of children with equal space between each one.
- */
-export function LadderLayout(props: Props): React.ReactElement {
-  const { horizontal = false, padding } = props
-  const children = React.Children.toArray(props.children)
-
-  // We don't need to do anything in these cases:
-  // @ts-expect-error
-  if (children.length <= 1 || padding === 0) return children
-
-  // Copy the array, inserting spacers if necessary:
-  const newChildren = []
-  let needsSpaceBefore = false
-  for (let i = 0; i < children.length; ++i) {
-    const child = children[i]
-    const needsSpaceAfter = i + 1 < children.length
-
-    const style = {}
-    if (needsSpaceBefore) {
-      // @ts-expect-error
-      if (horizontal) style.marginLeft = padding
-      // @ts-expect-error
-      else style.marginTop = padding
-    }
-    if (needsSpaceAfter) {
-      // @ts-expect-error
-      if (horizontal) style.marginRight = padding
-      // @ts-expect-error
-      else style.marginBottom = padding
-    }
-
-    if (isStyled(child) && (needsSpaceBefore || needsSpaceAfter)) {
-      // This child accepts a stylesheet, so use that for spacing:
-      newChildren.push(
-        // @ts-expect-error
-        React.cloneElement(child, {
-          // @ts-expect-error
-          style: child.props.style == null ? style : Array.isArray(child.props.style) ? [...child.props.style, style] : [child.props.style, style]
-        })
-      )
-      needsSpaceBefore = false
-    } else if (needsSpaceBefore) {
-      // Otherwise, wrap a view around this element:
-      newChildren.push(
-        <View key={`ladder${i}`} style={style}>
-          {child}
-        </View>
-      )
-      needsSpaceBefore = false
-    } else {
-      // Skip this element, and let the next one add spacing instead:
-      newChildren.push(child)
-      needsSpaceBefore = needsSpaceAfter
-    }
-  }
-
-  return <>{newChildren}</>
-}
-
-// @ts-expect-error
-function isStyled(element) {
-  // @ts-expect-error
-  return React.isValidElement(element) && (element.type === Image || element.type === Text || element.type === View || element.props.style != null)
-}
diff --git a/src/components/navigation/FlashNotification.tsx b/src/components/navigation/FlashNotification.tsx
index de80c354f92..08ae8cfdbc9 100644
--- a/src/components/navigation/FlashNotification.tsx
+++ b/src/components/navigation/FlashNotification.tsx
@@ -4,7 +4,7 @@ import { AirshipBridge } from 'react-native-airship'
 import AntDesignIcon from 'react-native-vector-icons/AntDesign'
 
 import { useHandler } from '../../hooks/useHandler'
-import { nightText } from '../../styles/common/textStyles'
+import { THEME } from '../../theme/variables/airbitz'
 import { AirshipDropdown } from '../common/AirshipDropdown'
 import { cacheStyles, Theme, useTheme } from '../services/ThemeContext'
 import { ModalFooter } from '../themed/ModalParts'
@@ -33,9 +33,12 @@ export function FlashNotification(props: Props) {
 
 const getStyles = cacheStyles((theme: Theme) => ({
   text: {
-    // @ts-expect-error
-    ...nightText('row-center'),
-    padding: theme.rem(0.25)
+    color: THEME.COLORS.WHITE,
+    flexShrink: 1,
+    fontFamily: THEME.FONTS.DEFAULT,
+    fontSize: THEME.rem(1),
+    padding: theme.rem(0.25),
+    textAlign: 'center'
   },
   icon: {
     alignSelf: 'center',
diff --git a/src/styles/common/textStyles.tsx b/src/styles/common/textStyles.tsx
index 7a79a722923..443c9a2d001 100644
--- a/src/styles/common/textStyles.tsx
+++ b/src/styles/common/textStyles.tsx
@@ -7,95 +7,5 @@ import { THEME } from '../../theme/variables/airbitz'
  * Use this component just like its HTML equivalent.
  */
 export function B(props: { children: React.ReactNode }) {
-  return <Text style={tweakRules.bold}>{props.children}</Text>
-}
-
-/**
- * Use this function to build a text style for use on a light background.
- */
-// @ts-expect-error
-export function dayText(...rules: keyof Array<typeof dayRules>): any {
-  const base: any = {
-    color: THEME.COLORS.BLACK,
-    fontFamily: THEME.FONTS.DEFAULT,
-    fontSize: textSize.normal
-  }
-  // @ts-expect-error
-  return Object.assign(base, ...rules.map(rule => dayRules[rule]))
-}
-
-/**
- * Use this function to build a text style for use on a dark background.
- */
-// @ts-expect-error
-export function nightText(...rules: keyof Array<typeof nightRules>): any {
-  const base: any = {
-    color: THEME.COLORS.WHITE,
-    fontFamily: THEME.FONTS.DEFAULT,
-    fontSize: textSize.normal
-  }
-  // @ts-expect-error
-  return Object.assign(base, ...rules.map(rule => nightRules[rule]))
-}
-
-// Common text sizes:
-export const textSize = {
-  largest: THEME.rem(1.414), // 2 ^ 0.5
-  large: THEME.rem(1.189), // 2 ^ 0.25
-  normal: THEME.rem(1),
-  small: THEME.rem(0.84), // 2 ^ -0.25
-  smallest: THEME.rem(0.707) // 2 ^ -0.5
-}
-
-// Font modifiers:
-const tweakRules = {
-  bold: { fontFamily: THEME.FONTS.BOLD },
-  small: { fontSize: textSize.small },
-  large: { fontSize: textSize.large }
-}
-
-// Alignment schemes:
-const alignmentRules = {
-  // These work as expected within a `flex-direction: 'column'` container:
-  center: { textAlign: 'center', alignSelf: 'center' },
-  left: { textAlign: 'left', alignSelf: 'stretch' },
-  right: { textAlign: 'right', alignSelf: 'stretch' },
-
-  // Centers signle-line text, or left-justifies multi-line text
-  // within a `flex-direction: 'column'` container:
-  autoCenter: { textAlign: 'left', alignSelf: 'center' },
-
-  // These work within a `flex-direction: 'row'` container:
-  'row-center': { textAlign: 'center', flexShrink: 1 },
-  'row-left': { textAlign: 'left', flexShrink: 1 },
-  'row-right': { textAlign: 'right', flexShrink: 1 }
-}
-
-// Color rules for light backgrounds:
-const dayRules = {
-  ...tweakRules,
-  ...alignmentRules,
-
-  link: {
-    color: THEME.COLORS.ACCENT_BLUE
-  },
-  title: {
-    color: THEME.COLORS.PRIMARY,
-    ...alignmentRules.center,
-    ...tweakRules.large
-  }
-}
-
-// Color rules for dark backgrounds:
-const nightRules = {
-  ...tweakRules,
-  ...alignmentRules,
-
-  link: {
-    textDecoration: 'underline'
-  },
-  title: {
-    ...alignmentRules.center,
-    ...tweakRules.large
-  }
+  return <Text style={{ fontFamily: THEME.FONTS.BOLD }}>{props.children}</Text>
 }
diff --git a/src/theme/variables/airbitz.ts b/src/theme/variables/airbitz.ts
index 4943636ce13..d1cb398d67e 100644
--- a/src/theme/variables/airbitz.ts
+++ b/src/theme/variables/airbitz.ts
@@ -1,51 +1,22 @@
-import { Platform } from 'react-native'
-
 import { scale } from '../../util/scaling'
 
-// https://projects.invisionapp.com/d/main#/console/10954562/239168414/inspect
 export const THEME = {
-  websiteUrl: 'https://edge.app',
   rem(n: number) {
     return Math.round(n * scale(16))
   },
 
-  BUTTONS: {
-    HEIGHT: 44
-  },
-
-  FOOTER_TABS_HEIGHT: 50,
-
   FONTS: {
     DEFAULT: 'SourceSansPro-Black',
-    BOLD: 'SourceSansPro-Bold',
-    SYMBOLS: Platform.OS === 'android' ? 'SF-UI-Text-Regular' : 'SourceSansPro-Black'
+    BOLD: 'SourceSansPro-Bold'
   },
 
   OPACITY: {
-    ACTIVE: 0.3,
-    MID: 0.5,
     MODAL_DARKNESS: 0.7
   },
 
-  ALPHA: {
-    MID: 50,
-    LOW: 10
-  },
-
   COLORS: {
     PRIMARY: '#0D2145',
     SECONDARY: '#0E4B75',
-    PRIMARY_BUTTON_TOUCHED: 'rgba(42,87,153,0.55)',
-    BLUE_3: '#0E507D',
-
-    GRADIENT: {
-      DARK: '#0D2145',
-      LIGHT: '#0E4B75'
-    },
-
-    ACCENT_BLUE: '#0073D9', // Airbitz blue
-    ACCENT_ORANGE: '#F1AA19',
-    ACCENT_RED: '#E85466',
     ACCENT_MINT: '#66EDA8',
 
     BLACK: '#25292C',
@@ -55,39 +26,7 @@ export const THEME = {
     GRAY_4: '#F4F5F6',
     GRAY_5: '#353535',
     WHITE: '#FFFFFF',
-    OFF_WHITE: '#F6F6F6',
-    OPACITY_WHITE: 'rgba(255, 255, 255, 0.1)',
-    OPAQUE_WHITE: 'rgba(255, 255, 255, 0.5)',
-    OPAQUE_WHITE_2: 'rgba(255, 255, 255, 0.75)',
-    OPAQUE_WHITE_3: 'rgba(255, 255, 255, 0.60)',
     OPACITY_GRAY_1: 'rgba(74, 81, 87, 0.1)',
-    SHADOW: '#000000', // True black for crisp drop shadows
-
-    TRANSPARENT: 'transparent',
-
-    ROW_PRESSED: '#D9E3ED', // same as GRAY_3
-
-    APP_STATUS_BAR: '#00000040',
-    COUNTRY_SELECTION_MODAL_BLACK: '#000000', // Same as shadow but descriptive where it is used
-    COUNTRY_SELECTION_MODAL_GRAY_1: '#D8D6D6',
-    COUNTRY_SELECTION_MODAL_GRAY_2: '#58595C',
-    CRYPTO_EXCHANGE_WALLET_LIST_ROW_OPAQUE_BLUE: 'rgba(14, 75, 117, 0.5)',
-    FIO_ADDRESS_LIST_BORDER_BOTTOM: '#D8E2ED',
-    FIO_ADDRESS_LIST_FONT: '#4B5158',
-    HEADER_TEXT_SECONDARY: '#A4C7DF',
-    QR_CODE_BACKGROUND: 'white',
-    QR_CODE_FOREGROUND: 'black',
-    SETTINGS_COMPONENT_GREY: '#CCCCCC',
-    TRANSACTION_DETAILS_GREY_1: '#CCCCCC', // Same as SETTINGS_COMPONENT_GREY
-    TRANSACTION_DETAILS_GREY_2: '#D8D6D6', // Same as COUNTRY_SELECTION_MODAL_GRAY_1
-    TRANSACTION_DETAILS_GREY_3: '#58595C', // Same as COUNTRY_SELECTION_MODAL_GRAY_2
-    TRANSACTION_DETAILS_GREY_4: '#EEE',
-    TRANSACTION_DETAILS_SECONDARY: '#A4C7DF', // Same as HEADER_TEXT_SECONDARY
-    TRANSACTION_LIST_RECEIVED_TX: '#77C513',
-    TRANSACTION_LIST_SENT_TX: '#E85466',
-    WALLET_LIST_DIFF_NEGATIVE: '#E85466', // Same as TRANSACTION_LIST_SENT_TX
-    WALLET_LIST_DIFF_POSITIVE: '#77C513', // Same as TRANSACTION_LIST_RECEIVED_TX
-    WALLET_LIST_GRAY: '#E9E9EF',
-    WALLET_LIST_OPAQUE_BLUE: 'rgba(14, 75, 117, 0.5)' // Same as CRYPTO_EXCHANGE_WALLET_LIST_ROW_OPAQUE_BLUE
+    SHADOW: '#000000' // True black for crisp drop shadows
   }
 }