diff --git a/polaris-react/src/components/OptionList/OptionList.stories.tsx b/polaris-react/src/components/OptionList/OptionList.stories.tsx
index 7e1dfc390d5..82df5c57098 100644
--- a/polaris-react/src/components/OptionList/OptionList.stories.tsx
+++ b/polaris-react/src/components/OptionList/OptionList.stories.tsx
@@ -21,11 +21,13 @@ export default {
 export function Default() {
   const [selected, setSelected] = useState([]);
 
+  const handleChange = useCallback((value) => setSelected(value), []);
+
   return (
     <LegacyCard>
       <OptionList
         title="Inventory Location"
-        onChange={setSelected}
+        onChange={handleChange}
         options={[
           {value: 'byward_market', label: 'Byward Market'},
           {value: 'centretown', label: 'Centretown'},
@@ -42,11 +44,13 @@ export function Default() {
 export function Multiple() {
   const [selected, setSelected] = useState([]);
 
+  const handleChange = useCallback((value) => setSelected(value), []);
+
   return (
     <LegacyCard>
       <OptionList
         title="Manage sales channels availability"
-        onChange={setSelected}
+        onChange={handleChange}
         options={[
           {value: 'online_store', label: 'Online Store'},
           {value: 'messenger', label: 'Messenger'},
@@ -64,10 +68,12 @@ export function Multiple() {
 export function WithSections() {
   const [selected, setSelected] = useState([]);
 
+  const handleChange = useCallback((value) => setSelected(value), []);
+
   return (
     <LegacyCard>
       <OptionList
-        onChange={setSelected}
+        onChange={handleChange}
         sections={[
           {
             options: [
@@ -105,6 +111,8 @@ export function InAPopover() {
   const [selected, setSelected] = useState([]);
   const [popoverActive, setPopoverActive] = useState(true);
 
+  const handleChange = useCallback((value) => setSelected(value), []);
+
   const togglePopoverActive = useCallback(
     () => setPopoverActive((popoverActive) => !popoverActive),
     [],
@@ -125,18 +133,16 @@ export function InAPopover() {
       >
         <OptionList
           title="Inventory Location"
-          onChange={setSelected}
+          onChange={handleChange}
           options={[
             {
               value: 'byward_market',
               label: 'Byward Market',
-              active: true,
             },
             {value: 'centretown', label: 'Centretown'},
             {
               value: 'hintonburg',
               label: 'Hintonburg',
-              active: true,
             },
             {value: 'westboro', label: 'Westboro'},
             {value: 'downtown', label: 'Downtown'},
@@ -151,11 +157,13 @@ export function InAPopover() {
 export function WithDisabledOption() {
   const [selected, setSelected] = useState([]);
 
+  const handleChange = useCallback((value) => setSelected(value), []);
+
   return (
     <LegacyCard>
       <OptionList
         title="Inventory Location"
-        onChange={setSelected}
+        onChange={handleChange}
         options={[
           {value: 'byward_market', label: 'Byward Market'},
           {value: 'centretown', disabled: true, label: 'Centretown'},
diff --git a/polaris-react/src/components/OptionList/OptionList.tsx b/polaris-react/src/components/OptionList/OptionList.tsx
index e91a899d892..8b2a7fec58a 100644
--- a/polaris-react/src/components/OptionList/OptionList.tsx
+++ b/polaris-react/src/components/OptionList/OptionList.tsx
@@ -128,14 +128,21 @@ export function OptionList({
     ? normalizedOptions.map(({title, options}, sectionIndex) => {
         const isFirstOption = sectionIndex === 0;
         const sectionPaddingBlockStart = polarisSummerEditions2023 ? '3' : '4';
+        const firstOptionBlockStartPadding = polarisSummerEditions2023
+          ? '05'
+          : '2';
         const titleLevel = isFirstOption ? 'h2' : 'h3';
         const titleMarkup = title ? (
           <Box
-            paddingBlockStart={isFirstOption ? '2' : sectionPaddingBlockStart}
+            paddingBlockStart={
+              isFirstOption
+                ? firstOptionBlockStartPadding
+                : sectionPaddingBlockStart
+            }
             paddingInlineStart={
               polarisSummerEditions2023 ? '1_5-experimental' : '2'
             }
-            paddingBlockEnd="2"
+            paddingBlockEnd={polarisSummerEditions2023 ? '1' : '2'}
             paddingInlineEnd={
               polarisSummerEditions2023 ? '1_5-experimental' : '2'
             }
@@ -193,14 +200,29 @@ export function OptionList({
           </Bleed>
         );
 
+        // eslint-disable-next-line no-nested-ternary
+        const blockStartPadding = isFirstOption
+          ? // eslint-disable-next-line no-nested-ternary
+            polarisSummerEditions2023
+            ? title
+              ? '1'
+              : '0'
+            : undefined
+          : // eslint-disable-next-line no-nested-ternary
+          polarisSummerEditions2023
+          ? title
+            ? '05'
+            : '0'
+          : '2';
+
         return (
           <Box
             key={title || `noTitle-${sectionIndex}`}
             as="li"
-            paddingBlockStart={isFirstOption ? undefined : '2'}
+            paddingBlockStart={blockStartPadding}
           >
             {polarisSummerEditions2023 ? (
-              <VerticalStack gap={isFirstOption && sections ? undefined : '1'}>
+              <VerticalStack gap={isFirstOption && sections ? undefined : '0'}>
                 {titleMarkup}
                 {option}
               </VerticalStack>
diff --git a/polaris-react/src/components/OptionList/components/Option/Option.scss b/polaris-react/src/components/OptionList/components/Option/Option.scss
index ffe724c189e..373a7b2d2c4 100644
--- a/polaris-react/src/components/OptionList/components/Option/Option.scss
+++ b/polaris-react/src/components/OptionList/components/Option/Option.scss
@@ -81,6 +81,12 @@ $control-vertical-adjustment: 2px;
     display: flex;
     flex-wrap: nowrap;
     justify-content: space-between;
+
+    &.select,
+    &.select:hover:not(.disabled),
+    &.active {
+      font-weight: var(--p-font-weight-semibold);
+    }
   }
 }