diff --git a/editor/src/components/inspector/constraints-section.tsx b/editor/src/components/inspector/constraints-section.tsx
index 95cd3353e71c..2d0f6f0d957d 100644
--- a/editor/src/components/inspector/constraints-section.tsx
+++ b/editor/src/components/inspector/constraints-section.tsx
@@ -125,7 +125,7 @@ const GroupChildConstraintsSection = React.memo(() => {
 
   return (
     <FlexColumn css={{ paddingBottom: UtopiaTheme.layout.rowHorizontalPadding }}>
-      <UIGridRow padded variant='<-auto-><----------1fr--------->'>
+      <UIGridRow padded variant='<--auto--><--1fr-->|22px|'>
         <ChildPinControl
           key={selectedViews.map(EP.toString).join('-')}
           isGroupChild='group-child'
@@ -148,7 +148,7 @@ const FrameChildConstraintsSection = React.memo(() => {
 
   return (
     <FlexColumn css={{ paddingBottom: UtopiaTheme.layout.rowHorizontalPadding }}>
-      <UIGridRow padded variant='<-auto-><----------1fr--------->'>
+      <UIGridRow padded variant='<--auto--><--1fr-->|22px|'>
         <ChildPinControl isGroupChild='frame-child' pins={pins} framePinsInfo={framePinsInfo} />
         <FlexColumn css={{ gap: 8 }}>
           <ChildConstraintSelect isGroupChild='frame-child' dimension={'width'} />
diff --git a/editor/src/components/inspector/fill-hug-fixed-control.tsx b/editor/src/components/inspector/fill-hug-fixed-control.tsx
index 2136933abf79..e97e7e2e5e5b 100644
--- a/editor/src/components/inspector/fill-hug-fixed-control.tsx
+++ b/editor/src/components/inspector/fill-hug-fixed-control.tsx
@@ -71,13 +71,13 @@ import type { ElementPathTrees } from '../../core/shared/element-path-tree'
 export const FillFixedHugControlId = (segment: 'width' | 'height'): string =>
   `hug-fixed-fill-${segment}`
 
-export const FillContainerLabel = 'Fill container' as const
+export const FillContainerLabel = 'Fill' as const
 export const FixedLabel = 'Fixed' as const
 export const ScaledLabel = 'Scaled' as const
-export const HugContentsLabel = 'Hug contents' as const
+export const HugContentsLabel = 'Hug' as const
 export const SqueezeContentsLabel = 'Squeeze' as const
 export const CollapsedLabel = 'Collapsed' as const
-export const HugGroupContentsLabel = 'Hug contents' as const
+export const HugGroupContentsLabel = 'Hug' as const
 export const ComputedLabel = 'Computed' as const
 export const DetectedLabel = 'Detected' as const
 
diff --git a/editor/src/components/inspector/flex-section.tsx b/editor/src/components/inspector/flex-section.tsx
index 733a7184fdcd..97a4d96f5e34 100644
--- a/editor/src/components/inspector/flex-section.tsx
+++ b/editor/src/components/inspector/flex-section.tsx
@@ -523,7 +523,6 @@ function AxisDimensionControl({
           {value.areaName ?? index + 1}
         </Subdued>
         <NumberOrKeywordControl
-          style={{ flex: 1 }}
           testId={testId}
           value={value.value}
           keywords={gridDimensionDropdownKeywords}
diff --git a/editor/src/components/inspector/inspector.tsx b/editor/src/components/inspector/inspector.tsx
index be41d57fd25a..6ebfd4e99950 100644
--- a/editor/src/components/inspector/inspector.tsx
+++ b/editor/src/components/inspector/inspector.tsx
@@ -51,7 +51,7 @@ import {
   useKeepReferenceEqualityIfPossible,
   useKeepShallowReferenceEquality,
 } from '../../utils/react-performance'
-import { Icn, useColorTheme, UtopiaTheme, FlexRow, Button } from '../../uuiui'
+import { Icn, useColorTheme, UtopiaTheme, FlexRow, Button, SquareButton } from '../../uuiui'
 import { getElementsToTarget } from './common/inspector-utils'
 import type { ElementPath, PropertyPath } from '../../core/shared/project-file-types'
 import { unless, when } from '../../utils/react-conditionals'
@@ -122,7 +122,7 @@ interface AlignDistributeButtonProps {
 const AlignDistributeButton = React.memo<AlignDistributeButtonProps>(
   (props: AlignDistributeButtonProps) => {
     return (
-      <Button disabled={props.disabled} onMouseUp={props.onMouseUp}>
+      <SquareButton highlight disabled={props.disabled} onMouseUp={props.onMouseUp}>
         <Icn
           tooltipText={props.toolTip}
           category='layout/commands'
@@ -130,7 +130,7 @@ const AlignDistributeButton = React.memo<AlignDistributeButtonProps>(
           width={16}
           height={16}
         />
-      </Button>
+      </SquareButton>
     )
   },
 )
@@ -177,7 +177,6 @@ const AlignmentButtons = React.memo((props: { numberOfTargets: number }) => {
         justifyContent: 'space-around',
         alignItems: 'center',
         height: UtopiaTheme.layout.rowHeight.normal,
-        background: colorTheme.inspectorBackground.value,
         padding: '8px 0px',
         flexShrink: 0,
       }}
diff --git a/editor/src/components/inspector/sections/layout-section/self-layout-subsection/clip-content-control.tsx b/editor/src/components/inspector/sections/layout-section/self-layout-subsection/clip-content-control.tsx
index 50223da80cf2..80ac7a0fa474 100644
--- a/editor/src/components/inspector/sections/layout-section/self-layout-subsection/clip-content-control.tsx
+++ b/editor/src/components/inspector/sections/layout-section/self-layout-subsection/clip-content-control.tsx
@@ -2,6 +2,7 @@ import React from 'react'
 import { useInspectorStyleInfo, useIsSubSectionVisible } from '../../../common/property-path-hooks'
 import { BooleanControl } from '../../../controls/boolean-control'
 import { FlexRow } from 'utopia-api'
+import { UtopiaTheme } from '../../../../../uuiui'
 
 export const ClipContentControl = React.memo(() => {
   const isVisible = useIsSubSectionVisible('overflow')
@@ -20,7 +21,15 @@ export const ClipContentControl = React.memo(() => {
   }
 
   return (
-    <FlexRow style={{ paddingBottom: 8, alignItems: 'center', gap: 8 }} css={undefined}>
+    <FlexRow
+      style={{
+        minHeight: UtopiaTheme.layout.rowHeight.normal,
+        paddingBottom: 8,
+        alignItems: 'center',
+        gap: 8,
+      }}
+      css={undefined}
+    >
       <BooleanControl
         key='clip-content-control'
         id='clip-content-control'
diff --git a/editor/src/components/inspector/sections/layout-section/self-layout-subsection/frame-updating-layout-section.spec.browser2.tsx b/editor/src/components/inspector/sections/layout-section/self-layout-subsection/frame-updating-layout-section.spec.browser2.tsx
index ea57b5be0e61..26a18ed7c5bc 100644
--- a/editor/src/components/inspector/sections/layout-section/self-layout-subsection/frame-updating-layout-section.spec.browser2.tsx
+++ b/editor/src/components/inspector/sections/layout-section/self-layout-subsection/frame-updating-layout-section.spec.browser2.tsx
@@ -540,8 +540,8 @@ describe('Frame updating layout section', () => {
               </Group>
             </Group>
           </div>`,
-        expectedFixedHugDropdownWidthValue: 'Hug contents',
-        expectedFixedHugDropdownHeightValue: 'Hug contents',
+        expectedFixedHugDropdownWidthValue: 'Hug',
+        expectedFixedHugDropdownHeightValue: 'Hug',
       }),
     )
 
@@ -710,8 +710,8 @@ describe('Frame updating layout section', () => {
               </Group>
             </Group>
           </div>`,
-        expectedFixedHugDropdownWidthValue: 'Hug contents',
-        expectedFixedHugDropdownHeightValue: 'Hug contents',
+        expectedFixedHugDropdownWidthValue: 'Hug',
+        expectedFixedHugDropdownHeightValue: 'Hug',
       }),
     )
   })
@@ -1113,8 +1113,8 @@ describe('Frame updating layout section', () => {
               </Group>
             </Group>
           </div>`,
-        expectedFixedHugDropdownWidthValue: 'Hug contents',
-        expectedFixedHugDropdownHeightValue: 'Hug contents',
+        expectedFixedHugDropdownWidthValue: 'Hug',
+        expectedFixedHugDropdownHeightValue: 'Hug',
       }),
     )
 
@@ -1427,7 +1427,7 @@ describe('Frame updating layout section', () => {
             />
           </div>`,
         expectedFixedHugDropdownWidthValue: 'Scaled',
-        expectedFixedHugDropdownHeightValue: 'Fill container',
+        expectedFixedHugDropdownHeightValue: 'Fill',
       }),
     )
 
@@ -1693,8 +1693,8 @@ describe('Frame updating layout section', () => {
           </Group>
         </Group>
       </div>`,
-        expectedFixedHugDropdownWidthValue: 'Hug contents',
-        expectedFixedHugDropdownHeightValue: 'Hug contents',
+        expectedFixedHugDropdownWidthValue: 'Hug',
+        expectedFixedHugDropdownHeightValue: 'Hug',
       }),
     )
 
@@ -1863,8 +1863,8 @@ describe('Frame updating layout section', () => {
           </Group>
         </Group>
       </div>`,
-        expectedFixedHugDropdownWidthValue: 'Hug contents',
-        expectedFixedHugDropdownHeightValue: 'Hug contents',
+        expectedFixedHugDropdownWidthValue: 'Hug',
+        expectedFixedHugDropdownHeightValue: 'Hug',
       }),
     )
 
@@ -2033,8 +2033,8 @@ describe('Frame updating layout section', () => {
           </Group>
         </Group>
       </div>`,
-        expectedFixedHugDropdownWidthValue: 'Hug contents',
-        expectedFixedHugDropdownHeightValue: 'Hug contents',
+        expectedFixedHugDropdownWidthValue: 'Hug',
+        expectedFixedHugDropdownHeightValue: 'Hug',
       }),
     )
 
@@ -2203,8 +2203,8 @@ describe('Frame updating layout section', () => {
           </Group>
         </Group>
       </div>`,
-        expectedFixedHugDropdownWidthValue: 'Hug contents',
-        expectedFixedHugDropdownHeightValue: 'Hug contents',
+        expectedFixedHugDropdownWidthValue: 'Hug',
+        expectedFixedHugDropdownHeightValue: 'Hug',
       }),
     )
   })
@@ -2407,7 +2407,7 @@ describe('Frame updating layout section', () => {
               }}
             />
           </div>`,
-        expectedFixedHugDropdownWidthValue: 'Fill container',
+        expectedFixedHugDropdownWidthValue: 'Fill',
         expectedFixedHugDropdownHeightValue: 'Scaled',
       }),
     )
diff --git a/editor/src/components/inspector/sections/layout-section/self-layout-subsection/frame-updating-layout-section.tsx b/editor/src/components/inspector/sections/layout-section/self-layout-subsection/frame-updating-layout-section.tsx
index 714243ecdbf3..a48bf49ff382 100644
--- a/editor/src/components/inspector/sections/layout-section/self-layout-subsection/frame-updating-layout-section.tsx
+++ b/editor/src/components/inspector/sections/layout-section/self-layout-subsection/frame-updating-layout-section.tsx
@@ -273,11 +273,7 @@ export const FrameUpdatingLayoutSection = React.memo(() => {
 
   return (
     <>
-      <UIGridRow
-        padded={false}
-        variant='<--1fr--><--1fr-->'
-        style={{ minHeight: undefined, gap: 4 }}
-      >
+      <UIGridRow padded={false} variant='<--1fr--><--1fr-->|22px|'>
         <FrameUpdatingLayoutControl
           property='left'
           label='L'
@@ -293,11 +289,7 @@ export const FrameUpdatingLayoutSection = React.memo(() => {
           invalid={invalidPins.top || invalidPins.bottom} // currently showing red for BOTH directions
         />
       </UIGridRow>
-      <UIGridRow
-        padded={false}
-        variant='<--1fr--><--1fr-->'
-        style={{ minHeight: undefined, gap: 4 }}
-      >
+      <UIGridRow padded={false} variant='<--1fr--><--1fr-->|22px|'>
         <FrameUpdatingLayoutControl
           property='width'
           label='W'
diff --git a/editor/src/components/inspector/sections/layout-section/self-layout-subsection/simplified-layout-subsection.tsx b/editor/src/components/inspector/sections/layout-section/self-layout-subsection/simplified-layout-subsection.tsx
index 62c2eb4b69db..0c76a94ea7af 100644
--- a/editor/src/components/inspector/sections/layout-section/self-layout-subsection/simplified-layout-subsection.tsx
+++ b/editor/src/components/inspector/sections/layout-section/self-layout-subsection/simplified-layout-subsection.tsx
@@ -1,6 +1,12 @@
 import React from 'react'
 import { when } from '../../../../../utils/react-conditionals'
-import { FlexColumn, FlexRow, InspectorSubsectionHeader, Tooltip } from '../../../../../uuiui'
+import {
+  FlexColumn,
+  FlexRow,
+  InspectorSubsectionHeader,
+  Tooltip,
+  UtopiaTheme,
+} from '../../../../../uuiui'
 import { Link } from '../../../../../uuiui/link'
 import { useConvertWrapperToFrame } from '../../../../canvas/canvas-strategies/strategies/group-conversion-helpers'
 import { Substores, useEditorState } from '../../../../editor/store/store-hook'
@@ -29,38 +35,34 @@ export const SimplifiedLayoutSubsection = React.memo(() => {
 
   return (
     <FlexColumn>
-      <InspectorSubsectionHeader style={{ border: 'none' }}>
-        <FlexRow
-          style={{
-            flexGrow: 1,
-            gap: 8,
-            height: 42,
-          }}
-        >
-          <EditorContractDropdown />
-          <ResizeToFitControl />
-        </FlexRow>
-      </InspectorSubsectionHeader>
+      <FlexRow
+        style={{
+          flexGrow: 1,
+          gap: 8,
+          height: UtopiaTheme.layout.rowHeight.normal,
+          padding: `0 ${UtopiaTheme.layout.inspectorXPadding}px 0 4px`,
+          fontWeight: 600,
+        }}
+      >
+        <EditorContractDropdown />
+        <ResizeToFitControl />
+      </FlexRow>
       {when(showWrapperSectionWarning, <WrapperElementDisclosureBox />)}
-      <FlexColumn style={{ gap: 8, paddingLeft: 8, paddingRight: 8 }}>
+      <FlexColumn style={{ paddingLeft: 8, paddingRight: 8 }}>
         {when(
           showLayoutSection,
           <>
             <FrameUpdatingLayoutSection />
-            <UIGridRow
-              padded={false}
-              variant='<--1fr--><--1fr-->'
-              style={{ minHeight: undefined, gap: 4 }}
-            >
+            <UIGridRow padded={false} variant='<--1fr--><--1fr-->|22px|'>
               <FixedHugDropdown dimension='width' />
               <FixedHugDropdown dimension='height' />
             </UIGridRow>
-            <FlexRow style={{ minHeight: undefined, gap: 4 }}>
+            <UIGridRow padded={false} variant='<-------------1fr------------->'>
               <RadiusRow />
-            </FlexRow>
-            <FlexRow style={{ minHeight: undefined, gap: 4 }}>
+            </UIGridRow>
+            <UIGridRow padded={false} variant='<-------------1fr------------->'>
               <ClipContentControl />
-            </FlexRow>
+            </UIGridRow>
           </>,
         )}
       </FlexColumn>
diff --git a/editor/src/components/inspector/sections/style-section/text-subsection/text-shadow-subsection.tsx b/editor/src/components/inspector/sections/style-section/text-subsection/text-shadow-subsection.tsx
index d8bbc4d707d1..f48507b985c1 100644
--- a/editor/src/components/inspector/sections/style-section/text-subsection/text-shadow-subsection.tsx
+++ b/editor/src/components/inspector/sections/style-section/text-subsection/text-shadow-subsection.tsx
@@ -176,8 +176,7 @@ const TextShadowItem = React.memo<TextShadowItemProps>((props) => {
     <PropertyRow
       key={props.index}
       style={{
-        gridTemplateColumns: `12px 28px repeat(3, 1fr) ${UtopiaTheme.layout.inputHeight.default}`,
-        gridColumnGap: 8,
+        gridTemplateColumns: `12px 28px 1fr 1fr 1fr ${UtopiaTheme.layout.inputHeight.default}px`,
       }}
     >
       <BooleanControl
diff --git a/editor/src/components/inspector/widgets/ui-grid-row.tsx b/editor/src/components/inspector/widgets/ui-grid-row.tsx
index 3df0c9887e14..650b53ab98c5 100644
--- a/editor/src/components/inspector/widgets/ui-grid-row.tsx
+++ b/editor/src/components/inspector/widgets/ui-grid-row.tsx
@@ -67,9 +67,13 @@ const gridTemplates = {
     gridTemplateColumns: '1fr 1fr',
   },
   '<--1fr--><--1fr-->|22px|': {
-    gridColumnGap: 4,
+    gridColumnGap: 8,
     gridTemplateColumns: '1fr 1fr 22px',
   },
+  '<--auto--><--1fr-->|22px|': {
+    gridColumnGap: 8,
+    gridTemplateColumns: 'auto 1fr 22px',
+  },
   '<--1fr--><--1fr-->|-18px-|': {
     gridColumnGap: 4,
     // multiple columns with 1fr don't actually resize evenly as expected,
diff --git a/editor/src/core/performance/__snapshots__/performance-regression-tests.spec.tsx.snap b/editor/src/core/performance/__snapshots__/performance-regression-tests.spec.tsx.snap
index 6a9ad7f91c35..0a70f798d0e7 100644
--- a/editor/src/core/performance/__snapshots__/performance-regression-tests.spec.tsx.snap
+++ b/editor/src/core/performance/__snapshots__/performance-regression-tests.spec.tsx.snap
@@ -592,17 +592,17 @@ Array [
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/Symbol(react.memo)(NumberInput)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
-  "/Symbol(react.forward_ref)(Styled(div))/div//Symbol(react.memo)()",
-  "/Symbol(react.forward_ref)(Styled(div))/div//div",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//Symbol(react.memo)()",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//div",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(BooleanControl)",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(FlexRow)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(BooleanControl)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(FlexRow)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/span",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/Symbol(react.memo)()",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
@@ -1134,17 +1134,17 @@ Array [
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/Symbol(react.memo)(NumberInput)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
-  "/Symbol(react.forward_ref)(Styled(div))/div//Symbol(react.memo)()",
-  "/Symbol(react.forward_ref)(Styled(div))/div//div",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//Symbol(react.memo)()",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//div",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(BooleanControl)",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(FlexRow)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(BooleanControl)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(FlexRow)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/span",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/Symbol(react.memo)()",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
@@ -1395,17 +1395,17 @@ Array [
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/Symbol(react.memo)(NumberInput)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
-  "/Symbol(react.forward_ref)(Styled(div))/div//Symbol(react.memo)()",
-  "/Symbol(react.forward_ref)(Styled(div))/div//div",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//Symbol(react.memo)()",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//div",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(BooleanControl)",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(FlexRow)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(BooleanControl)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(FlexRow)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/span",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/Symbol(react.memo)()",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
@@ -1966,17 +1966,17 @@ Array [
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/Symbol(react.memo)(NumberInput)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
-  "/Symbol(react.forward_ref)(Styled(div))/div//Symbol(react.memo)()",
-  "/Symbol(react.forward_ref)(Styled(div))/div//div",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//Symbol(react.memo)()",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//div",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(BooleanControl)",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(FlexRow)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(BooleanControl)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(FlexRow)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/span",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/Symbol(react.memo)()",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
@@ -2489,17 +2489,17 @@ Array [
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/Symbol(react.memo)(NumberInput)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
-  "/Symbol(react.forward_ref)(Styled(div))/div//Symbol(react.memo)()",
-  "/Symbol(react.forward_ref)(Styled(div))/div//div",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//Symbol(react.memo)()",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//div",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(BooleanControl)",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(FlexRow)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(BooleanControl)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(FlexRow)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/span",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/Symbol(react.memo)()",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
@@ -2890,17 +2890,17 @@ Array [
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/Symbol(react.memo)(NumberInput)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/FrameUpdatingLayoutControl/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
-  "/Symbol(react.forward_ref)(Styled(div))/div//Symbol(react.memo)()",
-  "/Symbol(react.forward_ref)(Styled(div))/div//div",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//Symbol(react.memo)()",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//div",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
   "/div/div//Symbol(react.memo)()",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(BooleanControl)",
-  "/Symbol(react.forward_ref)(Styled(div))/div//UtopiaSpiedFunctionComponent(FlexRow)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(BooleanControl)",
+  "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div//UtopiaSpiedFunctionComponent(FlexRow)",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/span",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/Symbol(react.memo)()",
   "/Symbol(react.forward_ref)(EmotionCssPropInternal)/div/OpacityRow/UtopiaSpiedFunctionComponent(InspectorContextMenuWrapper)",
diff --git a/editor/src/uuiui/inputs/base-input.tsx b/editor/src/uuiui/inputs/base-input.tsx
index f7af8140e568..c25d576a0d02 100644
--- a/editor/src/uuiui/inputs/base-input.tsx
+++ b/editor/src/uuiui/inputs/base-input.tsx
@@ -137,7 +137,7 @@ export const InspectorInputEmotionStyle = ({
   paddingTop: 2,
   paddingBottom: 2,
   paddingRight: 6,
-  paddingLeft: hasLabel ? 22 : 6,
+  paddingLeft: hasLabel ? 26 : 6,
   background: 'transparent',
   fontStyle: controlStyles.fontStyle,
   fontWeight: controlStyles.fontWeight,
diff --git a/editor/src/uuiui/inputs/number-or-keyword-control.tsx b/editor/src/uuiui/inputs/number-or-keyword-control.tsx
index 992a63da3438..0d1f3c95a93f 100644
--- a/editor/src/uuiui/inputs/number-or-keyword-control.tsx
+++ b/editor/src/uuiui/inputs/number-or-keyword-control.tsx
@@ -1,6 +1,6 @@
 import type { CSSProperties } from 'react'
 import React from 'react'
-import { Icons } from '../icons'
+import { Icons, SmallerIcons } from '../icons'
 import {
   DropdownMenu,
   regularDropdownMenuItem,
@@ -53,11 +53,12 @@ export function NumberOrKeywordControl<T extends string>(props: NumberOrKeywordC
 
   const dropdownButton = React.useCallback(
     () => (
-      <Icons.ExpansionArrowDown
+      <SmallerIcons.ExpansionArrowDown
         testId={dropdownButtonId}
         style={{
           visibility: hover || dropdownOpen ? 'visible' : 'hidden',
           cursor: 'pointer',
+          marginRight: 5,
         }}
       />
     ),
diff --git a/editor/src/uuiui/widgets/popup-list/popup-list.tsx b/editor/src/uuiui/widgets/popup-list/popup-list.tsx
index d9fa7d749394..251bbdef0ad1 100644
--- a/editor/src/uuiui/widgets/popup-list/popup-list.tsx
+++ b/editor/src/uuiui/widgets/popup-list/popup-list.tsx
@@ -472,7 +472,7 @@ const SingleValue = (props: SingleValueProps<SelectOption>) => {
       )}
       <span
         data-testid={props.selectProps.id == null ? undefined : `${props.selectProps.id}-popuplist`}
-        style={{ paddingLeft: iconShown ? 22 : 4 }}
+        style={{ paddingLeft: iconShown ? 26 : 4 }}
       >
         {props.children}
       </span>