diff --git a/README.md b/README.md
index 36393f9536..435a8a120e 100644
--- a/README.md
+++ b/README.md
@@ -69,7 +69,7 @@ const Example = () => {
           <View activePanel="main">
             <Panel id="main">
               <PanelHeader>VKUI</PanelHeader>
-              <Group header={<Header mode="secondary">Items</Header>}>
+              <Group header={<Header size="s">Items</Header>}>
                 <SimpleCell>Hello</SimpleCell>
                 <SimpleCell>World</SimpleCell>
               </Group>
diff --git a/packages/codemods/src/transforms/v7/__testfixtures__/header/basic.input.tsx b/packages/codemods/src/transforms/v7/__testfixtures__/header/basic.input.tsx
index 89de681f87..948a31090f 100644
--- a/packages/codemods/src/transforms/v7/__testfixtures__/header/basic.input.tsx
+++ b/packages/codemods/src/transforms/v7/__testfixtures__/header/basic.input.tsx
@@ -12,16 +12,15 @@ const App = () => {
   return (
     <React.Fragment>
       {/* Проверка изменения size */}
-      <Header mode="primary" multiline size="large">
+      <Header multiline size="large">
         Кто может писать мне личные сообщения
       </Header>
-      <Header mode="secondary" multiline size="regular">
+      <Header multiline size="regular">
         Кто может писать мне личные сообщения
       </Header>
 
       {/* Проверка замены aside на after */}
       <Header
-        mode="primary"
         subtitle="SOHN — Conrad"
         subtitleComponent="h3"
         aside={
@@ -32,11 +31,49 @@ const App = () => {
         }
       />
       <Header
-        mode="primary"
         subtitle="SOHN — Conrad"
         subtitleComponent="h3"
         aside={aside}
       />
+
+      {/* Проверка удаления mode */}
+      {/* замена Large Primary на xl */}
+      <Header
+        mode="primary"
+        size="large"
+        subtitle="SOHN — Conrad"
+      />
+
+      {/* замена Large tertiary на m */}
+      <Header
+        mode="tertiary"
+        size="large"
+        subtitle="SOHN — Conrad"
+      />
+      {/* замена Regular tertiary на m */}
+      <Header
+        mode="tertiary"
+        size="regular"
+        subtitle="SOHN — Conrad"
+      />
+      {/* замена Regular primary на m */}
+      <Header
+        mode="primary"
+        size="regular"
+        subtitle="SOHN — Conrad"
+      />
+      {/* замена Large secondary на m */}
+      <Header
+        mode="secondary"
+        size="large"
+        subtitle="SOHN — Conrad"
+      />
+      {/* замена Regular secondary на s */}
+      <Header
+        mode="secondary"
+        size="regular"
+        subtitle="SOHN — Conrad"
+      />
     </React.Fragment>
   );
 };
diff --git a/packages/codemods/src/transforms/v7/__tests__/__snapshots__/header.ts.snap b/packages/codemods/src/transforms/v7/__tests__/__snapshots__/header.ts.snap
index 77b774efcd..1c41cfd5ff 100644
--- a/packages/codemods/src/transforms/v7/__tests__/__snapshots__/header.ts.snap
+++ b/packages/codemods/src/transforms/v7/__tests__/__snapshots__/header.ts.snap
@@ -15,15 +15,14 @@ const App = () => {
   return (
     (<React.Fragment>
       {/* Проверка изменения size */}
-      <Header mode="primary" multiline size="l">
+      <Header multiline size="l">
         Кто может писать мне личные сообщения
       </Header>
-      <Header mode="secondary" multiline size="m">
+      <Header multiline size="m">
         Кто может писать мне личные сообщения
       </Header>
       {/* Проверка замены aside на after */}
       <Header
-        mode="primary"
         subtitle="SOHN — Conrad"
         subtitleComponent="h3"
         after={
@@ -34,11 +33,23 @@ const App = () => {
         }
       />
       <Header
-        mode="primary"
         subtitle="SOHN — Conrad"
         subtitleComponent="h3"
         after={aside}
       />
+      {/* Проверка удаления mode */}
+      {/* замена Large Primary на xl */}
+      <Header size="xl" subtitle="SOHN — Conrad" />
+      {/* замена Large tertiary на m */}
+      <Header size="m" subtitle="SOHN — Conrad" />
+      {/* замена Regular tertiary на m */}
+      <Header size="m" subtitle="SOHN — Conrad" />
+      {/* замена Regular primary на m */}
+      <Header size="m" subtitle="SOHN — Conrad" />
+      {/* замена Large secondary на m */}
+      <Header size="s" subtitle="SOHN — Conrad" />
+      {/* замена Regular secondary на s */}
+      <Header size="s" subtitle="SOHN — Conrad" />
     </React.Fragment>)
   );
 };"
diff --git a/packages/codemods/src/transforms/v7/header.ts b/packages/codemods/src/transforms/v7/header.ts
index bb89e39ad0..766c8d4d46 100644
--- a/packages/codemods/src/transforms/v7/header.ts
+++ b/packages/codemods/src/transforms/v7/header.ts
@@ -1,10 +1,92 @@
-import { API, FileInfo } from 'jscodeshift';
+import {
+  API,
+  Collection,
+  FileInfo,
+  JSCodeshift,
+  JSXAttribute,
+  JSXSpreadAttribute,
+} from 'jscodeshift';
+import { report } from '../../report';
 import { remapSizePropValue } from './common/remapSizePropValue';
-import { getImportInfo, renameProp } from '../../codemod-helpers';
+import { getImportInfo, removeAttribute, renameProp } from '../../codemod-helpers';
 import { JSCodeShiftOptions } from '../../types';
 
 export const parser = 'tsx';
 
+function removePropMode(j: JSCodeshift, api: API, source: Collection, localName: string) {
+  const getValueFromAttribute = (attr: JSXAttribute): string | null => {
+    if (attr.value?.type === 'StringLiteral') {
+      return attr.value.value;
+    }
+    if (attr.value?.type === 'JSXExpressionContainer') {
+      const expression = attr.value.expression;
+      if (expression.type === 'StringLiteral') {
+        return expression.value;
+      }
+    }
+    return null;
+  };
+
+  const changeAttributeValue = (
+    attributes: Array<JSXAttribute | JSXSpreadAttribute> | undefined,
+    attribute: JSXAttribute | undefined,
+    attrName: string,
+    newValue: string,
+  ) => {
+    if (attribute) {
+      attribute.value = j.stringLiteral(newValue);
+    } else {
+      attributes?.push(j.jsxAttribute(j.jsxIdentifier(attrName), j.stringLiteral(newValue)));
+    }
+  };
+
+  source
+    .find(j.JSXOpeningElement, {
+      name: {
+        name: localName,
+      },
+    })
+    .forEach((path) => {
+      const attributes = path.node.attributes;
+      const modeAttr =
+        (attributes?.find(
+          (attr) => attr.type === 'JSXAttribute' && attr.name.name === 'mode',
+        ) as JSXAttribute) || undefined;
+      const sizeAttr =
+        (attributes?.find(
+          (attr) => attr.type === 'JSXAttribute' && attr.name.name === 'size',
+        ) as JSXAttribute) || undefined;
+      const hasSpread = !!attributes?.some((attr) => attr.type === 'JSXSpreadAttribute');
+      if (!modeAttr) {
+        if (hasSpread) {
+          report(
+            api,
+            `: ${localName} has been changed. Manual changes required: remove mode attribute and replace it by size prop`,
+          );
+        }
+        return;
+      }
+      removeAttribute(attributes, modeAttr);
+      const modeValue = getValueFromAttribute(modeAttr);
+      if (!modeValue) {
+        report(
+          api,
+          `: ${localName} has been changed. Manual changes required: remove mode attribute and replace it by size prop`,
+        );
+        return;
+      }
+      const sizeValue = getValueFromAttribute(sizeAttr);
+
+      if (modeValue === 'primary' && sizeValue === 'l') {
+        changeAttributeValue(attributes, sizeAttr, 'size', 'xl');
+      } else if (modeValue === 'tertiary' || (modeValue === 'primary' && sizeValue === 'm')) {
+        changeAttributeValue(attributes, sizeAttr, 'size', 'm');
+      } else if (modeValue === 'secondary') {
+        changeAttributeValue(attributes, sizeAttr, 'size', 's');
+      }
+    });
+}
+
 export default function transformer(file: FileInfo, api: API, options: JSCodeShiftOptions) {
   const { alias } = options;
   const j = api.jscodeshift;
@@ -27,5 +109,7 @@ export default function transformer(file: FileInfo, api: API, options: JSCodeShi
 
   renameProp(j, source, localName, { aside: 'after' });
 
+  removePropMode(j, api, source, localName);
+
   return source.toSource();
 }
diff --git a/packages/vkui/src/components/Avatar/Readme.md b/packages/vkui/src/components/Avatar/Readme.md
index f16b90476f..465ee4f8a8 100644
--- a/packages/vkui/src/components/Avatar/Readme.md
+++ b/packages/vkui/src/components/Avatar/Readme.md
@@ -10,7 +10,7 @@
 ```jsx
 const Default = () => {
   return (
-    <Group header={<Header mode="secondary">По умолчанию</Header>}>
+    <Group header={<Header size="s">По умолчанию</Header>}>
       <SimpleCell before={<Avatar src={getAvatarUrl('user_id34')} />}>Татьяна Плуталова</SimpleCell>
     </Group>
   );
@@ -19,7 +19,7 @@ const Default = () => {
 const Fallbacks = () => {
   return (
     <Group
-      header={<Header mode="secondary">Фолбеки</Header>}
+      header={<Header size="s">Фолбеки</Header>}
       description="На случаи если аватарка не загрузилась или она отсутсвует"
     >
       <SimpleCell
@@ -48,7 +48,7 @@ const OthersFeatures = () => {
   const [overlay, setOverlay] = React.useState();
 
   return (
-    <Group header={<Header mode="secondary">Другие возможности</Header>}>
+    <Group header={<Header size="s">Другие возможности</Header>}>
       <AvatarPropsForm
         onUseInisitals={setUseInisitals}
         onGradientColorChange={setGradientColorChange}
diff --git a/packages/vkui/src/components/Badge/Readme.md b/packages/vkui/src/components/Badge/Readme.md
index 5bea7e877c..fbfaed3eb4 100644
--- a/packages/vkui/src/components/Badge/Readme.md
+++ b/packages/vkui/src/components/Badge/Readme.md
@@ -13,7 +13,7 @@ const Example = () => {
       <Panel id="badge">
         <PanelHeader>Бейдж</PanelHeader>
 
-        <Group header={<Header mode="secondary">В пунктах меню</Header>}>
+        <Group header={<Header size="s">В пунктах меню</Header>}>
           <Cell
             chevron
             before={<Icon28Notifications />}
@@ -24,7 +24,7 @@ const Example = () => {
           </Cell>
         </Group>
 
-        <Group header={<Header mode="secondary">В переключателях</Header>}>
+        <Group header={<Header size="s">В переключателях</Header>}>
           <Tabs>
             <TabsItem
               selected={tab === 'dialogs'}
diff --git a/packages/vkui/src/components/Card/Readme.md b/packages/vkui/src/components/Card/Readme.md
index eee2565232..4f6bf95279 100644
--- a/packages/vkui/src/components/Card/Readme.md
+++ b/packages/vkui/src/components/Card/Readme.md
@@ -8,21 +8,21 @@
   <Panel id="card">
     <PanelHeader>Card</PanelHeader>
     <Group>
-      <Group mode="plain" header={<Header mode="secondary">Дефолтный стиль</Header>}>
+      <Group mode="plain" header={<Header size="s">Дефолтный стиль</Header>}>
         <CardGrid size="l">
           <Card>
             <div style={{ height: 96 }} />
           </Card>
         </CardGrid>
       </Group>
-      <Group mode="plain" header={<Header mode="secondary">С внутренней обводкой</Header>}>
+      <Group mode="plain" header={<Header size="s">С внутренней обводкой</Header>}>
         <CardGrid size="l">
           <Card mode="outline">
             <div style={{ height: 96 }} />
           </Card>
         </CardGrid>
       </Group>
-      <Group mode="plain" header={<Header mode="secondary">С внешней тенью</Header>}>
+      <Group mode="plain" header={<Header size="s">С внешней тенью</Header>}>
         <CardGrid size="l">
           <Card mode="shadow">
             <div style={{ height: 96 }} />
@@ -31,7 +31,7 @@
       </Group>
       <Group
         mode="plain"
-        header={<Header mode="secondary">С внутренней обводкой и дефолтным фоном</Header>}
+        header={<Header size="s">С внутренней обводкой и дефолтным фоном</Header>}
       >
         <CardGrid size="l">
           <Card mode="outline-tint">
diff --git a/packages/vkui/src/components/CellButton/Readme.md b/packages/vkui/src/components/CellButton/Readme.md
index 7b17accaa2..7114c78622 100644
--- a/packages/vkui/src/components/CellButton/Readme.md
+++ b/packages/vkui/src/components/CellButton/Readme.md
@@ -2,13 +2,13 @@
 <View activePanel="button">
   <Panel id="button">
     <PanelHeader>CellButton</PanelHeader>
-    <Group header={<Header mode="secondary">Базовый пример</Header>}>
+    <Group header={<Header size="s">Базовый пример</Header>}>
       <CellButton onClick={() => {}}>Добавить новую школу</CellButton>
       <CellButton onClick={() => {}} appearance="negative">
         Удалить беседу
       </CellButton>
     </Group>
-    <Group header={<Header mode="secondary">Иконки</Header>}>
+    <Group header={<Header size="s">Иконки</Header>}>
       <CellButton onClick={() => {}} before={<Icon28AddOutline />}>
         Добавить родственника
       </CellButton>
@@ -16,7 +16,7 @@
         Удалить беседу
       </CellButton>
     </Group>
-    <Group header={<Header mode="secondary">Аватарки</Header>}>
+    <Group header={<Header size="s">Аватарки</Header>}>
       <CellButton
         onClick={() => {}}
         before={
@@ -48,7 +48,7 @@
         Создать плейлист
       </CellButton>
     </Group>
-    <Group header={<Header mode="secondary">Центрирование</Header>}>
+    <Group header={<Header size="s">Центрирование</Header>}>
       <CellButton onClick={() => {}} centered before={<Icon24Add />}>
         Создать беседу
       </CellButton>
diff --git a/packages/vkui/src/components/Counter/Readme.md b/packages/vkui/src/components/Counter/Readme.md
index 815a5ca194..f11f7d1cc2 100644
--- a/packages/vkui/src/components/Counter/Readme.md
+++ b/packages/vkui/src/components/Counter/Readme.md
@@ -14,7 +14,7 @@ const Example = () => {
     <View activePanel="counter-demo">
       <Panel id="counter-demo">
         <PanelHeader>Counter</PanelHeader>
-        <Group header={<Header mode="secondary">Счётчики в ячейках</Header>}>
+        <Group header={<Header size="s">Счётчики в ячейках</Header>}>
           <List>
             <Cell before={<Icon28UserOutline />} indicator={<Counter>4</Counter>}>
               Друзья
@@ -40,7 +40,7 @@ const Example = () => {
             </Cell>
           </List>
         </Group>
-        <Group header={<Header mode="secondary">Счётчики в кнопках</Header>}>
+        <Group header={<Header size="s">Счётчики в кнопках</Header>}>
           <FormItem>
             <Button mode="secondary" size="m" after={<Counter>16</Counter>}>
               Secondary medium
@@ -85,7 +85,7 @@ const Example = () => {
           <Cell before={<Avatar />}>Виктор Пелевин</Cell>
           <Cell before={<Avatar />}>Михаил Зыгарь</Cell>
         </Group>
-        <Group header={<Header mode="secondary">В переключателях</Header>}>
+        <Group header={<Header size="s">В переключателях</Header>}>
           <Tabs mode="buttons">
             <HorizontalScroll>
               <TabsItem
diff --git a/packages/vkui/src/components/CustomScrollView/Readme.md b/packages/vkui/src/components/CustomScrollView/Readme.md
index d6044024bf..60e5d846f1 100644
--- a/packages/vkui/src/components/CustomScrollView/Readme.md
+++ b/packages/vkui/src/components/CustomScrollView/Readme.md
@@ -50,10 +50,10 @@ const Example = () => {
     <View activePanel="customScrollView">
       <Panel id="customScrollView">
         <PanelHeader>CustomScrollView</PanelHeader>
-        <Group header={<Header mode="secondary">Вертикальный скролл</Header>}>
+        <Group header={<Header size="s">Вертикальный скролл</Header>}>
           <WithVerticalScroll />
         </Group>
-        <Group header={<Header mode="secondary">Горизонтальный скролл</Header>}>
+        <Group header={<Header size="s">Горизонтальный скролл</Header>}>
           <WithHorizontalScroll />
         </Group>
       </Panel>
diff --git a/packages/vkui/src/components/Gallery/Readme.md b/packages/vkui/src/components/Gallery/Readme.md
index fed052ba50..1eea3c46d5 100644
--- a/packages/vkui/src/components/Gallery/Readme.md
+++ b/packages/vkui/src/components/Gallery/Readme.md
@@ -14,14 +14,14 @@ const Example = () => {
     <View activePanel="gallery">
       <Panel nav="gallery">
         <PanelHeader>Gallery</PanelHeader>
-        <Group header={<Header mode="secondary">Sticks right</Header>}>
+        <Group header={<Header size="s">Sticks right</Header>}>
           <Gallery slideWidth="90%" bullets="dark">
             <div style={{ backgroundColor: 'var(--vkui--color_background_negative)' }} />
             <img src="https://placebear.com/1024/640" style={{ display: 'block' }} />
             <div style={{ backgroundColor: 'var(--vkui--color_background_accent)' }} />
           </Gallery>
         </Group>
-        <Group header={<Header mode="secondary">Sticks left</Header>}>
+        <Group header={<Header size="s">Sticks left</Header>}>
           <Gallery slideWidth="90%" align="right">
             <div
               style={{
@@ -33,14 +33,14 @@ const Example = () => {
             <div style={{ backgroundColor: 'var(--vkui--color_background_accent)' }} />
           </Gallery>
         </Group>
-        <Group header={<Header mode="secondary">Centered</Header>}>
+        <Group header={<Header size="s">Centered</Header>}>
           <Gallery slideWidth="90%" align="center">
             <div style={{ backgroundColor: 'var(--vkui--color_background_negative)' }} />
             <div style={{ backgroundColor: 'var(--vkui--color_background_positive)' }} />
             <div style={{ backgroundColor: 'var(--vkui--color_background_accent)' }} />
           </Gallery>
         </Group>
-        <Group header={<Header mode="secondary">Custom width</Header>}>
+        <Group header={<Header size="s">Custom width</Header>}>
           <Gallery slideWidth="custom" style={{ height: 150 }}>
             <div
               style={{
@@ -68,14 +68,14 @@ const Example = () => {
             />
           </Gallery>
         </Group>
-        <Group header={<Header mode="secondary">Arrows</Header>}>
+        <Group header={<Header size="s">Arrows</Header>}>
           <Gallery slideWidth="90%" style={{ height: 150 }} bullets="dark" showArrows>
             <div style={{ backgroundColor: 'var(--vkui--color_background_negative)' }} />
             <div style={{ backgroundColor: 'var(--vkui--color_background_positive)' }} />
             <div style={{ backgroundColor: 'var(--vkui--color_background_accent)' }} />
           </Gallery>
         </Group>
-        <Group header={<Header mode="secondary">Controlled</Header>}>
+        <Group header={<Header size="s">Controlled</Header>}>
           <Gallery
             slideWidth="90%"
             align="center"
@@ -104,7 +104,7 @@ const Example = () => {
             </Button>
           </FormItem>
         </Group>
-        <Group header={<Header mode="secondary">With looped prop</Header>}>
+        <Group header={<Header size="s">With looped prop</Header>}>
           <Gallery slideWidth="90%" style={{ height: 150 }} bullets="dark" showArrows looped>
             <Slide backgroundColor="var(--vkui--color_background_negative)">1</Slide>
             <Slide backgroundColor="var(--vkui--color_background_positive)">2</Slide>
diff --git a/packages/vkui/src/components/Gradient/Readme.md b/packages/vkui/src/components/Gradient/Readme.md
index 3660f706ce..ef6627d985 100644
--- a/packages/vkui/src/components/Gradient/Readme.md
+++ b/packages/vkui/src/components/Gradient/Readme.md
@@ -34,7 +34,7 @@ const Example = () => {
             </CellButton>
           </Group>
         </Group>
-        <Group mode="plain" header={<Header mode="secondary">Направление to="bottom"</Header>}>
+        <Group mode="plain" header={<Header size="s">Направление to="bottom"</Header>}>
           <Gradient mode="tint" to="bottom">
             <Div>
               Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed a sollicitudin lectus, a
diff --git a/packages/vkui/src/components/Group/Readme.md b/packages/vkui/src/components/Group/Readme.md
index 9801ff9043..2b6e216f10 100644
--- a/packages/vkui/src/components/Group/Readme.md
+++ b/packages/vkui/src/components/Group/Readme.md
@@ -45,7 +45,7 @@ const Example = () => {
 
             <SharedContent />
 
-            <Group header={<Header mode="secondary">Модальное окно с Group</Header>}>
+            <Group header={<Header size="s">Модальное окно с Group</Header>}>
               <SimpleCell onClick={() => setModalOpened(true)}>
                 Открыть Group в модальном окне
               </SimpleCell>
@@ -180,8 +180,8 @@ const SharedContent = () => {
 ```jsx
 const recentFriends = getRandomUsers(20);
 
-<Group header={<Header mode="secondary">Недавние</Header>}>
-  <Header mode="primary">HorizontalScroll не учитывает отступы Group по горизонтали</Header>
+<Group header={<Header size="s">Недавние</Header>}>
+  <Header>HorizontalScroll не учитывает отступы Group по горизонтали</Header>
 
   <Group.ExpandedContent direction="inline">
     <HorizontalScroll showArrows>
@@ -195,7 +195,7 @@ const recentFriends = getRandomUsers(20);
     </HorizontalScroll>
   </Group.ExpandedContent>
 
-  <Header mode="primary">Здесь контент учитывает отступы Group по горизонтали</Header>
+  <Header>Здесь контент учитывает отступы Group по горизонтали</Header>
   <HorizontalScroll showArrows>
     {recentFriends.map((item) => {
       return (
diff --git a/packages/vkui/src/components/Group/__image_snapshots__/group-android-chromium-dark-1-snap.png b/packages/vkui/src/components/Group/__image_snapshots__/group-android-chromium-dark-1-snap.png
index d096f1d53e..cdf6ad616c 100644
--- a/packages/vkui/src/components/Group/__image_snapshots__/group-android-chromium-dark-1-snap.png
+++ b/packages/vkui/src/components/Group/__image_snapshots__/group-android-chromium-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:e2db93987d879f3bbcf7b149d7cdf9507e61664535690e61516d715527baa2e2
-size 28403
+oid sha256:50e9eb28351401b44a1668037bc881232e3da0b1157954d5613234e870c8000f
+size 25314
diff --git a/packages/vkui/src/components/Group/__image_snapshots__/group-android-chromium-light-1-snap.png b/packages/vkui/src/components/Group/__image_snapshots__/group-android-chromium-light-1-snap.png
index 713655218d..9815abe6e8 100644
--- a/packages/vkui/src/components/Group/__image_snapshots__/group-android-chromium-light-1-snap.png
+++ b/packages/vkui/src/components/Group/__image_snapshots__/group-android-chromium-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:6c692d7b01d9ea885183f3115679bae502dd4a7aa45ed2b11337463a9b44e641
-size 27344
+oid sha256:09fa0173d067a920900e7e226c91dc44b8e69f003ab8641f605b799daf673cae
+size 24498
diff --git a/packages/vkui/src/components/Group/__image_snapshots__/group-ios-webkit-dark-1-snap.png b/packages/vkui/src/components/Group/__image_snapshots__/group-ios-webkit-dark-1-snap.png
index e925abe6cf..ee065be38f 100644
--- a/packages/vkui/src/components/Group/__image_snapshots__/group-ios-webkit-dark-1-snap.png
+++ b/packages/vkui/src/components/Group/__image_snapshots__/group-ios-webkit-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:9f921ddad42a5af023a2880963f865f9d528525edf8f62c0b97247d8d7524df1
-size 25659
+oid sha256:3f1df819ce627d618639e04e26ab5faa191211150da987fc20768bda07c6bb97
+size 25532
diff --git a/packages/vkui/src/components/Group/__image_snapshots__/group-ios-webkit-light-1-snap.png b/packages/vkui/src/components/Group/__image_snapshots__/group-ios-webkit-light-1-snap.png
index 17d1b025ad..a5ed2c72af 100644
--- a/packages/vkui/src/components/Group/__image_snapshots__/group-ios-webkit-light-1-snap.png
+++ b/packages/vkui/src/components/Group/__image_snapshots__/group-ios-webkit-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:16ad3382c97e62c16a9cff31d34c7c6d72235c489699f3b05da965683e65f1fb
-size 24898
+oid sha256:7fbced186bbb88f0b7979f8d79bf648c09df6e5a3288b0f79a24fc67a00dd8c4
+size 24669
diff --git a/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-chromium-dark-1-snap.png b/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-chromium-dark-1-snap.png
index 0eb99a7d27..2f36094a17 100644
--- a/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-chromium-dark-1-snap.png
+++ b/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-chromium-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:0623e79f9713e2d4d197e95590294a32679c09ebed3412e9c36d8fa19e148e2b
-size 26110
+oid sha256:44b9f00953f4e7cc9b147be307037db4169121681aaf76703c8e40ec9d22f291
+size 26044
diff --git a/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-chromium-light-1-snap.png b/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-chromium-light-1-snap.png
index 1d8bc637bb..8da653b89f 100644
--- a/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-chromium-light-1-snap.png
+++ b/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-chromium-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:ddc3cb314350f7803fb173c7e769226ad844f91a20bc3164362d36172eb4cfd2
-size 28982
+oid sha256:96c94dc351325253c9b6e23fc1d564e6127a274489fc23fd8712776336f844c1
+size 26104
diff --git a/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-firefox-dark-1-snap.png b/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-firefox-dark-1-snap.png
index 39d1d2bffd..f995f4da82 100644
--- a/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-firefox-dark-1-snap.png
+++ b/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-firefox-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:5bf02d447e327fb8eac82e587658b79d2e8f3284f5512b3fe3960e3eb913d6ba
-size 38936
+oid sha256:bbb1d0441f526bbb90138d97ac9a4f9aaba1e077736c0de50ed683d15bf9adab
+size 38764
diff --git a/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-firefox-light-1-snap.png b/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-firefox-light-1-snap.png
index 057eca003d..2f362e659b 100644
--- a/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-firefox-light-1-snap.png
+++ b/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-firefox-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:becd0aaa1166864da38fb9a304bf607b9b8b9d5b794f3d0341b7acc1f4606a41
-size 37998
+oid sha256:8209463c03c0f8017375fe678f41d93553ae74b10ab298da8e8e494221eb95c5
+size 38053
diff --git a/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-webkit-dark-1-snap.png b/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-webkit-dark-1-snap.png
index 85318f928e..df548990e1 100644
--- a/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-webkit-dark-1-snap.png
+++ b/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-webkit-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:2251ed7ba8243d1496887277468c2081e4868175a0b22b40fe7a398791d573bd
-size 26448
+oid sha256:85f8501bb38b40c2a92dbfa3370c460a5aa0e76f51d313636ad290465e7892b0
+size 26381
diff --git a/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-webkit-light-1-snap.png b/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-webkit-light-1-snap.png
index 4cef137ceb..6386b559cc 100644
--- a/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-webkit-light-1-snap.png
+++ b/packages/vkui/src/components/Group/__image_snapshots__/group-vkcom-webkit-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:9c1080eab4cc26d728473fb4f9e1f2e56dee9de88487db56a58a4a4cd321901a
-size 26367
+oid sha256:34d3bf1fefc5f8dc9a65dc5b5234b998481bc194939ba7a05f329493c983b37f
+size 26334
diff --git a/packages/vkui/src/components/Header/Header.e2e-playground.tsx b/packages/vkui/src/components/Header/Header.e2e-playground.tsx
index 1c390e8d2d..f84f89289c 100644
--- a/packages/vkui/src/components/Header/Header.e2e-playground.tsx
+++ b/packages/vkui/src/components/Header/Header.e2e-playground.tsx
@@ -16,20 +16,20 @@ export const HeaderPlayground = (props: ComponentPlaygroundProps) => {
       {...props}
       propSets={[
         {
-          mode: ['primary', 'secondary', 'tertiary'],
+          size: ['s', 'm', 'l', 'xl'],
           children: ['Кто может оставлять записи на моей странице'],
           multiline: [undefined, true],
         },
         {
-          mode: ['primary'],
+          size: ['m'],
           after: [<Link key="link">Показать все</Link>],
         },
         {
-          mode: ['primary', 'secondary'],
+          size: ['s', 'm', 'l', 'xl'],
           subtitle: ['SOHN — Conrad'],
         },
         {
-          mode: ['primary'],
+          size: ['m'],
           indicator: [
             12,
             <Counter key="counter" size="s" mode="prominent">
@@ -38,13 +38,13 @@ export const HeaderPlayground = (props: ComponentPlaygroundProps) => {
           ],
         },
         {
-          mode: ['primary'],
+          size: ['m'],
           subtitle: ['SOHN — Conrad'],
           after: [<Link key="link">Показать все</Link>],
           indicator: [12],
         },
         {
-          mode: ['secondary', 'tertiary'],
+          size: ['m'],
           indicator: [
             12,
             <Counter key="counter" size="s" mode="prominent">
@@ -53,40 +53,36 @@ export const HeaderPlayground = (props: ComponentPlaygroundProps) => {
           ],
         },
         {
-          mode: ['primary'],
-          size: ['m', 'l'],
-        },
-        {
-          mode: ['primary'],
+          size: ['m'],
           children: ['Кто может оставлять записи на моей странице'],
           before: [<Icon28UserCircleFillBlue key="user" />],
         },
         {
-          mode: ['primary'],
+          size: ['m'],
           children: ['Кто может оставлять записи на моей странице'],
           beforeTitle: [<Icon16LockOutline key="beforeTitle" />],
         },
         {
-          mode: ['primary'],
+          size: ['m'],
           children: ['Кто может оставлять записи на моей странице'],
           afterTitle: [<Icon16UnlockOutline key="afterTitle" />],
           multiline: [undefined, true],
         },
         {
-          mode: ['primary'],
+          size: ['m'],
           children: ['Кто может оставлять записи на моей странице'],
           subtitle: ['SOHN — Conrad'],
           beforeSubtitle: [<Icon12Tag key="beforeSubtitle" />],
         },
         {
-          mode: ['primary'],
+          size: ['m'],
           children: ['Кто может оставлять записи на моей странице'],
           subtitle: ['SOHN — Conrad'],
           afterSubtitle: [<Icon12Fire key="afterSubtitle" />],
           multiline: [undefined, true],
         },
         {
-          mode: ['primary', 'secondary', 'tertiary'],
+          size: ['s', 'm', 'l', 'xl'],
           children: ['Кто может оставлять записи на моей странице'],
           before: [<Icon28UserCircleFillBlue key="user" />],
           beforeTitle: [<Icon16LockOutline key="beforeTitle" />],
diff --git a/packages/vkui/src/components/Header/Header.module.css b/packages/vkui/src/components/Header/Header.module.css
index 8db401f919..e6987c15f5 100644
--- a/packages/vkui/src/components/Header/Header.module.css
+++ b/packages/vkui/src/components/Header/Header.module.css
@@ -75,8 +75,7 @@
   color: var(--vkui--color_text_secondary);
 }
 
-.modeSecondary:not(.pi):not(.withSubtitle) .main,
-.modeTertiary .main {
+.sizeS .contentIn {
   color: var(--vkui--color_text_secondary);
 }
 
@@ -86,18 +85,10 @@
   flex-shrink: 0;
 }
 
-.modePrimary .indicator {
-  color: var(--vkui--color_text_subhead);
-}
-
 .host:not(.pi) .indicator {
   align-self: center;
 }
 
-.modeSecondary .indicator {
-  margin-inline-start: 8px;
-}
-
 .after {
   display: flex;
   white-space: nowrap;
@@ -109,6 +100,22 @@
   margin-inline-start: 12px;
 }
 
+.sizeS .after.after > * {
+  margin-block-start: 11px;
+}
+
+.sizeM .after.after > * {
+  margin-block-start: 13px;
+}
+
+.sizeL .after.after > * {
+  margin-block-start: 14px;
+}
+
+.sizeXl .after.after > * {
+  margin-block-start: 16px;
+}
+
 /* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
 .after > :global(.vkuiIcon) {
   position: relative;
@@ -116,17 +123,37 @@
 }
 
 /* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
-.after > :global(.vkuiIcon--24) {
+.sizeS .after > :global(.vkuiIcon--24) {
+  margin-block: 9px 5px;
+}
+/* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
+.sizeM .after > :global(.vkuiIcon--24) {
+  margin-block: 10px 5px;
+}
+/* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
+.sizeL .after > :global(.vkuiIcon--24) {
   margin-block: 11px 5px;
 }
+/* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
+.sizeXl .after > :global(.vkuiIcon--24) {
+  margin-block: 12px 5px;
+}
 
 /* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
-.after > :global(.vkuiIcon--16) {
+.sizeS .after > :global(.vkuiIcon--16) {
+  margin-block: 13px 9px;
+}
+/* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
+.sizeM .after > :global(.vkuiIcon--16) {
+  margin-block: 14px 9px;
+}
+/* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
+.sizeL .after > :global(.vkuiIcon--16) {
   margin-block: 15px 9px;
 }
-
-.modePrimary {
-  padding-block: 3px 1px;
+/* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
+.sizeXl .after > :global(.vkuiIcon--16) {
+  margin-block: 16px 9px;
 }
 
 .content {
@@ -137,27 +164,10 @@
   margin-block-end: 8px;
 }
 
-.modeTertiary .content {
-  margin-block-start: 15px;
-}
-
-.modeTertiary .content:last-child {
-  margin-block-end: 9px;
-}
-
 .subtitleWrapper {
   margin-block-end: 7px;
 }
 
-/* Компенсируем 1 пиксель из-за паддинга в .modePrimary */
-.modePrimary .subtitleWrapper {
-  margin-block-end: 6px;
-}
-
-.large .content {
-  margin-block: 10px 6px;
-}
-
 /**
  * CMP:
  * Group
@@ -184,20 +194,20 @@
 }
 
 /* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
-:global(.vkuiInternalGroup--mode-card) > .host:not(.modeTertiary):first-child,
+:global(.vkuiInternalGroup--mode-card) > .host:not(.sizeM):first-child,
 :global(.vkuiInternalGroup--mode-card)
   > :global(.vkuiInternalTappable):first-child
-  > .host:not(.modeTertiary) {
+  > .host:not(.sizeM) {
   margin-block-start: calc(-1 * var(--vkui--spacing_size_xs));
 }
 
 @media (--sizeX-regular) {
   /* stylelint-disable-next-line selector-pseudo-class-disallowed-list */
   :global(.vkuiInternalGroup--sizeX-none.vkuiInternalGroup--mode-none)
-    > .host:not(.modeTertiary):first-child,
+    > .host:not(.sizeM):first-child,
   :global(.vkuiInternalGroup--sizeX-none.vkuiInternalGroup--mode-none)
     > :global(.vkuiInternalTappable):first-child
-    > .host:not(.modeTertiary) {
+    > .host:not(.sizeM) {
     margin-block-start: calc(-1 * var(--vkui--spacing_size_xs));
   }
 }
diff --git a/packages/vkui/src/components/Header/Header.stories.tsx b/packages/vkui/src/components/Header/Header.stories.tsx
index 9e13e0efbd..a911dc5888 100644
--- a/packages/vkui/src/components/Header/Header.stories.tsx
+++ b/packages/vkui/src/components/Header/Header.stories.tsx
@@ -33,7 +33,7 @@ const story: Meta<HeaderProps> = {
       requiredIcons: ['Icon12Fire'],
     }),
     after: createFieldWithPresets({
-      iconSizes: [],
+      iconSizes: ['16', '24'],
       additionalPresets: {
         Link: <Link>Показать все</Link>,
       },
@@ -114,6 +114,6 @@ export const WithAllFeatures: Story = {
     beforeSubtitle: 'Icon12Tag',
     afterSubtitle: 'Icon12Fire',
     subtitle: 'SOHN — Conrad',
-    after: <Link>Показать все</Link>,
+    after: 'Link',
   },
 };
diff --git a/packages/vkui/src/components/Header/Header.test.tsx b/packages/vkui/src/components/Header/Header.test.tsx
index 4cc8a9cfb7..1fd300fbb9 100644
--- a/packages/vkui/src/components/Header/Header.test.tsx
+++ b/packages/vkui/src/components/Header/Header.test.tsx
@@ -9,100 +9,72 @@ const getTypographyTagNameByText = (text: string) => screen.getByText(text).tagN
 describe('Header', () => {
   baselineComponent((props) => <Header {...props}>Title</Header>);
 
-  it('[typography] HeaderContent is h2 on ANDROID regardless of mode and size', () => {
+  it('[typography] HeaderContent is h2 on ANDROID regardless size', () => {
     render(
       <ConfigProvider platform="android">
-        <Header mode="primary">Русский</Header>
-        <Header mode="secondary">English</Header>
-        <Header mode="tertiary">Espanõl</Header>
-        <Header mode="primary" size="l">
-          Français
-        </Header>
-        <Header mode="secondary" size="l">
-          Deutsch
-        </Header>
-        <Header mode="tertiary" size="l">
-          中國人
-        </Header>
+        <Header size="s">Русский</Header>
+        <Header size="m">English</Header>
+        <Header size="l">Espanõl</Header>
+        <Header size="xl">Français</Header>
       </ConfigProvider>,
     );
     expect(screen.getByText('Русский').parentElement?.tagName.toLowerCase()).toMatch('h2');
     expect(screen.getByText('English').parentElement?.tagName.toLowerCase()).toMatch('h2');
     expect(screen.getByText('Espanõl').parentElement?.tagName.toLowerCase()).toMatch('h2');
     expect(screen.getByText('Français').parentElement?.tagName.toLowerCase()).toMatch('h2');
-    expect(screen.getByText('Deutsch').parentElement?.tagName.toLowerCase()).toMatch('h2');
-    expect(screen.getByText('中國人').parentElement?.tagName.toLowerCase()).toMatch('h2');
   });
 
-  it('[typography] HeaderContent is h2 on IOS regardless of mode and size', () => {
+  it('[typography] HeaderContent is h2 on IOS regardless of size', () => {
     render(
       <ConfigProvider platform="ios">
-        <Header mode="primary">Русский</Header>
-        <Header mode="secondary">English</Header>
-        <Header mode="tertiary">Espanõl</Header>
-        <Header mode="primary" size="l">
-          Français
-        </Header>
-        <Header mode="secondary" size="l">
-          Deutsch
-        </Header>
-        <Header mode="tertiary" size="l">
-          中國人
-        </Header>
+        <Header size="s">Русский</Header>
+        <Header size="m">English</Header>
+        <Header size="l">Espanõl</Header>
+        <Header size="xl">Français</Header>
       </ConfigProvider>,
     );
     expect(screen.getByText('Русский').parentElement?.tagName.toLowerCase()).toMatch('h2');
     expect(screen.getByText('English').parentElement?.tagName.toLowerCase()).toMatch('h2');
     expect(screen.getByText('Espanõl').parentElement?.tagName.toLowerCase()).toMatch('h2');
     expect(screen.getByText('Français').parentElement?.tagName.toLowerCase()).toMatch('h2');
-    expect(screen.getByText('Deutsch').parentElement?.tagName.toLowerCase()).toMatch('h2');
-    expect(screen.getByText('中國人').parentElement?.tagName.toLowerCase()).toMatch('h2');
   });
 
-  it('[typography] HeaderContent is h2 on VKCOM regardless of mode and size', () => {
+  it('[typography] HeaderContent is h2 on VKCOM regardless of size', () => {
     render(
       <ConfigProvider platform="vkcom">
-        <Header mode="primary">Русский</Header>
-        <Header mode="secondary">English</Header>
-        <Header mode="tertiary">Espanõl</Header>
-        <Header mode="primary" size="l">
-          Français
-        </Header>
-        <Header mode="secondary" size="l">
-          Deutsch
-        </Header>
-        <Header mode="tertiary" size="l">
-          中國人
-        </Header>
+        <Header size="s">Русский</Header>
+        <Header size="m">English</Header>
+        <Header size="l">Espanõl</Header>
+        <Header size="xl">Français</Header>
       </ConfigProvider>,
     );
     expect(screen.getByText('Русский').parentElement?.tagName.toLowerCase()).toMatch('h2');
     expect(screen.getByText('English').parentElement?.tagName.toLowerCase()).toMatch('h2');
     expect(screen.getByText('Espanõl').parentElement?.tagName.toLowerCase()).toMatch('h2');
     expect(screen.getByText('Français').parentElement?.tagName.toLowerCase()).toMatch('h2');
-    expect(screen.getByText('Deutsch').parentElement?.tagName.toLowerCase()).toMatch('h2');
-    expect(screen.getByText('中國人').parentElement?.tagName.toLowerCase()).toMatch('h2');
   });
 
-  it('[typography] HeaderSubtitle is span by default regardless of mode', () => {
+  it('[typography] HeaderSubtitle is span by default regardless of size', () => {
     render(
       <Fragment>
-        <Header mode="primary" subtitle="Русский" />
-        <Header mode="secondary" subtitle="English" />
-        <Header mode="tertiary" subtitle="Espanõl" />
+        <Header size="s" subtitle="Русский" />
+        <Header size="m" subtitle="English" />
+        <Header size="l" subtitle="Espanõl" />
+        <Header size="xl" subtitle="Français" />
       </Fragment>,
     );
     expect(getTypographyTagNameByText('Русский')).toMatch('span');
     expect(getTypographyTagNameByText('English')).toMatch('span');
     expect(getTypographyTagNameByText('Espanõl')).toMatch('span');
+    expect(getTypographyTagNameByText('Français')).toMatch('span');
   });
 
-  it('[typography] HeaderSubtitle is h3 with subtitleComponent prop regardless of mode', () => {
+  it('[typography] HeaderSubtitle is h3 with subtitleComponent prop regardless of size', () => {
     render(
       <Fragment>
-        <Header mode="primary" subtitle="Русский" subtitleComponent="h3" />
-        <Header mode="secondary" subtitle="English" subtitleComponent="h3" />
-        <Header mode="tertiary" subtitle="Espanõl" subtitleComponent="h3" />
+        <Header size="s" subtitle="Русский" subtitleComponent="h3" />
+        <Header size="s" subtitle="English" subtitleComponent="h3" />
+        <Header size="s" subtitle="Espanõl" subtitleComponent="h3" />
       </Fragment>,
     );
     expect(getTypographyTagNameByText('Русский')).toMatch('h3');
diff --git a/packages/vkui/src/components/Header/Header.tsx b/packages/vkui/src/components/Header/Header.tsx
index bbf73c2a03..91a55a51c1 100644
--- a/packages/vkui/src/components/Header/Header.tsx
+++ b/packages/vkui/src/components/Header/Header.tsx
@@ -2,9 +2,9 @@
 
 import * as React from 'react';
 import { classNames, hasReactNode, isPrimitiveReactNode } from '@vkontakte/vkjs';
-import { usePlatform } from '../../hooks/usePlatform';
 import type { HasComponent, HTMLAttributesWithRootRef } from '../../types';
 import { RootComponent } from '../RootComponent/RootComponent';
+import { Caption } from '../Typography/Caption/Caption';
 import { Footnote } from '../Typography/Footnote/Footnote';
 import { Headline } from '../Typography/Headline/Headline';
 import { Paragraph } from '../Typography/Paragraph/Paragraph';
@@ -13,8 +13,7 @@ import { Title } from '../Typography/Title/Title';
 import styles from './Header.module.css';
 
 export interface HeaderProps extends HTMLAttributesWithRootRef<HTMLElement>, HasComponent {
-  mode?: 'primary' | 'secondary' | 'tertiary';
-  size?: 'm' | 'l';
+  size?: 's' | 'm' | 'l' | 'xl';
   subtitle?: React.ReactNode;
   /* Позволяет задать тип элемента в который будет обёрнут subtitle */
   subtitleComponent?: React.ElementType;
@@ -49,54 +48,48 @@ export interface HeaderProps extends HTMLAttributesWithRootRef<HTMLElement>, Has
   afterSubtitle?: React.ReactNode;
 }
 
-type HeaderContentProps = Pick<HeaderProps, 'children' | 'mode' | 'size' | 'className'> &
-  HasComponent;
-
-const HeaderContent = ({ mode, size, ...restProps }: HeaderContentProps) => {
-  const isLarge = size === 'l';
+const sizeClassNames: Record<Exclude<HeaderProps['size'], undefined>, string> = {
+  s: styles.sizeS,
+  m: styles.sizeM,
+  l: styles.sizeL,
+  xl: styles.sizeXl,
+};
 
-  const platform = usePlatform();
-  if (platform === 'ios') {
-    switch (mode) {
-      case 'primary':
-        return isLarge ? (
-          <Title level="2" weight="2" {...restProps} />
-        ) : (
-          <Title weight="1" level="3" {...restProps} />
-        );
-      case 'secondary':
-        return <Footnote weight="1" caps {...restProps} />;
-      case 'tertiary':
-        return <Title weight="1" level="3" {...restProps} />;
-    }
-  }
+type HeaderContentProps = Pick<HeaderProps, 'children' | 'size' | 'className'> & HasComponent;
 
-  switch (mode) {
-    case 'primary':
-      return isLarge ? (
-        <Title level="2" weight="2" {...restProps} />
-      ) : (
-        <Headline weight="2" {...restProps} />
-      );
-    case 'secondary':
-      return <Footnote weight="1" caps {...restProps} />;
-    case 'tertiary':
-      return <Headline weight="2" {...restProps} />;
+const HeaderContent = ({ size, ...restProps }: HeaderContentProps) => {
+  switch (size) {
+    case 'xl':
+      return <Title level="2" weight="1" {...restProps} />;
+    case 'l':
+      return <Title level="3" weight="1" {...restProps} />;
+    case 'm':
+      return <Headline {...restProps} />;
+    case 's':
+      return <Footnote caps weight="1" {...restProps} />;
   }
 
   return null;
 };
 
-const stylesMode = {
-  primary: styles.modePrimary,
-  secondary: styles.modeSecondary,
-  tertiary: styles.modeTertiary,
+const Subtitle: React.FC<
+  Pick<HeaderProps, 'multiline' | 'subtitleComponent' | 'size'> & { children: React.ReactNode }
+> = ({ subtitleComponent, children, multiline, size }) => {
+  const SubtitleElement = size === 'm' || size === 's' ? Caption : Subhead;
+  return (
+    <SubtitleElement
+      className={classNames(styles.subtitle, multiline && styles.contentMultiline)}
+      Component={subtitleComponent}
+    >
+      {children}
+    </SubtitleElement>
+  );
 };
+
 /**
  * @see https://vkcom.github.io/VKUI/#/Header
  */
 export const Header = ({
-  mode = 'primary',
   size = 'm',
   Component = 'h2',
   children,
@@ -117,10 +110,8 @@ export const Header = ({
       {...restProps}
       baseClassName={classNames(
         styles.host,
-        stylesMode[mode],
-        size === 'l' && styles.large,
+        sizeClassNames[size],
         isPrimitiveReactNode(indicator) && styles.pi,
-        hasReactNode(subtitle) && styles.withSubtitle,
       )}
     >
       {before && (
@@ -129,7 +120,7 @@ export const Header = ({
         </div>
       )}
       <div className={styles.main}>
-        <HeaderContent className={styles.content} Component={Component} mode={mode} size={size}>
+        <HeaderContent className={styles.content} Component={Component} size={size}>
           {beforeTitle && <div className={styles.contentBefore}>{beforeTitle}</div>}
           <span className={classNames(styles.contentIn, multiline && styles.contentMultiline)}>
             {children}
@@ -144,12 +135,9 @@ export const Header = ({
         {hasReactNode(subtitle) && (
           <div className={styles.subtitleWrapper}>
             {beforeSubtitle && <div className={styles.subtitleBefore}>{beforeSubtitle}</div>}
-            <Subhead
-              className={classNames(styles.subtitle, multiline && styles.contentMultiline)}
-              Component={subtitleComponent}
-            >
+            <Subtitle multiline={multiline} subtitleComponent={subtitleComponent} size={size}>
               {subtitle}
-            </Subhead>
+            </Subtitle>
             {afterSubtitle && <div className={styles.subtitleAfter}>{afterSubtitle}</div>}
           </div>
         )}
diff --git a/packages/vkui/src/components/Header/Readme.md b/packages/vkui/src/components/Header/Readme.md
index 6100a43b40..27a978259a 100644
--- a/packages/vkui/src/components/Header/Readme.md
+++ b/packages/vkui/src/components/Header/Readme.md
@@ -8,7 +8,6 @@ const Example = () => {
         <PanelHeader>Header</PanelHeader>
         <Group>
           <Header
-            mode="primary"
             after={
               <Link>
                 Показать все
@@ -19,7 +18,6 @@ const Example = () => {
             Плейлисты
           </Header>
           <Header
-            mode="primary"
             after={
               <Link>
                 Показать все
@@ -32,7 +30,6 @@ const Example = () => {
             Плейлисты
           </Header>
           <Header
-            mode="primary"
             after={
               <Link>
                 Показать все
@@ -44,7 +41,6 @@ const Example = () => {
             Плейлисты
           </Header>
           <Header
-            mode="primary"
             after={
               <Link>
                 Показать все
@@ -62,7 +58,7 @@ const Example = () => {
         </Group>
         <Group>
           <Header
-            mode="secondary"
+            size="s"
             after={
               <Link>
                 Показать все
@@ -73,7 +69,7 @@ const Example = () => {
             Приглашения
           </Header>
           <Header
-            mode="secondary"
+            size="s"
             after={
               <Link>
                 Показать все
@@ -85,7 +81,7 @@ const Example = () => {
             Фотографии
           </Header>
           <Header
-            mode="secondary"
+            size="s"
             after={
               <Link>
                 Показать все
@@ -102,27 +98,20 @@ const Example = () => {
           </Header>
         </Group>
         <Group>
-          <Header mode="tertiary">Важные</Header>
+          <Header>Важные</Header>
         </Group>
         <Group>
-          <Header mode="primary" multiline>
-            Кто может писать мне личные сообщения
-          </Header>
-          <Header mode="tertiary" multiline>
-            Кто может комментировать мои записи
-          </Header>
-          <Header mode="secondary" multiline>
+          <Header multiline>Кто может писать мне личные сообщения</Header>
+          <Header multiline>Кто может комментировать мои записи</Header>
+          <Header size="s" multiline>
             Кто может оставлять записи на моей странице
           </Header>
         </Group>
         <Group>
-          <Header mode="primary" size="l">
-            Большой заголовок
-          </Header>
+          <Header size="xl">Большой заголовок</Header>
         </Group>
         <Group>
           <Header
-            mode="primary"
             before={<Icon28UserCircleFillBlue />}
             beforeTitle={<Icon16LockOutline />}
             afterTitle={<Icon16UnlockOutline />}
@@ -145,7 +134,6 @@ const Example = () => {
             Плейлисты
           </Header>
           <Header
-            mode="primary"
             before={<Icon28UserCircleFillBlue />}
             beforeTitle={<Icon16LockOutline />}
             afterTitle={<Icon16UnlockOutline />}
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-dark-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-dark-1-snap.png
index 5c660976b0..4932086574 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-dark-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:7666611c5e1ed49bf707a02f2bf706c9658951b1f4f7ca58049fb011683bd3e6
-size 284775
+oid sha256:13d32950ea5ca621af75e544f4f25e9e943aa672c3eb8870ef5c77e23aa141a6
+size 319983
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-light-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-light-1-snap.png
index 01ad7d4cf8..f8d8325e42 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-light-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-android-chromium-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:eb5335a42e781e3a86417aec2d384533f3918743c814dfbb30ab6b26b8d0f836
-size 284521
+oid sha256:74421cd0eff434954ceec9c507994db071feafc477490140640318179e17f90f
+size 314077
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-dark-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-dark-1-snap.png
index 77af64cfdb..f048a12fd8 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-dark-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:e3307493705844b7b913476e68efcc08e6b1f3e61fd1f2414d194d1b445a6bd4
-size 293619
+oid sha256:1be92baaac827f1bf869ba8780c2a9e1e9d55dd813f1ca88a977733ae98c5dfc
+size 332742
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-light-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-light-1-snap.png
index 7948125cc0..0052162e82 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-light-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-ios-webkit-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:9bd28b3b341ccef41702330979df36e95fb9beab2a1f59555906db8ebbf12d8f
-size 289627
+oid sha256:70da983c6191df86528172efc60b1633424da2b995b215bf40be6346cbbb6637
+size 322640
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-dark-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-dark-1-snap.png
index 7d05155744..376665bfa7 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-dark-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:67567d1fe5fe4eb126416104d6c75948b6d1e65a42e40f8e9497494e72924905
-size 284171
+oid sha256:307f15f256f784f9e4c9386f22407def49bc5ffe3c7681132c3175da716ecf28
+size 321398
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-light-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-light-1-snap.png
index 2e5418fd88..a1304ad5cf 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-light-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-chromium-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:25cbae3283fd68a7462557fa2094e9e160a73d48403230dd817e119b33e60757
-size 285365
+oid sha256:e71554a82354cafb628d3c04551d2b6213e658a128e770a977f360f8cc610d5a
+size 320580
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-dark-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-dark-1-snap.png
index 6e8f3a7365..8a72cec0ab 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-dark-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:efa4bd21a6c016bf8a1c3e81047a00d00bef01c07e600416f344a8f2de0d644d
-size 430643
+oid sha256:c206ad95ed6cc3cf059c1aea5bb104bdf465eab9c5c94e3b22025eb6ec147762
+size 490679
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-light-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-light-1-snap.png
index 1ed7b35fc0..b705af33ec 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-light-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-firefox-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:3004589e0249214126cf18400e889b34d4d45ef728435df0ac91b9820f489393
-size 421708
+oid sha256:c8e9ec1f3828020db11adbe3bc4d86a3dbaa8557627ea24248b94bfc8def4429
+size 472909
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-dark-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-dark-1-snap.png
index 6d0358445a..dbaf73e872 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-dark-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-dark-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:43c36d15d38833955b9ef890cf045d41c476a20666c8b7c659cb6a3b6821c35a
-size 288625
+oid sha256:e50373cabfd5547fdc93367d56cfbc2ab7306f197e06dd367551131ee9cd80b4
+size 326202
diff --git a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-light-1-snap.png b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-light-1-snap.png
index 3afb8541de..bd2067b7c7 100644
--- a/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-light-1-snap.png
+++ b/packages/vkui/src/components/Header/__image_snapshots__/header-vkcom-webkit-light-1-snap.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:d0661f223011437cf3a7254c5202c23d5fe10a4659ad2f96f2f218d3d2a12bb3
-size 290380
+oid sha256:fd56e6b97e8bef41cbda78ece41c3cbe9f5b20808f40251b566d7fe642e0322d
+size 325764
diff --git a/packages/vkui/src/components/HorizontalScroll/HorizontalScroll.stories.tsx b/packages/vkui/src/components/HorizontalScroll/HorizontalScroll.stories.tsx
index c98caf7159..3b67eaaec7 100644
--- a/packages/vkui/src/components/HorizontalScroll/HorizontalScroll.stories.tsx
+++ b/packages/vkui/src/components/HorizontalScroll/HorizontalScroll.stories.tsx
@@ -69,7 +69,7 @@ export const Playground: Story = {
   },
   decorators: [
     (Component, context) => (
-      <Group header={<Header mode="secondary">Недавние</Header>}>
+      <Group header={<Header size="s">Недавние</Header>}>
         <Component args={context.args} />
       </Group>
     ),
diff --git a/packages/vkui/src/components/HorizontalScroll/Readme.md b/packages/vkui/src/components/HorizontalScroll/Readme.md
index 5d5f3c3ab6..e9014d102d 100644
--- a/packages/vkui/src/components/HorizontalScroll/Readme.md
+++ b/packages/vkui/src/components/HorizontalScroll/Readme.md
@@ -17,7 +17,7 @@ const HorizontalScrollExample = () => {
     <View activePanel={activePanel}>
       <Panel id="basic-case">
         <PanelHeader>HorizontalScroll</PanelHeader>
-        <Group header={<Header mode="secondary">Недавние</Header>}>
+        <Group header={<Header size="s">Недавние</Header>}>
           <HorizontalScroll
             showArrows
             getScrollToLeft={(i) => i - 120}
@@ -34,7 +34,7 @@ const HorizontalScrollExample = () => {
           </HorizontalScroll>
         </Group>
 
-        <Group header={<Header mode="secondary">Общие друзья</Header>}>
+        <Group header={<Header size="s">Общие друзья</Header>}>
           <HorizontalScroll
             showArrows
             arrowSize="m"
@@ -57,7 +57,7 @@ const HorizontalScrollExample = () => {
           </HorizontalScroll>
         </Group>
 
-        <Group header={<Header mode="secondary">С кнопкой "Показать всё"</Header>}>
+        <Group header={<Header size="s">С кнопкой "Показать всё"</Header>}>
           <CellButton
             before={<Icon16MoreHorizontal aria-hidden />}
             onClick={() => setActivePanel('show-more-case')}
diff --git a/packages/vkui/src/components/Image/Readme.md b/packages/vkui/src/components/Image/Readme.md
index a532a70c5b..9036bea13d 100644
--- a/packages/vkui/src/components/Image/Readme.md
+++ b/packages/vkui/src/components/Image/Readme.md
@@ -3,7 +3,7 @@
 ```jsx
 const Default = () => {
   return (
-    <Group header={<Header mode="secondary">По умолчанию</Header>}>
+    <Group header={<Header size="s">По умолчанию</Header>}>
       <SimpleCell
         before={<Image src={getAvatarUrl('app_shorm_online')} alt="Приложение шторм онлайн" />}
         description="Ролевая"
@@ -19,9 +19,7 @@ const Responsive = () => {
   return (
     <Group
       header={
-        <Header mode="secondary">
-          Изображения без фиксированных размеров с сохранением пропорций
-        </Header>
+        <Header size="s">Изображения без фиксированных размеров с сохранением пропорций</Header>
       }
     >
       <Flex margin="auto" direction="column" gap="m">
@@ -47,7 +45,7 @@ const OthersFeatures = () => {
   const [overlay, setOverlay] = React.useState();
 
   return (
-    <Group header={<Header mode="secondary">Другие возможности</Header>}>
+    <Group header={<Header size="s">Другие возможности</Header>}>
       <ImagePropsForm
         onBorderRadiusChange={setBorderRadius}
         onBadgeChange={setBadge}
diff --git a/packages/vkui/src/components/InfoRow/InfoRow.stories.tsx b/packages/vkui/src/components/InfoRow/InfoRow.stories.tsx
index 7eec4f7092..7052fc57b6 100644
--- a/packages/vkui/src/components/InfoRow/InfoRow.stories.tsx
+++ b/packages/vkui/src/components/InfoRow/InfoRow.stories.tsx
@@ -27,7 +27,7 @@ export const Example: Story = {
   ...Playground,
   decorators: [
     (Component) => (
-      <Group header={<Header mode="secondary">Информация о пользователе</Header>}>
+      <Group header={<Header size="s">Информация о пользователе</Header>}>
         <SimpleCell multiline>
           <Component args={{ header: 'Дата рождения', children: '30 января 1993' }} />
         </SimpleCell>
diff --git a/packages/vkui/src/components/InfoRow/Readme.md b/packages/vkui/src/components/InfoRow/Readme.md
index 2be48761f4..01c762b1ab 100644
--- a/packages/vkui/src/components/InfoRow/Readme.md
+++ b/packages/vkui/src/components/InfoRow/Readme.md
@@ -10,7 +10,7 @@
         <InfoRow header="Общий бюджет">3000 р.</InfoRow>
       </SimpleCell>
     </Group>
-    <Group header={<Header mode="secondary">Информация о пользователе</Header>}>
+    <Group header={<Header size="s">Информация о пользователе</Header>}>
       <SimpleCell multiline>
         <InfoRow header="Дата рождения">30 января 1993</InfoRow>
       </SimpleCell>
diff --git a/packages/vkui/src/components/ModalPage/ModalPage.stories.tsx b/packages/vkui/src/components/ModalPage/ModalPage.stories.tsx
index c0eed6b737..0ba0a98aec 100644
--- a/packages/vkui/src/components/ModalPage/ModalPage.stories.tsx
+++ b/packages/vkui/src/components/ModalPage/ModalPage.stories.tsx
@@ -133,7 +133,7 @@ export const FullscreenModalPage: Story = {
           </Gradient>
           <Group
             header={
-              <Header mode="secondary" indicator="25">
+              <Header size="s" indicator="25">
                 Друзья
               </Header>
             }
diff --git a/packages/vkui/src/components/ModalRoot/Readme.md b/packages/vkui/src/components/ModalRoot/Readme.md
index bf14879ef4..c503f48ab2 100644
--- a/packages/vkui/src/components/ModalRoot/Readme.md
+++ b/packages/vkui/src/components/ModalRoot/Readme.md
@@ -147,7 +147,7 @@ const App = () => {
       </Gradient>
       <Group
         header={
-          <Header mode="secondary" indicator="25">
+          <Header size="s" indicator="25">
             Друзья
           </Header>
         }
diff --git a/packages/vkui/src/components/PanelSpinner/Readme.md b/packages/vkui/src/components/PanelSpinner/Readme.md
index edbcc4117d..532b5e911c 100644
--- a/packages/vkui/src/components/PanelSpinner/Readme.md
+++ b/packages/vkui/src/components/PanelSpinner/Readme.md
@@ -15,7 +15,7 @@ import { PanelSpinner } from '@vkontakte/vkui';
   {loading ? (
     <PanelSpinner>Панель загружается, пожалуйста, подождите...</PanelSpinner>
   ) : (
-    <Group header={<Header mode="secondary">Информация</Header>}>...</Group>
+    <Group header={<Header size="s">Информация</Header>}>...</Group>
   )}
 </Panel>;
 ```
diff --git a/packages/vkui/src/components/Separator/Readme.md b/packages/vkui/src/components/Separator/Readme.md
index 575d352d48..ee8eca2d13 100644
--- a/packages/vkui/src/components/Separator/Readme.md
+++ b/packages/vkui/src/components/Separator/Readme.md
@@ -12,7 +12,7 @@
   <Panel id="separator">
     <PanelHeader>Separator</PanelHeader>
 
-    <Group header={<Header mode="secondary">direction="horizontal"</Header>}>
+    <Group header={<Header size="s">direction="horizontal"</Header>}>
       <Cell before={<Icon28Notifications />}>Уведомления</Cell>
       <Cell before={<Icon28BlockOutline />}>Не беспокоить</Cell>
 
@@ -21,7 +21,7 @@
       <Cell before={<Icon28UserOutline />}>Учётная запись</Cell>
       <Cell before={<Icon28SlidersOutline />}>Основные</Cell>
     </Group>
-    <Group header={<Header mode="secondary">direction="vertical"</Header>}>
+    <Group header={<Header size="s">direction="vertical"</Header>}>
       <Flex margin="auto">
         <Link>Новости</Link>
         <Separator direction="vertical" size="xl" />
diff --git a/packages/vkui/src/components/SimpleCell/Readme.md b/packages/vkui/src/components/SimpleCell/Readme.md
index 66ca6726fe..4b10104258 100644
--- a/packages/vkui/src/components/SimpleCell/Readme.md
+++ b/packages/vkui/src/components/SimpleCell/Readme.md
@@ -6,7 +6,7 @@ const Example = () => {
     <View activePanel={activePanel}>
       <Panel id="list">
         <PanelHeader>SimpleCell</PanelHeader>
-        <Group header={<Header mode="secondary">Меню</Header>}>
+        <Group header={<Header size="s">Меню</Header>}>
           <SimpleCell
             onClick={() => setActivePanel('nothing')}
             chevron="auto"
@@ -29,7 +29,7 @@ const Example = () => {
             Основные
           </SimpleCell>
         </Group>
-        <Group header={<Header mode="secondary">Настройки</Header>}>
+        <Group header={<Header size="s">Настройки</Header>}>
           <SimpleCell Component="label" after={<Switch defaultChecked />}>
             Сжимать фотографии
           </SimpleCell>
@@ -37,7 +37,7 @@ const Example = () => {
             Сжимать видео
           </SimpleCell>
         </Group>
-        <Group header={<Header mode="secondary">Настройки системы</Header>}>
+        <Group header={<Header size="s">Настройки системы</Header>}>
           <SimpleCell onClick={() => setActivePanel('nothing')} chevron="auto" indicator="Русский">
             Язык
           </SimpleCell>
@@ -49,7 +49,7 @@ const Example = () => {
             Геолокация
           </SimpleCell>
         </Group>
-        <Group header={<Header mode="secondary">Список диалогов</Header>}>
+        <Group header={<Header size="s">Список диалогов</Header>}>
           <SimpleCell
             before={<Avatar size={40} src={getAvatarUrl('user_xyz')} />}
             after={
@@ -73,7 +73,7 @@ const Example = () => {
             Artur Stambultsian
           </SimpleCell>
         </Group>
-        <Group header={<Header mode="secondary">Список друзей</Header>}>
+        <Group header={<Header size="s">Список друзей</Header>}>
           <SimpleCell
             before={<Avatar size={48} src={getAvatarUrl('user_xyz')} />}
             badgeAfterTitle={<Icon12Verified />}
diff --git a/packages/vkui/src/components/Spacing/Readme.md b/packages/vkui/src/components/Spacing/Readme.md
index 07389081e8..14ee378f8b 100644
--- a/packages/vkui/src/components/Spacing/Readme.md
+++ b/packages/vkui/src/components/Spacing/Readme.md
@@ -14,7 +14,7 @@
   <Panel id="separator">
     <PanelHeader>Spacing</PanelHeader>
 
-    <Group header={<Header mode="secondary">Default Spacing (empty, 8px)</Header>}>
+    <Group header={<Header size="s">Default Spacing (empty, 8px)</Header>}>
       <SimpleCell before={<Icon28Notifications />}>Уведомления</SimpleCell>
       <SimpleCell before={<Icon28BlockOutline />}>Не беспокоить</SimpleCell>
 
@@ -24,7 +24,7 @@
       <SimpleCell before={<Icon28SlidersOutline />}>Основные</SimpleCell>
     </Group>
 
-    <Group header={<Header mode="secondary">Spacing 16px</Header>}>
+    <Group header={<Header size="s">Spacing 16px</Header>}>
       <SimpleCell before={<Icon28Notifications />}>Уведомления</SimpleCell>
       <SimpleCell before={<Icon28BlockOutline />}>Не беспокоить</SimpleCell>
 
diff --git a/packages/vkui/src/components/Touch/Readme.md b/packages/vkui/src/components/Touch/Readme.md
index fa078b445c..8d5607c7d7 100644
--- a/packages/vkui/src/components/Touch/Readme.md
+++ b/packages/vkui/src/components/Touch/Readme.md
@@ -65,7 +65,7 @@ const Example = () => {
     <View activePanel="gallery">
       <Panel id="gallery">
         <PanelHeader>Touch</PanelHeader>
-        <Group header={<Header mode="secondary">Перетащите кружок</Header>}>
+        <Group header={<Header size="s">Перетащите кружок</Header>}>
           <div
             style={{
               ...containerStyle,
diff --git a/packages/vkui/src/components/UsersStack/Readme.md b/packages/vkui/src/components/UsersStack/Readme.md
index 29abef1b74..5d5f122e40 100644
--- a/packages/vkui/src/components/UsersStack/Readme.md
+++ b/packages/vkui/src/components/UsersStack/Readme.md
@@ -62,7 +62,7 @@ const App = () => {
           </Div>
         </Group>
 
-        <Group header={<Header mode="secondary">Вертикальный режим</Header>}>
+        <Group header={<Header size="s">Вертикальный режим</Header>}>
           <Div>
             <UsersStack
               photos={[
@@ -102,7 +102,7 @@ const App = () => {
           </Flex>
         </Group>
 
-        <Group header={<Header mode="secondary">Кликабельные с тултипом</Header>}>
+        <Group header={<Header size="s">Кликабельные с тултипом</Header>}>
           <Div>
             <UsersStack
               photos={[