diff --git a/jsapp/js/components/processing/analysis/responseForms/selectOneResponseForm.component.tsx b/jsapp/js/components/processing/analysis/responseForms/selectOneResponseForm.component.tsx
index 369d57c5cd..a00d0fa0d5 100644
--- a/jsapp/js/components/processing/analysis/responseForms/selectOneResponseForm.component.tsx
+++ b/jsapp/js/components/processing/analysis/responseForms/selectOneResponseForm.component.tsx
@@ -1,5 +1,5 @@
+import { Radio, Stack } from '@mantine/core'
 import React, { useContext, useState } from 'react'
-import Radio from '#/components/common/radio'
 import type { RadioOption } from '#/components/common/radio'
 import AnalysisQuestionsContext from '#/components/processing/analysis/analysisQuestions.context'
 import {
@@ -71,15 +71,19 @@ export default function SelectOneResponseForm(props: SelectOneResponseFormProps)
   }
 
   return (
-    <ResponseWrapper uuid={props.uuid} onClear={() => onRadioChange('')}>
-      <Radio
-        options={getOptions()}
-        name={question.labels._default}
-        onChange={onRadioChange}
-        selected={response}
-        isClearable
-        isDisabled={!props.canEdit}
-      />
+    <ResponseWrapper uuid={props.uuid} onClear={() => setResponse('')}>
+      <Radio.Group>
+        <Stack gap={'xs'}>
+          {getOptions().map((option) => (
+            <Radio
+              value={option.value}
+              label={option.label}
+              onChange={(newResponse) => onRadioChange(newResponse.currentTarget.value)}
+              checked={response === option.value}
+            />
+          ))}
+        </Stack>
+      </Radio.Group>
     </ResponseWrapper>
   )
 }
diff --git a/jsapp/js/theme/kobo/Radio.module.css b/jsapp/js/theme/kobo/Radio.module.css
new file mode 100644
index 0000000000..a3ef63dea4
--- /dev/null
+++ b/jsapp/js/theme/kobo/Radio.module.css
@@ -0,0 +1,9 @@
+.label {
+  padding-left: 6px;
+  font-size: var(--mantine-font-size-md);
+  color: var(--mantine-color-gray-1);
+}
+
+.radio {
+  cursor: pointer;
+}
diff --git a/jsapp/js/theme/kobo/Radio.ts b/jsapp/js/theme/kobo/Radio.ts
new file mode 100644
index 0000000000..bee37936cd
--- /dev/null
+++ b/jsapp/js/theme/kobo/Radio.ts
@@ -0,0 +1,6 @@
+import { Radio } from '@mantine/core'
+import classes from './Radio.module.css'
+
+export const RadioThemeKobo = Radio.extend({
+  classNames: classes,
+})
diff --git a/jsapp/js/theme/kobo/index.ts b/jsapp/js/theme/kobo/index.ts
index d49fa31228..11f44870f4 100644
--- a/jsapp/js/theme/kobo/index.ts
+++ b/jsapp/js/theme/kobo/index.ts
@@ -13,6 +13,7 @@ import { TableThemeKobo } from './Table'
 import { TagsInputThemeKobo } from './TagsInput'
 import { ThemeIconThemeKobo } from './ThemeIcon'
 import { TooltipThemeKobo } from './Tooltip'
+import {RadioThemeKobo} from './Radio'
 
 export const themeKobo = createTheme({
   primaryColor: 'blue',
@@ -123,5 +124,6 @@ export const themeKobo = createTheme({
     TagsInput: TagsInputThemeKobo,
     ThemeIcon: ThemeIconThemeKobo,
     NumberInput: NumberInputThemeKobo,
+    Radio: RadioThemeKobo,
   },
 })