diff --git a/packages/client/src/api/hermes/profiles.ts b/packages/client/src/api/hermes/profiles.ts
new file mode 100644
index 0000000..2073966
--- /dev/null
+++ b/packages/client/src/api/hermes/profiles.ts
@@ -0,0 +1,113 @@
+import { request, getBaseUrlValue, getApiKey } from '../client'
+
+export interface HermesProfile {
+  name: string
+  active: boolean
+  model: string
+  gateway: string
+  alias: string
+}
+
+export interface HermesProfileDetail {
+  name: string
+  path: string
+  model: string
+  provider: string
+  gateway: string
+  skills: number
+  hasEnv: boolean
+  hasSoulMd: boolean
+}
+
+export async function fetchProfiles(): Promise<HermesProfile[]> {
+  const res = await request<{ profiles: HermesProfile[] }>('/api/hermes/profiles')
+  return res.profiles
+}
+
+export async function fetchProfileDetail(name: string): Promise<HermesProfileDetail> {
+  const res = await request<{ profile: HermesProfileDetail }>(`/api/hermes/profiles/${encodeURIComponent(name)}`)
+  return res.profile
+}
+
+export async function createProfile(name: string, clone?: boolean): Promise<boolean> {
+  try {
+    await request('/api/hermes/profiles', {
+      method: 'POST',
+      body: JSON.stringify({ name, clone }),
+    })
+    return true
+  } catch {
+    return false
+  }
+}
+
+export async function deleteProfile(name: string): Promise<boolean> {
+  try {
+    await request(`/api/hermes/profiles/${encodeURIComponent(name)}`, { method: 'DELETE' })
+    return true
+  } catch {
+    return false
+  }
+}
+
+export async function renameProfile(name: string, newName: string): Promise<boolean> {
+  try {
+    await request(`/api/hermes/profiles/${encodeURIComponent(name)}/rename`, {
+      method: 'POST',
+      body: JSON.stringify({ new_name: newName }),
+    })
+    return true
+  } catch {
+    return false
+  }
+}
+
+export async function switchProfile(name: string): Promise<boolean> {
+  try {
+    await request('/api/hermes/profiles/active', {
+      method: 'PUT',
+      body: JSON.stringify({ name }),
+    })
+    return true
+  } catch {
+    return false
+  }
+}
+
+export async function exportProfile(name: string): Promise<boolean> {
+  try {
+    const baseUrl = getBaseUrlValue()
+    const token = getApiKey()
+    const headers: Record<string, string> = {}
+    if (token) headers['Authorization'] = `Bearer ${token}`
+
+    const res = await fetch(`${baseUrl}/api/hermes/profiles/${encodeURIComponent(name)}/export`, {
+      method: 'POST',
+      headers,
+    })
+    if (!res.ok) throw new Error()
+
+    const blob = await res.blob()
+    const url = URL.createObjectURL(blob)
+    const a = document.createElement('a')
+    a.href = url
+    a.download = `hermes-profile-${name}.tar.gz`
+    a.click()
+    URL.revokeObjectURL(url)
+    return true
+  } catch {
+    return false
+  }
+}
+
+export async function importProfile(archive: string, name?: string): Promise<boolean> {
+  try {
+    await request('/api/hermes/profiles/import', {
+      method: 'POST',
+      body: JSON.stringify({ archive, name }),
+    })
+    return true
+  } catch {
+    return false
+  }
+}
diff --git a/packages/client/src/components/hermes/profiles/ProfileCard.vue b/packages/client/src/components/hermes/profiles/ProfileCard.vue
new file mode 100644
index 0000000..ce9ef52
--- /dev/null
+++ b/packages/client/src/components/hermes/profiles/ProfileCard.vue
@@ -0,0 +1,290 @@
+<script setup lang="ts">
+import { ref, computed } from 'vue'
+import { NButton, NTag, NSpin, useMessage, useDialog } from 'naive-ui'
+import type { HermesProfile, HermesProfileDetail } from '@/api/hermes/profiles'
+import { useProfilesStore } from '@/stores/hermes/profiles'
+import { useI18n } from 'vue-i18n'
+
+const props = defineProps<{ profile: HermesProfile }>()
+const emit = defineEmits<{ rename: [name: string] }>()
+
+const { t } = useI18n()
+const profilesStore = useProfilesStore()
+const message = useMessage()
+const dialog = useDialog()
+
+const expanded = ref(false)
+const detailLoading = ref(false)
+const exporting = ref(false)
+const detail = ref<HermesProfileDetail | null>(null)
+
+const isDefault = computed(() => props.profile.name === 'default')
+
+async function toggleDetail() {
+  if (expanded.value) {
+    expanded.value = false
+    return
+  }
+  expanded.value = true
+  detailLoading.value = true
+  try {
+    detail.value = await profilesStore.fetchProfileDetail(props.profile.name)
+  } finally {
+    detailLoading.value = false
+  }
+}
+
+function handleSwitch() {
+  dialog.warning({
+    title: t('profiles.switchTo'),
+    content: t('profiles.switchConfirm', { name: props.profile.name }),
+    positiveText: t('common.confirm'),
+    negativeText: t('common.cancel'),
+    onPositiveClick: async () => {
+      const ok = await profilesStore.switchProfile(props.profile.name)
+      if (ok) {
+        message.success(t('profiles.switchSuccess', { name: props.profile.name }))
+      } else {
+        message.error(t('profiles.switchFailed'))
+      }
+    },
+  })
+}
+
+function handleDelete() {
+  dialog.warning({
+    title: t('profiles.delete'),
+    content: t('profiles.deleteConfirm', { name: props.profile.name }),
+    positiveText: t('common.delete'),
+    negativeText: t('common.cancel'),
+    onPositiveClick: async () => {
+      const ok = await profilesStore.deleteProfile(props.profile.name)
+      if (ok) {
+        message.success(t('profiles.deleteSuccess'))
+      } else {
+        message.error(t('profiles.deleteFailed'))
+      }
+    },
+  })
+}
+
+async function handleExport() {
+  exporting.value = true
+  try {
+    const ok = await profilesStore.exportProfile(props.profile.name)
+    if (ok) {
+      message.success(t('profiles.exportSuccess'))
+    } else {
+      message.error(t('profiles.exportFailed'))
+    }
+  } finally {
+    exporting.value = false
+  }
+}
+</script>
+
+<template>
+  <div class="profile-card" :class="{ active: profile.active }">
+    <div class="card-header">
+      <h3 class="profile-name">{{ profile.name }}</h3>
+      <NTag v-if="profile.active" size="tiny" type="success" :bordered="false">
+        {{ t('profiles.active') }}
+      </NTag>
+    </div>
+
+    <div class="card-body">
+      <div class="info-row">
+        <span class="info-label">{{ t('profiles.model') }}</span>
+        <code class="info-value mono">{{ profile.model }}</code>
+      </div>
+      <div class="info-row">
+        <span class="info-label">{{ t('profiles.gateway') }}</span>
+        <code class="info-value mono">{{ profile.gateway }}</code>
+      </div>
+      <div v-if="profile.alias" class="info-row">
+        <span class="info-label">{{ t('profiles.alias') }}</span>
+        <span class="info-value">{{ profile.alias }}</span>
+      </div>
+    </div>
+
+    <div class="card-detail-toggle" @click="toggleDetail">
+      <svg
+        width="14" height="14" viewBox="0 0 24 24" fill="none"
+        stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
+        class="toggle-icon"
+        :class="{ expanded }"
+      >
+        <polyline points="6 9 12 15 18 9" />
+      </svg>
+      <span class="toggle-text">{{ expanded ? t('common.collapse') : t('common.expand') }}</span>
+    </div>
+
+    <div v-if="expanded" class="card-detail">
+      <NSpin :show="detailLoading" size="small">
+        <template v-if="detail">
+          <div class="info-row">
+            <span class="info-label">{{ t('profiles.provider') }}</span>
+            <span class="info-value">{{ detail.provider }}</span>
+          </div>
+          <div class="info-row">
+            <span class="info-label">{{ t('profiles.path') }}</span>
+            <code class="info-value mono detail-path">{{ detail.path }}</code>
+          </div>
+          <div class="info-row">
+            <span class="info-label">{{ t('profiles.skills') }}</span>
+            <span class="info-value">{{ detail.skills }}</span>
+          </div>
+          <div class="info-row">
+            <span class="info-label">{{ t('profiles.hasEnv') }}</span>
+            <span class="info-value">{{ detail.hasEnv ? 'Yes' : 'No' }}</span>
+          </div>
+          <div class="info-row">
+            <span class="info-label">{{ t('profiles.hasSoulMd') }}</span>
+            <span class="info-value">{{ detail.hasSoulMd ? 'Yes' : 'No' }}</span>
+          </div>
+        </template>
+      </NSpin>
+    </div>
+
+    <div class="card-actions">
+      <NButton
+        v-if="!profile.active"
+        size="tiny"
+        :loading="profilesStore.switching"
+        quaternary
+        type="primary"
+        @click="handleSwitch"
+      >
+        {{ t('profiles.switchTo') }}
+      </NButton>
+      <NButton size="tiny" quaternary @click="emit('rename', profile.name)">
+        {{ t('profiles.rename') }}
+      </NButton>
+      <NButton
+        size="tiny"
+        quaternary
+        type="error"
+        :disabled="isDefault"
+        @click="handleDelete"
+      >
+        {{ t('common.delete') }}
+      </NButton>
+      <NButton size="tiny" quaternary :loading="exporting" @click="handleExport">
+        {{ t('profiles.export') }}
+      </NButton>
+    </div>
+  </div>
+</template>
+
+<style scoped lang="scss">
+@use '@/styles/variables' as *;
+
+.profile-card {
+  background-color: $bg-card;
+  border: 1px solid $border-color;
+  border-radius: $radius-md;
+  padding: 16px;
+  transition: border-color $transition-fast;
+
+  &:hover {
+    border-color: rgba($accent-primary, 0.3);
+  }
+
+  &.active {
+    border-color: rgba($success, 0.4);
+  }
+}
+
+.card-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 12px;
+}
+
+.profile-name {
+  font-size: 15px;
+  font-weight: 600;
+  color: $text-primary;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  max-width: 70%;
+}
+
+.card-body {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  margin-bottom: 8px;
+}
+
+.card-detail-toggle {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  padding: 6px 0;
+  cursor: pointer;
+  color: $text-muted;
+  font-size: 12px;
+  user-select: none;
+
+  &:hover {
+    color: $text-secondary;
+  }
+}
+
+.toggle-icon {
+  transition: transform 0.2s;
+
+  &.expanded {
+    transform: rotate(180deg);
+  }
+}
+
+.card-detail {
+  padding: 8px 0;
+  border-top: 1px solid $border-light;
+  margin-bottom: 8px;
+}
+
+.info-row {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 2px 0;
+}
+
+.info-label {
+  font-size: 12px;
+  color: $text-muted;
+  flex-shrink: 0;
+  margin-right: 12px;
+}
+
+.info-value {
+  font-size: 12px;
+  color: $text-secondary;
+  text-align: right;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.mono {
+  font-family: $font-code;
+  font-size: 12px;
+}
+
+.detail-path {
+  max-width: 260px;
+}
+
+.card-actions {
+  display: flex;
+  gap: 8px;
+  border-top: 1px solid $border-light;
+  padding-top: 10px;
+  flex-wrap: wrap;
+}
+</style>
diff --git a/packages/client/src/components/hermes/profiles/ProfileCreateModal.vue b/packages/client/src/components/hermes/profiles/ProfileCreateModal.vue
new file mode 100644
index 0000000..1b23f11
--- /dev/null
+++ b/packages/client/src/components/hermes/profiles/ProfileCreateModal.vue
@@ -0,0 +1,87 @@
+<script setup lang="ts">
+import { ref } from 'vue'
+import { NModal, NForm, NFormItem, NInput, NButton, NSwitch, useMessage } from 'naive-ui'
+import { useProfilesStore } from '@/stores/hermes/profiles'
+import { useI18n } from 'vue-i18n'
+
+const emit = defineEmits<{
+  close: []
+  saved: []
+}>()
+
+const { t } = useI18n()
+const profilesStore = useProfilesStore()
+const message = useMessage()
+
+const showModal = ref(true)
+const loading = ref(false)
+const name = ref('')
+const clone = ref(false)
+
+async function handleSave() {
+  if (!name.value.trim()) {
+    message.warning(t('profiles.namePlaceholder'))
+    return
+  }
+
+  loading.value = true
+  try {
+    const ok = await profilesStore.createProfile(name.value.trim(), clone.value)
+    if (ok) {
+      message.success(t('profiles.createSuccess', { name: name.value.trim() }))
+      emit('saved')
+    } else {
+      message.error(t('profiles.createFailed'))
+    }
+  } finally {
+    loading.value = false
+  }
+}
+
+function handleClose() {
+  showModal.value = false
+  setTimeout(() => emit('close'), 200)
+}
+</script>
+
+<template>
+  <NModal
+    v-model:show="showModal"
+    preset="card"
+    :title="t('profiles.create')"
+    :style="{ width: 'min(420px, calc(100vw - 32px))' }"
+    :mask-closable="!loading"
+    @after-leave="emit('close')"
+  >
+    <NForm label-placement="top">
+      <NFormItem :label="t('profiles.name')" required>
+        <NInput
+          v-model:value="name"
+          :placeholder="t('profiles.namePlaceholder')"
+          @keyup.enter="handleSave"
+        />
+      </NFormItem>
+
+      <NFormItem :label="t('profiles.cloneFromCurrent')">
+        <NSwitch v-model:value="clone" />
+      </NFormItem>
+    </NForm>
+
+    <template #footer>
+      <div class="modal-footer">
+        <NButton @click="handleClose">{{ t('common.cancel') }}</NButton>
+        <NButton type="primary" :loading="loading" @click="handleSave">
+          {{ t('common.create') }}
+        </NButton>
+      </div>
+    </template>
+  </NModal>
+</template>
+
+<style scoped lang="scss">
+.modal-footer {
+  display: flex;
+  justify-content: flex-end;
+  gap: 8px;
+}
+</style>
diff --git a/packages/client/src/components/hermes/profiles/ProfileImportModal.vue b/packages/client/src/components/hermes/profiles/ProfileImportModal.vue
new file mode 100644
index 0000000..d9d3f94
--- /dev/null
+++ b/packages/client/src/components/hermes/profiles/ProfileImportModal.vue
@@ -0,0 +1,92 @@
+<script setup lang="ts">
+import { ref } from 'vue'
+import { NModal, NForm, NFormItem, NInput, NButton, useMessage } from 'naive-ui'
+import { useProfilesStore } from '@/stores/hermes/profiles'
+import { useI18n } from 'vue-i18n'
+
+const emit = defineEmits<{
+  close: []
+  saved: []
+}>()
+
+const { t } = useI18n()
+const profilesStore = useProfilesStore()
+const message = useMessage()
+
+const showModal = ref(true)
+const loading = ref(false)
+const archive = ref('')
+const name = ref('')
+
+async function handleSave() {
+  if (!archive.value.trim()) {
+    message.warning(t('profiles.archivePathPlaceholder'))
+    return
+  }
+
+  loading.value = true
+  try {
+    const ok = await profilesStore.importProfile(
+      archive.value.trim(),
+      name.value.trim() || undefined,
+    )
+    if (ok) {
+      message.success(t('profiles.importSuccess'))
+      emit('saved')
+    } else {
+      message.error(t('profiles.importFailed'))
+    }
+  } finally {
+    loading.value = false
+  }
+}
+
+function handleClose() {
+  showModal.value = false
+  setTimeout(() => emit('close'), 200)
+}
+</script>
+
+<template>
+  <NModal
+    v-model:show="showModal"
+    preset="card"
+    :title="t('profiles.import')"
+    :style="{ width: 'min(420px, calc(100vw - 32px))' }"
+    :mask-closable="!loading"
+    @after-leave="emit('close')"
+  >
+    <NForm label-placement="top">
+      <NFormItem :label="t('profiles.archivePath')" required>
+        <NInput
+          v-model:value="archive"
+          :placeholder="t('profiles.archivePathPlaceholder')"
+        />
+      </NFormItem>
+
+      <NFormItem :label="t('profiles.importName')">
+        <NInput
+          v-model:value="name"
+          :placeholder="t('profiles.importNamePlaceholder')"
+        />
+      </NFormItem>
+    </NForm>
+
+    <template #footer>
+      <div class="modal-footer">
+        <NButton @click="handleClose">{{ t('common.cancel') }}</NButton>
+        <NButton type="primary" :loading="loading" @click="handleSave">
+          {{ t('common.confirm') }}
+        </NButton>
+      </div>
+    </template>
+  </NModal>
+</template>
+
+<style scoped lang="scss">
+.modal-footer {
+  display: flex;
+  justify-content: flex-end;
+  gap: 8px;
+}
+</style>
diff --git a/packages/client/src/components/hermes/profiles/ProfileRenameModal.vue b/packages/client/src/components/hermes/profiles/ProfileRenameModal.vue
new file mode 100644
index 0000000..aa09dbb
--- /dev/null
+++ b/packages/client/src/components/hermes/profiles/ProfileRenameModal.vue
@@ -0,0 +1,83 @@
+<script setup lang="ts">
+import { ref } from 'vue'
+import { NModal, NForm, NFormItem, NInput, NButton, useMessage } from 'naive-ui'
+import { useProfilesStore } from '@/stores/hermes/profiles'
+import { useI18n } from 'vue-i18n'
+
+const props = defineProps<{ profileName: string }>()
+const emit = defineEmits<{
+  close: []
+  saved: []
+}>()
+
+const { t } = useI18n()
+const profilesStore = useProfilesStore()
+const message = useMessage()
+
+const showModal = ref(true)
+const loading = ref(false)
+const newName = ref('')
+
+async function handleSave() {
+  if (!newName.value.trim()) {
+    message.warning(t('profiles.newNamePlaceholder'))
+    return
+  }
+
+  loading.value = true
+  try {
+    const ok = await profilesStore.renameProfile(props.profileName, newName.value.trim())
+    if (ok) {
+      message.success(t('profiles.renameSuccess'))
+      emit('saved')
+    } else {
+      message.error(t('profiles.renameFailed'))
+    }
+  } finally {
+    loading.value = false
+  }
+}
+
+function handleClose() {
+  showModal.value = false
+  setTimeout(() => emit('close'), 200)
+}
+</script>
+
+<template>
+  <NModal
+    v-model:show="showModal"
+    preset="card"
+    :title="t('profiles.rename')"
+    :style="{ width: 'min(420px, calc(100vw - 32px))' }"
+    :mask-closable="!loading"
+    @after-leave="emit('close')"
+  >
+    <NForm label-placement="top">
+      <NFormItem :label="t('profiles.newName')" required>
+        <NInput
+          v-model:value="newName"
+          :placeholder="t('profiles.newNamePlaceholder')"
+          @keyup.enter="handleSave"
+        />
+      </NFormItem>
+    </NForm>
+
+    <template #footer>
+      <div class="modal-footer">
+        <NButton @click="handleClose">{{ t('common.cancel') }}</NButton>
+        <NButton type="primary" :loading="loading" @click="handleSave">
+          {{ t('common.confirm') }}
+        </NButton>
+      </div>
+    </template>
+  </NModal>
+</template>
+
+<style scoped lang="scss">
+.modal-footer {
+  display: flex;
+  justify-content: flex-end;
+  gap: 8px;
+}
+</style>
diff --git a/packages/client/src/components/hermes/profiles/ProfilesPanel.vue b/packages/client/src/components/hermes/profiles/ProfilesPanel.vue
new file mode 100644
index 0000000..2a1e3e9
--- /dev/null
+++ b/packages/client/src/components/hermes/profiles/ProfilesPanel.vue
@@ -0,0 +1,56 @@
+<script setup lang="ts">
+import ProfileCard from './ProfileCard.vue'
+import { useProfilesStore } from '@/stores/hermes/profiles'
+import { useI18n } from 'vue-i18n'
+
+defineEmits<{ rename: [name: string] }>()
+
+const { t } = useI18n()
+const profilesStore = useProfilesStore()
+</script>
+
+<template>
+  <div v-if="profilesStore.profiles.length === 0" class="empty-state">
+    <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" class="empty-icon">
+      <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2" />
+      <circle cx="12" cy="7" r="4" />
+    </svg>
+    <p>{{ t('profiles.noProfiles') }}</p>
+  </div>
+  <div v-else class="profiles-grid">
+    <ProfileCard
+      v-for="p in profilesStore.profiles"
+      :key="p.name"
+      :profile="p"
+      @rename="$emit('rename', $event)"
+    />
+  </div>
+</template>
+
+<style scoped lang="scss">
+@use '@/styles/variables' as *;
+
+.empty-state {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  color: $text-muted;
+  gap: 12px;
+
+  .empty-icon {
+    opacity: 0.3;
+  }
+
+  p {
+    font-size: 14px;
+  }
+}
+
+.profiles-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr));
+  gap: 14px;
+}
+</style>
diff --git a/packages/client/src/components/layout/AppSidebar.vue b/packages/client/src/components/layout/AppSidebar.vue
index a0ef8e7..0f3d5fd 100644
--- a/packages/client/src/components/layout/AppSidebar.vue
+++ b/packages/client/src/components/layout/AppSidebar.vue
@@ -147,6 +147,27 @@ function handleNav(key: string) {
         <span>{{ t("sidebar.models") }}</span>
       </button>
 
+      <button
+        class="nav-item"
+        :class="{ active: selectedKey === 'hermes.profiles' }"
+        @click="handleNav('hermes.profiles')"
+      >
+        <svg
+          width="16"
+          height="16"
+          viewBox="0 0 24 24"
+          fill="none"
+          stroke="currentColor"
+          stroke-width="1.5"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+        >
+          <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2" />
+          <circle cx="12" cy="7" r="4" />
+        </svg>
+        <span>{{ t("sidebar.profiles") }}</span>
+      </button>
+
       <button
         class="nav-item"
         :class="{ active: selectedKey === 'hermes.channels' }"
diff --git a/packages/client/src/i18n/locales/en.ts b/packages/client/src/i18n/locales/en.ts
index 0577801..e09e591 100644
--- a/packages/client/src/i18n/locales/en.ts
+++ b/packages/client/src/i18n/locales/en.ts
@@ -31,6 +31,9 @@ export default {
     disable: 'Disable',
     configured: 'Configured',
     notConfigured: 'Not configured',
+    confirm: 'Confirm',
+    expand: 'Expand',
+    collapse: 'Collapse',
   },
 
   // Sidebar
@@ -38,6 +41,7 @@ export default {
     chat: 'Chat',
     jobs: 'Jobs',
     models: 'Models',
+    profiles: 'Profiles',
     skills: 'Skills',
     memory: 'Memory',
     logs: 'Logs',
@@ -197,6 +201,50 @@ export default {
     fetchFailed: 'Failed to fetch models',
   },
 
+  // Profiles
+  profiles: {
+    title: 'Profiles',
+    create: 'Create Profile',
+    import: 'Import',
+    export: 'Export',
+    rename: 'Rename',
+    delete: 'Delete',
+    switchTo: 'Switch to',
+    switchConfirm: 'Switching to profile "{name}" will restart the gateway. Continue?',
+    switchSuccess: 'Switched to profile "{name}"',
+    switchFailed: 'Failed to switch profile. Gateway may need manual restart.',
+    createSuccess: 'Profile "{name}" created',
+    createFailed: 'Failed to create profile',
+    renameSuccess: 'Profile renamed',
+    renameFailed: 'Failed to rename profile',
+    deleteConfirm: 'Are you sure you want to delete profile "{name}"?',
+    deleteSuccess: 'Profile deleted',
+    deleteFailed: 'Failed to delete profile',
+    exportSuccess: 'Profile exported',
+    exportFailed: 'Failed to export profile',
+    importSuccess: 'Profile imported',
+    importFailed: 'Failed to import profile',
+    name: 'Profile Name',
+    namePlaceholder: 'Enter profile name',
+    newName: 'New Name',
+    newNamePlaceholder: 'Enter new name',
+    cloneFromCurrent: 'Clone from current profile',
+    archivePath: 'Archive Path',
+    archivePathPlaceholder: 'Server path to archive file',
+    importName: 'Profile Name (optional)',
+    importNamePlaceholder: 'Leave empty to use archive name',
+    active: 'Active',
+    model: 'Model',
+    gateway: 'Gateway',
+    alias: 'Alias',
+    provider: 'Provider',
+    path: 'Path',
+    skills: 'Skills',
+    hasEnv: 'Has .env',
+    hasSoulMd: 'Has soul.md',
+    noProfiles: 'No profiles found. Create one to get started.',
+  },
+
   // Logs
   logs: {
     title: 'Logs',
diff --git a/packages/client/src/i18n/locales/zh.ts b/packages/client/src/i18n/locales/zh.ts
index 16f007f..5c98863 100644
--- a/packages/client/src/i18n/locales/zh.ts
+++ b/packages/client/src/i18n/locales/zh.ts
@@ -31,6 +31,9 @@ export default {
     disable: '禁用',
     configured: '已配置',
     notConfigured: '未配置',
+    confirm: '确定',
+    expand: '展开',
+    collapse: '收起',
   },
 
   // 侧边栏
@@ -38,6 +41,7 @@ export default {
     chat: '对话',
     jobs: '任务',
     models: '模型',
+    profiles: '配置',
     skills: '技能',
     memory: '记忆',
     logs: '日志',
@@ -197,6 +201,50 @@ export default {
     fetchFailed: '获取模型失败',
   },
 
+  // 配置
+  profiles: {
+    title: '配置',
+    create: '创建配置',
+    import: '导入',
+    export: '导出',
+    rename: '重命名',
+    delete: '删除',
+    switchTo: '切换到',
+    switchConfirm: '切换到配置 "{name}" 将重启网关，是否继续？',
+    switchSuccess: '已切换到配置 "{name}"',
+    switchFailed: '切换配置失败，网关可能需要手动重启',
+    createSuccess: '配置 "{name}" 已创建',
+    createFailed: '创建配置失败',
+    renameSuccess: '配置已重命名',
+    renameFailed: '重命名配置失败',
+    deleteConfirm: '确定删除配置 "{name}" 吗？',
+    deleteSuccess: '配置已删除',
+    deleteFailed: '删除配置失败',
+    exportSuccess: '配置已导出',
+    exportFailed: '导出配置失败',
+    importSuccess: '配置已导入',
+    importFailed: '导入配置失败',
+    name: '配置名称',
+    namePlaceholder: '输入配置名称',
+    newName: '新名称',
+    newNamePlaceholder: '输入新名称',
+    cloneFromCurrent: '从当前配置克隆',
+    archivePath: '归档路径',
+    archivePathPlaceholder: '归档文件的服务器路径',
+    importName: '配置名称（可选）',
+    importNamePlaceholder: '留空则使用归档名称',
+    active: '活跃',
+    model: '模型',
+    gateway: '网关',
+    alias: '别名',
+    provider: 'Provider',
+    path: '路径',
+    skills: '技能',
+    hasEnv: '有 .env',
+    hasSoulMd: '有 soul.md',
+    noProfiles: '暂无配置，创建一个开始吧。',
+  },
+
   // 日志
   logs: {
     title: '日志',
diff --git a/packages/client/src/router/index.ts b/packages/client/src/router/index.ts
index 2a0b109..a4b85f3 100644
--- a/packages/client/src/router/index.ts
+++ b/packages/client/src/router/index.ts
@@ -25,6 +25,11 @@ const router = createRouter({
       name: 'hermes.models',
       component: () => import('@/views/hermes/ModelsView.vue'),
     },
+    {
+      path: '/hermes/profiles',
+      name: 'hermes.profiles',
+      component: () => import('@/views/hermes/ProfilesView.vue'),
+    },
     {
       path: '/hermes/logs',
       name: 'hermes.logs',
diff --git a/packages/client/src/stores/hermes/profiles.ts b/packages/client/src/stores/hermes/profiles.ts
new file mode 100644
index 0000000..927a9c5
--- /dev/null
+++ b/packages/client/src/stores/hermes/profiles.ts
@@ -0,0 +1,96 @@
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+import * as profilesApi from '@/api/hermes/profiles'
+import type { HermesProfile, HermesProfileDetail } from '@/api/hermes/profiles'
+
+export const useProfilesStore = defineStore('profiles', () => {
+  const profiles = ref<HermesProfile[]>([])
+  const activeProfile = ref<HermesProfile | null>(null)
+  const detailMap = ref<Record<string, HermesProfileDetail>>({})
+  const loading = ref(false)
+  const switching = ref(false)
+
+  async function fetchProfiles() {
+    loading.value = true
+    try {
+      profiles.value = await profilesApi.fetchProfiles()
+      activeProfile.value = profiles.value.find(p => p.active) ?? null
+    } catch (err) {
+      console.error('Failed to fetch profiles:', err)
+    } finally {
+      loading.value = false
+    }
+  }
+
+  async function fetchProfileDetail(name: string) {
+    if (detailMap.value[name]) return detailMap.value[name]
+    try {
+      const detail = await profilesApi.fetchProfileDetail(name)
+      detailMap.value[name] = detail
+      return detail
+    } catch {
+      return null
+    }
+  }
+
+  async function createProfile(name: string, clone?: boolean) {
+    const ok = await profilesApi.createProfile(name, clone)
+    if (ok) await fetchProfiles()
+    return ok
+  }
+
+  async function deleteProfile(name: string) {
+    const ok = await profilesApi.deleteProfile(name)
+    if (ok) {
+      delete detailMap.value[name]
+      await fetchProfiles()
+    }
+    return ok
+  }
+
+  async function renameProfile(name: string, newName: string) {
+    const ok = await profilesApi.renameProfile(name, newName)
+    if (ok) {
+      delete detailMap.value[name]
+      await fetchProfiles()
+    }
+    return ok
+  }
+
+  async function switchProfile(name: string) {
+    switching.value = true
+    try {
+      const ok = await profilesApi.switchProfile(name)
+      if (ok) await fetchProfiles()
+      return ok
+    } finally {
+      switching.value = false
+    }
+  }
+
+  async function exportProfile(name: string) {
+    return profilesApi.exportProfile(name)
+  }
+
+  async function importProfile(archive: string, name?: string) {
+    const ok = await profilesApi.importProfile(archive, name)
+    if (ok) await fetchProfiles()
+    return ok
+  }
+
+  return {
+    profiles,
+    activeProfile,
+    detailMap,
+    loading,
+    switching,
+    fetchProfiles,
+    fetchProfileDetail,
+    createProfile,
+    deleteProfile,
+    renameProfile,
+    switchProfile,
+    exportProfile,
+    importProfile,
+  }
+})
diff --git a/packages/client/src/views/hermes/ProfilesView.vue b/packages/client/src/views/hermes/ProfilesView.vue
new file mode 100644
index 0000000..c8338c5
--- /dev/null
+++ b/packages/client/src/views/hermes/ProfilesView.vue
@@ -0,0 +1,120 @@
+<script setup lang="ts">
+import { ref, onMounted } from 'vue'
+import { NButton, NSpin } from 'naive-ui'
+import { useI18n } from 'vue-i18n'
+import ProfilesPanel from '@/components/hermes/profiles/ProfilesPanel.vue'
+import ProfileCreateModal from '@/components/hermes/profiles/ProfileCreateModal.vue'
+import ProfileRenameModal from '@/components/hermes/profiles/ProfileRenameModal.vue'
+import ProfileImportModal from '@/components/hermes/profiles/ProfileImportModal.vue'
+import { useProfilesStore } from '@/stores/hermes/profiles'
+
+const { t } = useI18n()
+const profilesStore = useProfilesStore()
+
+const showCreateModal = ref(false)
+const showImportModal = ref(false)
+const renamingProfile = ref<string | null>(null)
+
+onMounted(() => {
+  profilesStore.fetchProfiles()
+})
+
+function handleCreated() {
+  showCreateModal.value = false
+}
+
+function handleRenamed() {
+  renamingProfile.value = null
+}
+
+function handleImported() {
+  showImportModal.value = false
+}
+</script>
+
+<template>
+  <div class="profiles-view">
+    <header class="page-header">
+      <h2 class="header-title">{{ t('profiles.title') }}</h2>
+      <div class="header-actions">
+        <NButton size="small" @click="showImportModal = true">
+          <template #icon>
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+              <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
+              <polyline points="17 8 12 3 7 8" />
+              <line x1="12" y1="3" x2="12" y2="15" />
+            </svg>
+          </template>
+          {{ t('profiles.import') }}
+        </NButton>
+        <NButton type="primary" size="small" @click="showCreateModal = true">
+          <template #icon>
+            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+              <line x1="12" y1="5" x2="12" y2="19" />
+              <line x1="5" y1="12" x2="19" y2="12" />
+            </svg>
+          </template>
+          {{ t('profiles.create') }}
+        </NButton>
+      </div>
+    </header>
+
+    <div class="profiles-content">
+      <NSpin :show="profilesStore.loading && profilesStore.profiles.length === 0">
+        <ProfilesPanel @rename="renamingProfile = $event" />
+      </NSpin>
+    </div>
+
+    <ProfileCreateModal
+      v-if="showCreateModal"
+      @close="showCreateModal = false"
+      @saved="handleCreated"
+    />
+    <ProfileRenameModal
+      v-if="renamingProfile"
+      :profile-name="renamingProfile"
+      @close="renamingProfile = null"
+      @saved="handleRenamed"
+    />
+    <ProfileImportModal
+      v-if="showImportModal"
+      @close="showImportModal = false"
+      @saved="handleImported"
+    />
+  </div>
+</template>
+
+<style scoped lang="scss">
+@use '@/styles/variables' as *;
+
+.profiles-view {
+  height: calc(100 * var(--vh));
+  display: flex;
+  flex-direction: column;
+}
+
+.page-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 16px 20px;
+  border-bottom: 1px solid $border-color;
+}
+
+.header-title {
+  font-size: 16px;
+  font-weight: 600;
+  color: $text-primary;
+}
+
+.header-actions {
+  display: flex;
+  gap: 8px;
+}
+
+.profiles-content {
+  flex: 1;
+  overflow-y: auto;
+  padding: 20px;
+}
+</style>
diff --git a/packages/server/src/routes/hermes/profiles.ts b/packages/server/src/routes/hermes/profiles.ts
index 1b07c60..7b396ab 100644
--- a/packages/server/src/routes/hermes/profiles.ts
+++ b/packages/server/src/routes/hermes/profiles.ts
@@ -1,4 +1,7 @@
 import Router from '@koa/router'
+import { createReadStream, existsSync, unlinkSync } from 'fs'
+import { basename, join } from 'path'
+import { tmpdir } from 'os'
 import * as hermesCli from '../../services/hermes-cli'
 
 export const profileRoutes = new Router()
@@ -156,14 +159,29 @@ profileRoutes.put('/api/hermes/profiles/active', async (ctx) => {
   }
 })
 
-// POST /api/profiles/:name/export - Export profile to archive
+// POST /api/profiles/:name/export - Export profile to archive and download
 profileRoutes.post('/api/hermes/profiles/:name/export', async (ctx) => {
   const { name } = ctx.params
-  const { output } = ctx.request.body as { output?: string }
+  const outputPath = join(tmpdir(), `hermes-profile-${name}.tar.gz`)
 
   try {
-    const result = await hermesCli.exportProfile(name, output)
-    ctx.body = { success: true, message: result.trim() }
+    await hermesCli.exportProfile(name, outputPath)
+
+    if (!existsSync(outputPath)) {
+      ctx.status = 500
+      ctx.body = { error: 'Export file not found' }
+      return
+    }
+
+    const filename = basename(outputPath)
+    ctx.set('Content-Disposition', `attachment; filename="${filename}"`)
+    ctx.set('Content-Type', 'application/gzip')
+    ctx.body = createReadStream(outputPath)
+
+    // Clean up temp file after response ends
+    ctx.res.on('finish', () => {
+      try { unlinkSync(outputPath) } catch { }
+    })
   } catch (err: any) {
     ctx.status = 500
     ctx.body = { error: err.message }