diff --git a/.changeset/themer-legacy-url-import.md b/.changeset/themer-legacy-url-import.md
new file mode 100644
index 0000000000..2bf35b79d7
--- /dev/null
+++ b/.changeset/themer-legacy-url-import.md
@@ -0,0 +1,7 @@
+---
+'@sanity/themer': minor
+---
+
+author: @stipsan
+
+The themer tool imports themes from themer.sanity.build URLs. Paste a URL anywhere except a text field while the sidebar is open, or choose the new "Add from URL" in the list's menu. The tool converts the theme to `buildTheme` options, adds it to your themes and opens it in the editor.
diff --git a/plugins/@sanity/themer/README.md b/plugins/@sanity/themer/README.md
index 9da2f20ac5..7d40221c46 100644
--- a/plugins/@sanity/themer/README.md
+++ b/plugins/@sanity/themer/README.md
@@ -186,6 +186,7 @@ Try the swatch variants to preview different starting colors, or select **I'm fe
 - **Reorder:** drag cards, or move them from their menus. The order is saved between sessions.
 - **Share:** copy a theme's short code from its menu.
 - **Import:** paste a code into the list, or use the paste button—even in another Studio.
+- **Convert a hosted theme:** paste a themer.sanity.build URL. See [Migrating from themer.sanity.build](#migrating-from-themersanitybuild).
 - **Remove or restore:** themes can be removed and brought back.
 
 <details>
@@ -219,6 +220,13 @@ With `prefers-reduced-motion`, both the sidebar and split preview change layouts
    +const theme = buildThemeFromUrl('https://themer.sanity.build/api/hues?preset=verdant&primary=22fca8')
    ```
 
+**Want a modern `buildTheme` theme instead?** Convert it in the [Studio tool](#studio-tool):
+
+1. Open **Themer** and paste the hosted URL, or the whole import line, anywhere except a text field. You can also choose **Add from URL** in the list's menu. The tool adds the converted theme and opens it in the editor.
+2. Back in the list, choose **Show theme code** and use the snippet in place of the URL import.
+
+The converted colors come close to the hosted ones, but they don't match exactly.
+
 **Already importing from `@sanity/themer/legacy`?** Switch to `@sanity/themer-legacy`. The old import is deprecated and will be removed in `@sanity/themer@1.0`.
 
 ## License
diff --git a/plugins/@sanity/themer/src/theme/options.ts b/plugins/@sanity/themer/src/theme/options.ts
index ee74ebfe32..eccb7cd893 100644
--- a/plugins/@sanity/themer/src/theme/options.ts
+++ b/plugins/@sanity/themer/src/theme/options.ts
@@ -177,7 +177,13 @@ export function deriveTextColor(accent: string): string {
   })
 }
 
-function normalizeColor(value: string, name: string): string {
+/**
+ * Validates a hex color and normalizes it to lowercase `#rrggbb`, naming the
+ * option it came from when it is invalid.
+ *
+ * @internal
+ */
+export function normalizeColor(value: string, name: string): string {
   if (typeof value !== 'string' || !isColor(value)) {
     throw new TypeError(
       `Invalid \`${name}\` color: ${JSON.stringify(value)} — expected a hex color like #556bfc`,
diff --git a/plugins/@sanity/themer/src/tool/ImportThemeDialog.module.css b/plugins/@sanity/themer/src/tool/ImportThemeDialog.module.css
new file mode 100644
index 0000000000..52af2e5390
--- /dev/null
+++ b/plugins/@sanity/themer/src/tool/ImportThemeDialog.module.css
@@ -0,0 +1,5 @@
+/* The converted theme's thumbnail, about as big as a theme card in the sidebar */
+.preview {
+  width: 160px;
+  max-width: 100%;
+}
diff --git a/plugins/@sanity/themer/src/tool/ImportThemeDialog.tsx b/plugins/@sanity/themer/src/tool/ImportThemeDialog.tsx
new file mode 100644
index 0000000000..c6351a8951
--- /dev/null
+++ b/plugins/@sanity/themer/src/tool/ImportThemeDialog.tsx
@@ -0,0 +1,134 @@
+import {Box, Button, Card, Dialog, Flex, Stack, Text, TextArea} from '@sanity/ui'
+import {useEffect, useMemo, useRef, useState} from 'react'
+
+import type {BuildThemeOptions} from '../theme/options'
+import {convertLegacyTheme, type LegacyThemeConversion} from './legacyTheme'
+import {ThemeThumbnail} from './ThemeThumbnail'
+
+import * as styles from './ImportThemeDialog.module.css'
+
+/**
+ * A place to paste the themer.sanity.build URL that a Studio config imports
+ * its theme from — or the whole import line — for touch screens and anyone
+ * who would not think of pasting into the sidebar. It previews the converted
+ * theme before importing it as one of the user's own themes.
+ *
+ * @internal
+ */
+export function ImportThemeDialog(props: {
+  onClose: () => void
+  onImport: (theme: {title: string; options: BuildThemeOptions}) => void
+}) {
+  const {onClose, onImport} = props
+  const [text, setText] = useState('')
+  const textAreaRef = useRef<HTMLTextAreaElement | null>(null)
+  const conversion = useMemo(() => convertLegacyTheme(text), [text])
+
+  // The menu the dialog opens from focuses its item again while it animates
+  // closed, after the field's `autoFocus`
+  useEffect(() => {
+    const frame = requestAnimationFrame(() => textAreaRef.current?.focus())
+
+    return () => cancelAnimationFrame(frame)
+  }, [])
+
+  return (
+    <Dialog
+      // The field takes the focus instead of the close button, ready for a paste
+      __unstable_autoFocus={false}
+      animate
+      footer={
+        <Flex justify="flex-end" padding={3}>
+          <Button
+            disabled={conversion.status !== 'converted'}
+            onClick={() => {
+              if (conversion.status === 'converted') onImport(conversion)
+            }}
+            text="Import"
+            tone="primary"
+          />
+        </Flex>
+      }
+      header="Import from themer.sanity.build"
+      id="themer-import"
+      onClickOutside={onClose}
+      onClose={onClose}
+      onPaste={(event) => {
+        // A paste anywhere in the dialog lands in the field, rather than
+        // importing right away the way it does elsewhere in the themer
+        if (event.target === textAreaRef.current) return
+
+        event.preventDefault()
+        setText(event.clipboardData.getData('text/plain'))
+        textAreaRef.current?.focus()
+      }}
+      width={1}
+    >
+      <Box padding={4}>
+        <Stack gap={4}>
+          <Text muted size={1}>
+            Paste the themer.sanity.build URL that your Studio config imports its theme from — the
+            whole import line works too.
+          </Text>
+          <TextArea
+            autoFocus
+            fontSize={1}
+            onChange={(event) => setText(event.currentTarget.value)}
+            placeholder="import {theme} from 'https://themer.sanity.build/api/hues?…'"
+            ref={textAreaRef}
+            rows={3}
+            spellCheck={false}
+            value={text}
+          />
+          {text.trim() !== '' && <ConversionPreview conversion={conversion} />}
+        </Stack>
+      </Box>
+    </Dialog>
+  )
+}
+
+function ConversionPreview(props: {conversion: LegacyThemeConversion}) {
+  const {conversion} = props
+
+  switch (conversion.status) {
+    case 'missing':
+      return (
+        <Text muted size={1}>
+          There is no themer.sanity.build URL in there yet — look for the one with{' '}
+          <code>/api/hues</code> in it.
+        </Text>
+      )
+    case 'invalid':
+      return (
+        <Card padding={3} radius={2} tone="critical">
+          <Text size={1}>{conversion.message}</Text>
+        </Card>
+      )
+    case 'converted':
+      return (
+        <Flex
+          align={['flex-start', 'flex-start', 'center']}
+          direction={['column', 'column', 'row']}
+          gap={3}
+        >
+          <Box className={styles.preview} flex="none">
+            <ThemeThumbnail options={conversion.options} />
+          </Box>
+          <Stack flex={1} gap={2}>
+            <Text size={1} textOverflow="ellipsis" weight="medium">
+              {conversion.title}
+            </Text>
+            <Text muted size={1}>
+              Its primary and default hues become the accent and text colors, and its lightest and
+              darkest colors the backgrounds — the other hues keep the Studio defaults.
+            </Text>
+          </Stack>
+        </Flex>
+      )
+    default: {
+      const exhaustive: never = conversion
+
+      return exhaustive
+    }
+  }
+}
diff --git a/plugins/@sanity/themer/src/tool/ThemeList.tsx b/plugins/@sanity/themer/src/tool/ThemeList.tsx
index 77331c10a0..89485efe14 100644
--- a/plugins/@sanity/themer/src/tool/ThemeList.tsx
+++ b/plugins/@sanity/themer/src/tool/ThemeList.tsx
@@ -5,6 +5,7 @@ import {CopyIcon} from '@sanity/icons/Copy'
 import {EditIcon} from '@sanity/icons/Edit'
 import {EllipsisHorizontalIcon} from '@sanity/icons/EllipsisHorizontal'
 import {ImageIcon} from '@sanity/icons/Image'
+import {LinkIcon} from '@sanity/icons/Link'
 import {RestoreIcon} from '@sanity/icons/Restore'
 import {Button, Card, Flex, Stack} from '@sanity/ui'
 import {Menu, MenuButton, MenuDivider, MenuItem} from '@sanity/ui/menu'
@@ -16,6 +17,7 @@ import type {ThemerProps} from '#types'
 
 import {ImageFileInput} from './ImageFileButton'
 import {optionsFromImagePalette, titleFromFileName} from './imagePalette'
+import {ImportThemeDialog} from './ImportThemeDialog'
 import type {ThemerSnapshot} from './machine'
 import {PasteThemeDialog} from './PasteThemeDialog'
 import {ScrollArea} from './ScrollArea'
@@ -174,6 +176,11 @@ export function ThemeList({
                   }}
                   text="Add from code"
                 />
+                <MenuItem
+                  icon={LinkIcon}
+                  onClick={() => actorRef.send({type: 'dialog.import'})}
+                  text="Add from URL"
+                />
                 {active && (
                   <>
                     <MenuDivider />
@@ -199,6 +206,13 @@ export function ThemeList({
           onClose={() => actorRef.send({type: 'dialog.close'})}
         />
       )}
+      {dialog === 'import' && (
+        <ImportThemeDialog
+          onClose={() => actorRef.send({type: 'dialog.close'})}
+          // Adding the theme opens the editor, which leaves the list and closes the dialog
+          onImport={({title, options}) => actorRef.send({type: 'theme.add', title, options})}
+        />
+      )}
       {dialog === 'snippet' && active && (
         <ThemeSnippetDialog onClose={() => actorRef.send({type: 'dialog.close'})} theme={active} />
       )}
@@ -207,8 +221,9 @@ export function ThemeList({
 }
 
 /** The dialog the list has open, if any — a state of the machine's list flow */
-function selectDialog(snapshot: ThemerSnapshot): 'paste' | 'snippet' | null {
+function selectDialog(snapshot: ThemerSnapshot): 'paste' | 'import' | 'snippet' | null {
   if (snapshot.matches({flow: {list: 'pasting'}})) return 'paste'
+  if (snapshot.matches({flow: {list: 'importing'}})) return 'import'
   if (snapshot.matches({flow: {list: 'snippet'}})) return 'snippet'
 
   return null
diff --git a/plugins/@sanity/themer/src/tool/ThemerSidebar.tsx b/plugins/@sanity/themer/src/tool/ThemerSidebar.tsx
index 7861435c7f..545995a39a 100644
--- a/plugins/@sanity/themer/src/tool/ThemerSidebar.tsx
+++ b/plugins/@sanity/themer/src/tool/ThemerSidebar.tsx
@@ -16,6 +16,7 @@ import {ThemeList} from './ThemeList'
 import {resolveThemes} from './themes'
 import {TooltipButton} from './TooltipButton'
 import {useIsTooSmallForSplitScreen} from './useIsTooSmallForSplitScreen'
+import {useLegacyThemePaste} from './useLegacyThemePaste'
 
 import * as styles from './ThemerSidebar.module.css'
 
@@ -32,6 +33,9 @@ const VIEW_TITLES = {
  * Studio's document footer: one primary action, with the rest of its actions
  * behind a menu button, and the way back to the list where the flow is not
  * the list.
+ * While it shows, pasting a themer.sanity.build URL imports its theme: a
+ * closed sidebar is hidden rather than unmounted, which tears down the paste
+ * listener along with its other effects.
  *
  * @internal
  */
@@ -50,6 +54,8 @@ export function ThemerSidebar({
     dequal,
   )
 
+  useLegacyThemePaste({actorRef})
+
   return (
     <Card height="fill">
       <Flex direction="column" height="fill">
diff --git a/plugins/@sanity/themer/src/tool/legacyTheme.test.ts b/plugins/@sanity/themer/src/tool/legacyTheme.test.ts
new file mode 100644
index 0000000000..7934163021
--- /dev/null
+++ b/plugins/@sanity/themer/src/tool/legacyTheme.test.ts
@@ -0,0 +1,183 @@
+import {presets as hostedPresets} from '@sanity/themer-legacy'
+import {describe, expect, it} from 'vitest'
+
+import {buildTheme} from '../theme/buildTheme'
+import {presets} from '../theme/presets'
+import {convertLegacyTheme} from './legacyTheme'
+
+const HOSTED = 'https://themer.sanity.build/api/hues'
+
+/** The options a text converts to, failing the test when it does not convert */
+function optionsOf(text: string) {
+  const conversion = convertLegacyTheme(text)
+
+  if (conversion.status !== 'converted') {
+    throw new Error(
+      `Expected ${JSON.stringify(text)} to convert, got ${JSON.stringify(conversion)}`,
+    )
+  }
+
+  return conversion.options
+}
+
+const verdant = presets.find((preset) => preset.slug === 'verdant')!
+
+describe('convertLegacyTheme', () => {
+  it('converts every hosted preset into the preset of the same name', () => {
+    // The hosted default preset was the stock Studio theme of its day
+    const counterparts: Record<string, string> = {default: 'studio'}
+
+    for (const hosted of hostedPresets) {
+      const preset = presets.find(
+        (candidate) => candidate.slug === (counterparts[hosted.slug] ?? hosted.slug),
+      )
+
+      // Tailwind Cyan was not carried over into the presets
+      if (!preset) continue
+
+      expect(convertLegacyTheme(`${HOSTED}?preset=${hosted.slug}`), hosted.slug).toEqual({
+        status: 'converted',
+        title: hosted.title,
+        options: preset.options,
+      })
+    }
+  })
+
+  it('converts the presets that were not carried over', () => {
+    expect(convertLegacyTheme(`${HOSTED}?preset=tw-cyan`)).toEqual({
+      status: 'converted',
+      title: 'Tailwind Cyan',
+      options: {
+        light: {accent: '#51b4d0', text: '#677389', background: '#f9fafb'},
+        dark: {accent: '#51b4d0', text: '#677389', background: '#101728'},
+      },
+    })
+  })
+
+  it('finds the URL in the import lines of a Studio config', () => {
+    for (const snippet of [
+      `import {theme} from '${HOSTED}?preset=verdant'`,
+      `import {theme} from "${HOSTED}?preset=verdant";`,
+      `theme: (await import('${HOSTED}?preset=verdant')).theme,`,
+      `const theme = buildThemeFromUrl(\n  '${HOSTED}?preset=verdant',\n)`,
+      `See [the theme](${HOSTED}?preset=verdant).`,
+      `Our theme lives at ${HOSTED}?preset=verdant.`,
+      `themer.sanity.build/api/hues?preset=verdant`,
+      `http://localhost:3000/api/hues/?preset=verdant`,
+    ]) {
+      expect(optionsOf(snippet), snippet).toEqual(verdant.options)
+    }
+  })
+
+  it('reads colors written with a #, which a URL would take for its fragment', () => {
+    expect(optionsOf(`import {theme} from '${HOSTED}?preset=verdant&lightest=#fff'`)).toEqual({
+      // The hosted default lightest is the stock light background
+      light: {accent: '#1cb485', text: '#5c9199'},
+      dark: {accent: '#1cb485', text: '#5c9199', background: '#0d1415'},
+    })
+    expect(optionsOf(`${HOSTED}?primary=#22FCA8;400;lightest:%23fcfdfd&darkest=#000`)).toEqual(
+      optionsOf(`${HOSTED}?primary=22fca8;400;lightest:fcfdfd&darkest=000`),
+    )
+    expect(optionsOf(`${HOSTED}?preset=verdant#top`)).toEqual(verdant.options)
+  })
+
+  it('carries the primary and default hues over, and applies overrides on top of presets', () => {
+    expect(
+      optionsOf(`${HOSTED}?default=5e63b4;600;lightest:fcfcfd;darkest:0d0d15&primary=D1A308;400`),
+    ).toEqual({
+      light: {accent: '#d1a308', text: '#5e63b4', background: '#fcfcfd'},
+      dark: {accent: '#d1a308', text: '#5e63b4', background: '#0d0d15'},
+    })
+    expect(convertLegacyTheme(`${HOSTED}?preset=pink-synth&primary=b595f9;400`)).toEqual({
+      status: 'converted',
+      title: 'Pink Synth',
+      options: {
+        light: {accent: '#b595f9', text: '#8b6584', background: '#f7f2f5'},
+        dark: {accent: '#b595f9', text: '#8b6584', background: '#171721'},
+      },
+    })
+    // The global lightest and darkest reach the backgrounds through the default hue
+    expect(optionsOf(`${HOSTED}?lightest=f7f2f5&darkest=171721`)).toEqual({
+      light: {background: '#f7f2f5'},
+      dark: {background: '#171721'},
+    })
+    expect(optionsOf(`${HOSTED}?primary=f00`)).toEqual({
+      light: {accent: '#ff0000'},
+      dark: {accent: '#ff0000'},
+    })
+  })
+
+  it('leaves what the hosted service defaulted to at the current defaults', () => {
+    expect(optionsOf(HOSTED)).toEqual({})
+    expect(optionsOf(`${HOSTED}?preset=default`)).toEqual({})
+    expect(optionsOf(`${HOSTED}?lightest=fff&darkest=101112&default=8690a0;500`)).toEqual({})
+    // The text color follows the accent, like the stock gray follows the stock blue
+    expect(optionsOf(`${HOSTED}?primary=22fca8`)).toEqual({
+      light: {accent: '#22fca8'},
+      dark: {accent: '#22fca8'},
+    })
+    expect(optionsOf(`${HOSTED}?preset=verdant&primary=2276fc`)).toEqual({
+      light: {text: '#5c9199', background: '#fcfdfd'},
+      dark: {text: '#5c9199', background: '#0d1415'},
+    })
+  })
+
+  it('titles the theme after its preset', () => {
+    expect(convertLegacyTheme(`${HOSTED}?preset=VERDANT`)).toMatchObject({title: 'Verdant'})
+    expect(convertLegacyTheme(`${HOSTED}?preset=default`)).toMatchObject({title: 'Studio v3'})
+    expect(convertLegacyTheme(`${HOSTED}?primary=22fca8`)).toMatchObject({title: 'Imported theme'})
+    // The hosted service fell back to its default preset for unknown ones
+    expect(convertLegacyTheme(`${HOSTED}?preset=nope&primary=22fca8`)).toEqual(
+      convertLegacyTheme(`${HOSTED}?primary=22fca8`),
+    )
+  })
+
+  it('takes the first theme URL, skipping the wildcard module of themer.d.ts', () => {
+    const declaration = `declare module '${HOSTED}?*' {\n  export const theme: import('sanity').StudioTheme\n}`
+
+    expect(convertLegacyTheme(declaration)).toEqual({status: 'missing'})
+    expect(
+      optionsOf(
+        `${declaration}\nimport {theme} from '${HOSTED}?preset=verdant'\n'${HOSTED}?preset=dew'`,
+      ),
+    ).toEqual(verdant.options)
+  })
+
+  it('finds nothing in text without a hosted Themer URL', () => {
+    for (const text of [
+      '',
+      'https://themer.sanity.build',
+      '?preset=verdant',
+      'api/hues',
+      'hello',
+    ]) {
+      expect(convertLegacyTheme(text), text).toEqual({status: 'missing'})
+    }
+  })
+
+  it('rejects the URLs the hosted service rejected, with its error', () => {
+    expect(convertLegacyTheme(`${HOSTED}?primary=nothex`)).toEqual({
+      status: 'invalid',
+      message: 'Invalid param for the primary hue: nothex',
+    })
+    expect(convertLegacyTheme(`${HOSTED}?lightest=nothex`)).toEqual({
+      status: 'invalid',
+      message: 'Invalid color: #nothex',
+    })
+    expect(convertLegacyTheme(`${HOSTED}?primary=2276fc;2276fc`)).toMatchObject({
+      status: 'invalid',
+      message: expect.stringContaining('Duplicate params'),
+    })
+    // A template literal interpolation is not a color
+    expect(convertLegacyTheme(`\`${HOSTED}?primary=\${brand}\``)).toMatchObject({status: 'invalid'})
+  })
+
+  it('converts into options that build a theme', () => {
+    for (const hosted of hostedPresets) {
+      expect(
+        () => buildTheme(optionsOf(`${HOSTED}?${hosted.searchParams}`)),
+        hosted.slug,
+      ).not.toThrow()
+    }
+  })
+})
diff --git a/plugins/@sanity/themer/src/tool/legacyTheme.ts b/plugins/@sanity/themer/src/tool/legacyTheme.ts
new file mode 100644
index 0000000000..d1d9b0b2af
--- /dev/null
+++ b/plugins/@sanity/themer/src/tool/legacyTheme.ts
@@ -0,0 +1,142 @@
+import {
+  type Hues,
+  hues as hostedDefaults,
+  parseHuesFromUrl,
+  presets as hostedPresets,
+} from '@sanity/themer-legacy'
+import {type ThemeColorSchemeKey} from '@sanity/ui/theme'
+
+import {
+  type BuildThemeOptions,
+  normalizeColor,
+  SCHEMES,
+  type SchemeThemeOptions,
+} from '../theme/options'
+
+/**
+ * A hosted Themer URL: the `/api/hues` path and the query after it, up to the
+ * quote, whitespace or bracket that ends the URL in a snippet like
+ * `import {theme} from 'https://themer.sanity.build/api/hues?preset=verdant'`.
+ * Only the query matters — it is all the hosted service read — so any host
+ * will do.
+ */
+const HUES_URL = /\/api\/hues\/?(\?[^\s'"`<>()\\]*)?/g
+
+/** The title of an imported theme that was not based on a hosted preset */
+const IMPORTED_TITLE = 'Imported theme'
+
+/**
+ * The outcome of looking for a hosted Themer theme in pasted text: there is
+ * no URL in it, the URL is one the hosted service would have rejected (with
+ * its error message), or the theme converted to `buildTheme` options.
+ *
+ * @internal
+ */
+export type LegacyThemeConversion =
+  | {status: 'missing'}
+  | {status: 'invalid'; message: string}
+  | {status: 'converted'; title: string; options: BuildThemeOptions}
+
+/**
+ * Converts the theme of a hosted Themer service (themer.sanity.build) URL
+ * into `buildTheme` options. The text can be the URL itself or any snippet
+ * that holds it — the `import {theme} from 'https://themer.sanity.build/api/hues?…'`
+ * line of a Studio config, say — and the URL is parsed exactly like the
+ * hosted service did, presets and validation included. The theme is titled
+ * after the preset the URL is based on.
+ *
+ * @internal
+ */
+export function convertLegacyTheme(text: string): LegacyThemeConversion {
+  const query = findLegacyQuery(text)
+
+  if (query === null) return {status: 'missing'}
+
+  let hues: Hues
+
+  try {
+    hues = parseHuesFromUrl(query)
+  } catch (error) {
+    return {status: 'invalid', message: error instanceof Error ? error.message : String(error)}
+  }
+
+  const slug = new URLSearchParams(query).get('preset')?.toLowerCase()
+  const preset = hostedPresets.find((candidate) => candidate.slug === slug)
+
+  return {
+    status: 'converted',
+    title: preset?.title ?? IMPORTED_TITLE,
+    options: optionsFromLegacyHues(hues),
+  }
+}
+
+/**
+ * The query of the first hosted Themer URL in the text, cleaned up for the
+ * parser — or `null` when there is none.
+ */
+function findLegacyQuery(text: string): string | null {
+  for (const match of text.matchAll(HUES_URL)) {
+    const query = match[1] ?? ''
+
+    // `themer.d.ts` declares the URL imports as the `?*` wildcard module
+    if (query.includes('*')) continue
+
+    return (
+      query
+        // The service took colors without a `#`, and in a URL it would start the fragment
+        .replace(/([=;:])(?:#|%23)/gi, '$1')
+        .replace(/#.*$/, '')
+        // Punctuation that ends a sentence the URL was pasted in
+        .replace(/[.,;:!?]+$/, '')
+    )
+  }
+
+  return null
+}
+
+/**
+ * Carries the hues of a hosted Themer theme over into `buildTheme` options
+ * the way the presets were: the primary hue becomes the accent, the default
+ * hue the text color, and its lightest and darkest colors the light and dark
+ * backgrounds — both schemes get the accent and text, as the hosted service
+ * had one set of hues for both. Colors the hosted service defaulted to are
+ * left to the current defaults instead of pinning the dated ones, so its
+ * default theme converts to the stock Studio theme. The other hues and the
+ * mid points have no counterpart in `buildTheme`.
+ */
+function optionsFromLegacyHues(hues: Hues): BuildThemeOptions {
+  const shared: SchemeThemeOptions = {}
+  const accent = customColor(hues, 'primary', 'mid')
+  const text = customColor(hues, 'default', 'mid')
+
+  if (accent) shared.accent = accent
+  if (text) shared.text = text
+
+  const backgrounds: Record<ThemeColorSchemeKey, string | undefined> = {
+    light: customColor(hues, 'default', 'lightest'),
+    dark: customColor(hues, 'default', 'darkest'),
+  }
+
+  const options: BuildThemeOptions = {}
+
+  for (const scheme of SCHEMES) {
+    const background = backgrounds[scheme]
+    const values: SchemeThemeOptions = background ? {...shared, background} : {...shared}
+
+    if (Object.keys(values).length > 0) options[scheme] = values
+  }
+
+  return options
+}
+
+/** A color of the hues, or `undefined` when it is the one the hosted service defaulted to */
+function customColor(
+  hues: Hues,
+  hue: 'default' | 'primary',
+  key: 'mid' | 'lightest' | 'darkest',
+): string | undefined {
+  const name = `${hue}.${key}`
+  const color = normalizeColor(hues[hue][key], name)
+
+  return color === normalizeColor(hostedDefaults[hue][key], name) ? undefined : color
+}
diff --git a/plugins/@sanity/themer/src/tool/machine.test.ts b/plugins/@sanity/themer/src/tool/machine.test.ts
index d5f933d13b..cb3180f053 100644
--- a/plugins/@sanity/themer/src/tool/machine.test.ts
+++ b/plugins/@sanity/themer/src/tool/machine.test.ts
@@ -499,6 +499,23 @@ describe('themerMachine', () => {
       expect(actor.getSnapshot().matches({flow: {list: 'idle'}})).toBe(true)
     })
 
+    it('opens and closes the import dialog, which an import leaves for the editor', () => {
+      const actor = start()
+
+      actor.send({type: 'dialog.import'})
+      expect(actor.getSnapshot().matches({flow: {list: 'importing'}})).toBe(true)
+
+      actor.send({type: 'dialog.close'})
+      expect(actor.getSnapshot().matches({flow: {list: 'idle'}})).toBe(true)
+
+      actor.send({type: 'dialog.import'})
+      actor.send({type: 'theme.add', title: 'Verdant', options: {light: {accent: '#1cb485'}}})
+      expect(actor.getSnapshot().matches({flow: 'edit'})).toBe(true)
+
+      actor.send({type: 'flow.list'})
+      expect(actor.getSnapshot().matches({flow: {list: 'idle'}})).toBe(true)
+    })
+
     it('shows the snippet of the applied theme only — the configured theme has none', () => {
       const actor = startWithCustom()
 
diff --git a/plugins/@sanity/themer/src/tool/machine.ts b/plugins/@sanity/themer/src/tool/machine.ts
index 4e4683d7ef..c2d9b42580 100644
--- a/plugins/@sanity/themer/src/tool/machine.ts
+++ b/plugins/@sanity/themer/src/tool/machine.ts
@@ -83,6 +83,8 @@ export type ThemerEvent =
   | {type: 'flow.removed'}
   /** Opens the dialog for adding a shared theme code by hand, from the list */
   | {type: 'dialog.paste'}
+  /** Opens the dialog for importing a themer.sanity.build theme by its URL, from the list */
+  | {type: 'dialog.import'}
   /** Opens the dialog with the applied theme's `buildTheme` snippet, from the list */
   | {type: 'dialog.snippet'}
   /** Closes whichever dialog is open */
@@ -106,7 +108,8 @@ function revokeObjectUrl(url: string) {
 /**
  * The themes of the themer tool and the sidebar's way through them: which
  * `flow` the sidebar is in — picking a theme from the `list`, with its
- * dialogs for pasting a shared code and for the applied theme's snippet,
+ * dialogs for pasting a shared code, for importing a themer.sanity.build URL
+ * and for the applied theme's snippet,
  * `edit`ing one of the user's own themes, or restoring `removed` ones — and,
  * in a parallel `theme` region, whether another theme was just applied. The
  * context carries the persisted state (the applied theme, the user's themes
@@ -485,19 +488,24 @@ export const themerMachine = setup({
       states: {
         list: {
           initial: 'idle',
-          // The list's dialogs — for a shared code pasted by hand, and for the
-          // applied theme's snippet — are states of the list, so that leaving
-          // it, as adding a theme does for the editor, closes them
+          // The list's dialogs — for a shared code pasted by hand, for a
+          // themer.sanity.build URL to import, and for the applied theme's
+          // snippet — are states of the list, so that leaving it, as adding a
+          // theme does for the editor, closes them
           states: {
             idle: {
               on: {
                 'dialog.paste': 'pasting',
+                'dialog.import': 'importing',
                 'dialog.snippet': {guard: 'hasAppliedTheme', target: 'snippet'},
               },
             },
             pasting: {
               on: {'dialog.close': 'idle'},
             },
+            importing: {
+              on: {'dialog.close': 'idle'},
+            },
             snippet: {
               on: {'dialog.close': 'idle'},
               // The applied theme can go away meanwhile — removed from another tab
diff --git a/plugins/@sanity/themer/src/tool/plugin.tsx b/plugins/@sanity/themer/src/tool/plugin.tsx
index 82dcc6f543..dd98177a95 100644
--- a/plugins/@sanity/themer/src/tool/plugin.tsx
+++ b/plugins/@sanity/themer/src/tool/plugin.tsx
@@ -29,10 +29,11 @@ export interface ThemerToolOptions {
  * Studio while you browse around; your own themes can be edited with
  * accent/text/background pickers and a contrast slider per scheme, added,
  * duplicated, given the colors of an image (its palette is read on device),
- * removed and restored, and a dialog shows the `buildTheme` snippet that
- * makes the applied theme permanent. Toggle between light and dark mode with
- * the regular appearance menu — the preview follows it — or split the
- * preview to see the whole Studio in light and dark side by side.
+ * imported from a pasted themer.sanity.build URL, removed and restored, and a
+ * dialog shows the `buildTheme` snippet that makes the applied theme
+ * permanent. Toggle between light and dark mode with the regular appearance
+ * menu — the preview follows it — or split the preview to see the whole
+ * Studio in light and dark side by side.
  *
  * ```ts
  * import {themerTool} from '@sanity/themer/tool'
diff --git a/plugins/@sanity/themer/src/tool/useLegacyThemePaste.ts b/plugins/@sanity/themer/src/tool/useLegacyThemePaste.ts
new file mode 100644
index 0000000000..8dce0623ce
--- /dev/null
+++ b/plugins/@sanity/themer/src/tool/useLegacyThemePaste.ts
@@ -0,0 +1,56 @@
+import {useToast} from '@sanity/ui/toast'
+import {useEffect} from 'react'
+
+import type {ThemerProps} from '#types'
+
+import {convertLegacyTheme} from './legacyTheme'
+import {isEditable} from './useThemeCodes'
+
+/**
+ * Imports the hosted Themer themes pasted while the sidebar shows: pasting a
+ * themer.sanity.build URL — or a snippet with one in it, like the import line
+ * of a Studio config — anywhere but into a text field adds its theme,
+ * converted to `buildTheme` options, and opens it in the editor. Pastes
+ * without such a URL are left alone.
+ *
+ * @internal
+ */
+export function useLegacyThemePaste({actorRef}: Pick<ThemerProps, 'actorRef'>): void {
+  const toast = useToast()
+
+  useEffect(() => {
+    const handlePaste = (event: ClipboardEvent) => {
+      if (event.defaultPrevented || isEditable(event.target)) return
+
+      const conversion = convertLegacyTheme(event.clipboardData?.getData('text/plain') ?? '')
+
+      switch (conversion.status) {
+        case 'missing':
+          return
+        case 'invalid':
+          event.preventDefault()
+          toast.push({
+            status: 'error',
+            title: 'Could not import that themer.sanity.build URL',
+            description: conversion.message,
+          })
+          return
+        case 'converted':
+          event.preventDefault()
+          actorRef.send({type: 'theme.add', title: conversion.title, options: conversion.options})
+          toast.push({
+            status: 'success',
+            title: `Imported “${conversion.title}”`,
+            description: "Show its code from the list's menu to use it in your config",
+          })
+          return
+        default:
+          conversion satisfies never
+      }
+    }
+
+    document.addEventListener('paste', handlePaste)
+
+    return () => document.removeEventListener('paste', handlePaste)
+  }, [actorRef, toast])
+}
diff --git a/plugins/@sanity/themer/src/tool/useThemeCodes.ts b/plugins/@sanity/themer/src/tool/useThemeCodes.ts
index 1f7a270b86..f2af00ff14 100644
--- a/plugins/@sanity/themer/src/tool/useThemeCodes.ts
+++ b/plugins/@sanity/themer/src/tool/useThemeCodes.ts
@@ -64,7 +64,8 @@ export function useThemeCodes({actorRef}: Pick<ThemerProps, 'actorRef'>): {
 
 /**
  * Adds a theme pasted anywhere in the Studio while the themer's list is
- * showing — pastes into inputs and other editable things are theirs.
+ * showing — pastes into inputs and other editable things are theirs, and so
+ * are pastes that something else, like the import dialog, already took.
  *
  * @internal
  */
@@ -73,7 +74,7 @@ export function usePasteThemeCodes({actorRef}: Pick<ThemerProps, 'actorRef'>): v
 
   useEffect(() => {
     const handlePaste = (event: ClipboardEvent) => {
-      if (isEditable(event.target)) return
+      if (event.defaultPrevented || isEditable(event.target)) return
 
       const theme = decodeTheme(event.clipboardData?.getData('text/plain') ?? '')
 
@@ -90,7 +91,12 @@ export function usePasteThemeCodes({actorRef}: Pick<ThemerProps, 'actorRef'>): v
   }, [actorRef, toast])
 }
 
-function isEditable(target: EventTarget | null): boolean {
+/**
+ * Whether a paste lands in a field that takes it as text
+ *
+ * @internal
+ */
+export function isEditable(target: EventTarget | null): boolean {
   return (
     target instanceof HTMLElement &&
     (target.isContentEditable || target.matches('input, textarea, select'))