diff --git a/packages/perseus-editor/src/components/__stories__/device-framer.stories.tsx b/packages/perseus-editor/src/components/__stories__/device-framer.stories.tsx
index 79ae5e8f18..a6f9f06cfc 100644
--- a/packages/perseus-editor/src/components/__stories__/device-framer.stories.tsx
+++ b/packages/perseus-editor/src/components/__stories__/device-framer.stories.tsx
@@ -1,5 +1,4 @@
-import Spacing from "@khanacademy/wonder-blocks-spacing";
-import {color} from "@khanacademy/wonder-blocks-tokens";
+import {color, spacing} from "@khanacademy/wonder-blocks-tokens";
 
 import DeviceFramer from "../device-framer";
 
@@ -21,7 +20,7 @@ const SampleContent = () => {
                 color: color.offWhite,
                 width: "90%",
                 height: "300px",
-                padding: Spacing.medium_16,
+                padding: spacing.medium_16,
             }}
         >
             The DeviceFramer controls the size of the content inside the frame.
diff --git a/packages/perseus-editor/src/components/widget-editor.tsx b/packages/perseus-editor/src/components/widget-editor.tsx
index 5b21deadd2..7c406660a0 100644
--- a/packages/perseus-editor/src/components/widget-editor.tsx
+++ b/packages/perseus-editor/src/components/widget-editor.tsx
@@ -8,8 +8,8 @@ import {
 } from "@khanacademy/perseus";
 import {useUniqueIdWithMock} from "@khanacademy/wonder-blocks-core";
 import {Strut} from "@khanacademy/wonder-blocks-layout";
-import Spacing from "@khanacademy/wonder-blocks-spacing";
 import Switch from "@khanacademy/wonder-blocks-switch";
+import {spacing} from "@khanacademy/wonder-blocks-tokens";
 import * as React from "react";
 import _ from "underscore";
 
@@ -241,7 +241,7 @@ function LabeledSwitch(props: {
     return (
         <>
             <label htmlFor={id}>{label}</label>
-            <Strut size={Spacing.xxSmall_6} />
+            <Strut size={spacing.xxSmall_6} />
             <Switch id={id} {...switchProps} />
         </>
     );