diff --git a/src/app.tsx b/src/app.tsx
index 27e9c461..a026132e 100644
--- a/src/app.tsx
+++ b/src/app.tsx
@@ -29,6 +29,16 @@ export function App() {
     return <AppPreloader />
   }
 
+  if (value === 'ModeSelection') {
+    return (
+      <div>
+        <button onClick={() => send({ type: 'STANDARD_MODE_SELECTION' })}>Standard mode</button>
+
+        <button onClick={() => send({ type: 'RAINBOW_MODE_SELECTION' })}>Rainbow mode</button>
+      </div>
+    )
+  }
+
   if (value === 'CharacterCreation') {
     return (
       <CharacterCreation
@@ -46,6 +56,7 @@ export function App() {
   return (
     <div className={css['play-area']}>
       <div className={css['play-area-wrapper']}>
+        CURRENT MODE = {context.game.mode}
         <div className={css['play-area-banner']}>
           <Inline>
             <StatsRow>
@@ -80,7 +91,6 @@ export function App() {
             </AnimatePresence>
           </Inline>
         </div>
-
         <div className={css['combat-zone']}>
           <AnimatePresence>
             {context.game.player.characterPortrait ? (
@@ -197,7 +207,6 @@ export function App() {
             </AnimatePresence>
           </Stack>
         </div>
-
         <Stack className={css['current-hand']}>
           <Stack spacing="100">
             <div className={css['current-hand-wrapper']}>
@@ -228,7 +237,6 @@ export function App() {
             Current hand with {context.game.currentHand.length} cards
           </Stack>
         </Stack>
-
         <Stack className={css['discard-pile']}>
           <Deck>
             {context.game.discardPile.map((card, index) => {
@@ -243,7 +251,6 @@ export function App() {
           </Deck>
           <div>Discard pile with {context.game.discardPile.length} cards</div>
         </Stack>
-
         <AnimatePresence
           onExitComplete={() => send({ type: 'DISCARD_CARD_ANIMATION_COMPLETE' })}
           mode="popLayout"
@@ -267,7 +274,6 @@ export function App() {
             </motion.div>
           ) : null}
         </AnimatePresence>
-
         <Stack className={css['draw-pile']}>
           <Deck>
             {context.game.drawPile.map((card, index) => {
diff --git a/src/machines/app-machine/app-machine.ts b/src/machines/app-machine/app-machine.ts
index a554c8ed..e7d42e67 100644
--- a/src/machines/app-machine/app-machine.ts
+++ b/src/machines/app-machine/app-machine.ts
@@ -118,6 +118,7 @@ export type AppMachineContext = {
     cards: Array<Card>
   }
   game: {
+    mode: 'standard' | 'rainbow'
     player: {
       characterClass: CharacterClass | undefined
       characterClassDeck: Array<Card>
@@ -152,6 +153,8 @@ export type AppMachineContext = {
 }
 
 type AppMachineEvent =
+  | { type: 'STANDARD_MODE_SELECTION' }
+  | { type: 'RAINBOW_MODE_SELECTION' }
   | {
       type: 'CREATE_CHARACTER'
       data: { characterClass: string; characterName: string; characterPortrait: string }
@@ -438,6 +441,7 @@ export const appMachine = setup({
       cards: CARDS,
     },
     game: {
+      mode: 'standard',
       player: {
         characterClass: undefined,
         characterClassDeck: [],
@@ -476,11 +480,37 @@ export const appMachine = setup({
     LoadingAssets: {
       invoke: {
         src: 'loadAllAssets',
-        onDone: 'CharacterCreation',
+        onDone: 'ModeSelection',
         onError: 'LoadingAssetsError',
       },
     },
     LoadingAssetsError: {},
+    ModeSelection: {
+      on: {
+        STANDARD_MODE_SELECTION: {
+          actions: assign({
+            game: ({ context }) => {
+              return {
+                ...context.game,
+                mode: 'standard',
+              }
+            },
+          }),
+          target: 'CharacterCreation',
+        },
+        RAINBOW_MODE_SELECTION: {
+          actions: assign({
+            game: ({ context }) => {
+              return {
+                ...context.game,
+                mode: 'rainbow',
+              }
+            },
+          }),
+          target: 'CharacterCreation',
+        },
+      },
+    },
     CharacterCreation: {
       on: {
         CREATE_CHARACTER: {