diff --git a/cypress/snapshots/b2c/components/Range/Range.component-test.tsx/plasma-b2c Range -- _error & _success.snap.png b/cypress/snapshots/b2c/components/Range/Range.component-test.tsx/plasma-b2c Range -- _error & _success.snap.png
index 23f86bd6fc..b2bcd8d7ba 100644
Binary files a/cypress/snapshots/b2c/components/Range/Range.component-test.tsx/plasma-b2c Range -- _error & _success.snap.png and b/cypress/snapshots/b2c/components/Range/Range.component-test.tsx/plasma-b2c Range -- _error & _success.snap.png differ
diff --git a/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1384] Range size=m, dividerVariant=dash, enableContentLeft, enableFirstTextfieldContentLeft, enableSecondTextfieldContentLeft, firstValueError.snap.png b/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1384] Range size=m, dividerVariant=dash, enableContentLeft, enableFirstTextfieldContentLeft, enableSecondTextfieldContentLeft, firstValueError.snap.png
index 87ac0581bb..082bd1cc63 100644
Binary files a/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1384] Range size=m, dividerVariant=dash, enableContentLeft, enableFirstTextfieldContentLeft, enableSecondTextfieldContentLeft, firstValueError.snap.png and b/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1384] Range size=m, dividerVariant=dash, enableContentLeft, enableFirstTextfieldContentLeft, enableSecondTextfieldContentLeft, firstValueError.snap.png differ
diff --git a/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1532] Range size=s, dividerVariant=icon, enableContentRight, enableFirstTextfieldContentRight, enableSecondTextfieldContentRight, secondValueError.snap.png b/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1532] Range size=s, dividerVariant=icon, enableContentRight, enableFirstTextfieldContentRight, enableSecondTextfieldContentRight, secondValueError.snap.png
index 6ecfd02aa9..1ca3a4365b 100644
Binary files a/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1532] Range size=s, dividerVariant=icon, enableContentRight, enableFirstTextfieldContentRight, enableSecondTextfieldContentRight, secondValueError.snap.png and b/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1532] Range size=s, dividerVariant=icon, enableContentRight, enableFirstTextfieldContentRight, enableSecondTextfieldContentRight, secondValueError.snap.png differ
diff --git a/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1533] Range size=xs, firstValueSuccess.snap.png b/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1533] Range size=xs, firstValueSuccess.snap.png
index 7d2db554ed..13dab8abb7 100644
Binary files a/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1533] Range size=xs, firstValueSuccess.snap.png and b/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1533] Range size=xs, firstValueSuccess.snap.png differ
diff --git a/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1534] Range secondValueSuccess.snap.png b/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1534] Range secondValueSuccess.snap.png
index cd02ef77db..6a6ddbd298 100644
Binary files a/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1534] Range secondValueSuccess.snap.png and b/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1534] Range secondValueSuccess.snap.png differ
diff --git a/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1535] Range firstValueError, secondValueSuccess.snap.png b/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1535] Range firstValueError, secondValueSuccess.snap.png
index d7dcce7d0a..a387f13a93 100644
Binary files a/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1535] Range firstValueError, secondValueSuccess.snap.png and b/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1535] Range firstValueError, secondValueSuccess.snap.png differ
diff --git a/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1536] Range firstValueSuccess, secondValueError.snap.png b/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1536] Range firstValueSuccess, secondValueError.snap.png
index c0d1b963d0..36fe953394 100644
Binary files a/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1536] Range firstValueSuccess, secondValueError.snap.png and b/cypress/snapshots/b2c/components/Range/Range.update-test.component-test.tsx/plasma-b2c Range -- [PLASMA-T1536] Range firstValueSuccess, secondValueError.snap.png differ
diff --git a/cypress/snapshots/web/components/Range/Range.component-test.tsx/plasma-web Range -- _error & _success.snap.png b/cypress/snapshots/web/components/Range/Range.component-test.tsx/plasma-web Range -- _error & _success.snap.png
index 1f8c372b0a..97bcf1b3d7 100644
Binary files a/cypress/snapshots/web/components/Range/Range.component-test.tsx/plasma-web Range -- _error & _success.snap.png and b/cypress/snapshots/web/components/Range/Range.component-test.tsx/plasma-web Range -- _error & _success.snap.png differ
diff --git a/packages/plasma-b2c/src/components/DatePicker/DatePicker.config.ts b/packages/plasma-b2c/src/components/DatePicker/DatePicker.config.ts
index 580f53e1e6..07eb043363 100644
--- a/packages/plasma-b2c/src/components/DatePicker/DatePicker.config.ts
+++ b/packages/plasma-b2c/src/components/DatePicker/DatePicker.config.ts
@@ -15,6 +15,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/plasma-b2c/src/components/DatePicker/DatePicker.stories.tsx b/packages/plasma-b2c/src/components/DatePicker/DatePicker.stories.tsx
index 861183e6e5..0f14eff6ac 100644
--- a/packages/plasma-b2c/src/components/DatePicker/DatePicker.stories.tsx
+++ b/packages/plasma-b2c/src/components/DatePicker/DatePicker.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ComponentProps, useEffect, useRef, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 
 import { IconButton } from '../IconButton/IconButton';
 
@@ -65,6 +65,7 @@ const meta: Meta = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/plasma-b2c/src/components/Range/Range.config.ts b/packages/plasma-b2c/src/components/Range/Range.config.ts
index f11cb3779a..56b0fbb0c1 100644
--- a/packages/plasma-b2c/src/components/Range/Range.config.ts
+++ b/packages/plasma-b2c/src/components/Range/Range.config.ts
@@ -15,6 +15,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/plasma-b2c/src/components/Range/Range.stories.tsx b/packages/plasma-b2c/src/components/Range/Range.stories.tsx
index c08d812be4..8ab8e09283 100644
--- a/packages/plasma-b2c/src/components/Range/Range.stories.tsx
+++ b/packages/plasma-b2c/src/components/Range/Range.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ChangeEvent, ComponentProps, Dispatch, SetStateAction, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 import { IconSearch, IconSber, IconArrowRight } from '@salutejs/plasma-icons';
 
 import { IconButton } from '../IconButton/IconButton';
@@ -46,6 +46,7 @@ const meta: Meta<typeof Range> = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/plasma-giga/src/components/DatePicker/DatePicker.config.ts b/packages/plasma-giga/src/components/DatePicker/DatePicker.config.ts
index 45070b81c9..c861eb7ea5 100644
--- a/packages/plasma-giga/src/components/DatePicker/DatePicker.config.ts
+++ b/packages/plasma-giga/src/components/DatePicker/DatePicker.config.ts
@@ -15,6 +15,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/plasma-giga/src/components/DatePicker/DatePicker.stories.tsx b/packages/plasma-giga/src/components/DatePicker/DatePicker.stories.tsx
index 767b196ac6..709f03fe10 100644
--- a/packages/plasma-giga/src/components/DatePicker/DatePicker.stories.tsx
+++ b/packages/plasma-giga/src/components/DatePicker/DatePicker.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ComponentProps, useEffect, useRef, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 
 import { IconButton } from '../IconButton';
 
@@ -65,6 +65,7 @@ const meta: Meta = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/plasma-giga/src/components/Range/Range.config.ts b/packages/plasma-giga/src/components/Range/Range.config.ts
index f11cb3779a..56b0fbb0c1 100644
--- a/packages/plasma-giga/src/components/Range/Range.config.ts
+++ b/packages/plasma-giga/src/components/Range/Range.config.ts
@@ -15,6 +15,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/plasma-giga/src/components/Range/Range.stories.tsx b/packages/plasma-giga/src/components/Range/Range.stories.tsx
index 11dfd44085..b6cb25ea9d 100644
--- a/packages/plasma-giga/src/components/Range/Range.stories.tsx
+++ b/packages/plasma-giga/src/components/Range/Range.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ChangeEvent, ComponentProps, Dispatch, SetStateAction, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 import { IconSearch, IconSber, IconArrowRight } from '@salutejs/plasma-icons';
 
 import { IconButton } from '../IconButton';
@@ -46,6 +46,7 @@ const meta: Meta<typeof Range> = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/plasma-new-hope/src/components/DatePicker/DatePicker.tokens.ts b/packages/plasma-new-hope/src/components/DatePicker/DatePicker.tokens.ts
index 25c16a6214..43a65f09d3 100644
--- a/packages/plasma-new-hope/src/components/DatePicker/DatePicker.tokens.ts
+++ b/packages/plasma-new-hope/src/components/DatePicker/DatePicker.tokens.ts
@@ -71,6 +71,8 @@ export const tokens = {
 
     /** Токены вспомогательного текста */
     leftHelperColor: '--plasma-date-picker__left-helper-color',
+    leftHelperColorError: '--plasma-date-picker__left-helper-color-error',
+    leftHelperColorSuccess: '--plasma-date-picker__left-helper-color-success',
     leftHelperColorReadOnly: '--plasma-date-picker__left-helper-color-readonly',
     leftHelperOffset: '--plasma-date-picker__left-helper-offset',
 
diff --git a/packages/plasma-new-hope/src/components/DatePicker/RangeDate/RangeDate.styles.ts b/packages/plasma-new-hope/src/components/DatePicker/RangeDate/RangeDate.styles.ts
index 7704ce4468..486cba511f 100644
--- a/packages/plasma-new-hope/src/components/DatePicker/RangeDate/RangeDate.styles.ts
+++ b/packages/plasma-new-hope/src/components/DatePicker/RangeDate/RangeDate.styles.ts
@@ -3,7 +3,7 @@ import { css } from '@linaria/core';
 
 import { component, mergeConfig } from '../../../engines';
 import { rangeConfig, rangeTokens } from '../../Range';
-import { tokens } from '../DatePicker.tokens';
+import { classes, tokens } from '../DatePicker.tokens';
 import { popoverConfig } from '../../Popover';
 
 const mergedRangeConfig = mergeConfig(rangeConfig);
@@ -120,4 +120,14 @@ export const base = css`
     display: inline-block;
 `;
 
-export const LeftHelper = styled.div``;
+export const LeftHelper = styled.div`
+    color: var(${tokens.leftHelperColor});
+
+    &.${classes.datePickerError} {
+        color: var(${tokens.leftHelperColorError});
+    }
+
+    &.${classes.datePickerSuccess} {
+        color: var(${tokens.leftHelperColorSuccess});
+    }
+`;
diff --git a/packages/plasma-new-hope/src/components/DatePicker/RangeDate/RangeDate.tsx b/packages/plasma-new-hope/src/components/DatePicker/RangeDate/RangeDate.tsx
index c056188206..4c559ccb50 100644
--- a/packages/plasma-new-hope/src/components/DatePicker/RangeDate/RangeDate.tsx
+++ b/packages/plasma-new-hope/src/components/DatePicker/RangeDate/RangeDate.tsx
@@ -150,6 +150,9 @@ export const datePickerRangeRoot = (
 
             const [secondTextFieldClicked, setSecondTextFieldClicked] = useState(false);
 
+            const rangeErrorClass = firstValueError || secondValueError ? classes.datePickerError : undefined;
+            const rangeSuccessClass = firstValueSuccess || secondValueSuccess ? classes.datePickerSuccess : undefined;
+
             const setFirstInputValue = (value: React.SetStateAction<string>) => {
                 setInputFirstValue(value);
 
@@ -474,7 +477,9 @@ export const datePickerRangeRoot = (
                         onChangeStartOfRange={handleChangeStartOfRange}
                         onChangeValue={handleChangeCalendarValue}
                     />
-                    {leftHelper && <LeftHelper>{leftHelper}</LeftHelper>}
+                    {leftHelper && (
+                        <LeftHelper className={cx(rangeErrorClass, rangeSuccessClass)}>{leftHelper}</LeftHelper>
+                    )}
                     <InputHidden
                         name={name}
                         type="hidden"
diff --git a/packages/plasma-new-hope/src/components/DatePicker/SingleDate/SingleDate.styles.ts b/packages/plasma-new-hope/src/components/DatePicker/SingleDate/SingleDate.styles.ts
index 85cd2ccd5a..1ef0227712 100644
--- a/packages/plasma-new-hope/src/components/DatePicker/SingleDate/SingleDate.styles.ts
+++ b/packages/plasma-new-hope/src/components/DatePicker/SingleDate/SingleDate.styles.ts
@@ -119,4 +119,14 @@ export const base = css`
     }
 `;
 
-export const LeftHelper = styled.div``;
+export const LeftHelper = styled.div`
+    color: var(${tokens.leftHelperColor});
+
+    &.${classes.datePickerError} {
+        color: var(${tokens.leftHelperColorError});
+    }
+
+    &.${classes.datePickerSuccess} {
+        color: var(${tokens.leftHelperColorSuccess});
+    }
+`;
diff --git a/packages/plasma-new-hope/src/components/DatePicker/SingleDate/SingleDate.tsx b/packages/plasma-new-hope/src/components/DatePicker/SingleDate/SingleDate.tsx
index 04ad351524..2ce88721f0 100644
--- a/packages/plasma-new-hope/src/components/DatePicker/SingleDate/SingleDate.tsx
+++ b/packages/plasma-new-hope/src/components/DatePicker/SingleDate/SingleDate.tsx
@@ -231,7 +231,11 @@ export const datePickerRoot = (
                             />
                         </Root>
                     </StyledPopover>
-                    {leftHelper && <LeftHelper>{leftHelper}</LeftHelper>}
+                    {leftHelper && (
+                        <LeftHelper className={cx(datePickerErrorClass, datePickerSuccessClass)}>
+                            {leftHelper}
+                        </LeftHelper>
+                    )}
                     <InputHidden
                         type="hidden"
                         datatype="datepicker-single"
diff --git a/packages/plasma-new-hope/src/components/Range/Range.tokens.ts b/packages/plasma-new-hope/src/components/Range/Range.tokens.ts
index a8bad16331..5d6fec44e1 100644
--- a/packages/plasma-new-hope/src/components/Range/Range.tokens.ts
+++ b/packages/plasma-new-hope/src/components/Range/Range.tokens.ts
@@ -60,6 +60,8 @@ export const tokens = {
     leftHelperColor: '--plasma-range__left-helper-color',
     leftHelperColorReadOnly: '--plasma-range__left-helper-color-readonly',
     leftHelperOffset: '--plasma-range__left-helper-offset',
+    leftHelperColorError: '--plasma-range__left-helper-color-error',
+    leftHelperColorSuccess: '--plasma-range__left-helper-color-success',
 
     leftHelperFontFamily: '--plasma-range__left-helper-font-family',
     leftHelperFontStyle: '--plasma-range__left-helper-font-style',
diff --git a/packages/plasma-new-hope/src/components/Range/Range.tsx b/packages/plasma-new-hope/src/components/Range/Range.tsx
index bb30195606..b704474a2f 100644
--- a/packages/plasma-new-hope/src/components/Range/Range.tsx
+++ b/packages/plasma-new-hope/src/components/Range/Range.tsx
@@ -80,8 +80,10 @@ export const rangeRoot = (Root: RootProps<HTMLDivElement, RangeProps>) =>
             const requiredPlacementClass = requiredPlacement === 'right' ? classes.requiredAlignRight : undefined;
 
             const rangeErrorClass = firstValueError && secondValueError ? classes.rangeError : undefined;
+
             const firstValueErrorClass = !rangeErrorClass && firstValueError ? classes.rangeValueError : undefined;
             const secondValueErrorClass = !rangeErrorClass && secondValueError ? classes.rangeValueError : undefined;
+
             const rangeSuccessClass = firstValueSuccess && secondValueSuccess ? classes.rangeSuccess : undefined;
             const firstValueSuccessClass =
                 !rangeSuccessClass && firstValueSuccess ? classes.rangeValueSuccess : undefined;
@@ -178,7 +180,20 @@ export const rangeRoot = (Root: RootProps<HTMLDivElement, RangeProps>) =>
                         />
                         {contentRight && <StyledContentRight>{contentRight}</StyledContentRight>}
                     </ContentWrapper>
-                    {leftHelper && <LeftHelper>{leftHelper}</LeftHelper>}
+                    {leftHelper && (
+                        <LeftHelper
+                            className={cx(
+                                rangeErrorClass,
+                                firstValueErrorClass,
+                                secondValueErrorClass,
+                                rangeSuccessClass,
+                                firstValueSuccessClass,
+                                secondValueSuccessClass,
+                            )}
+                        >
+                            {leftHelper}
+                        </LeftHelper>
+                    )}
                 </Root>
             );
         },
diff --git a/packages/plasma-new-hope/src/components/Range/variations/_view/base.ts b/packages/plasma-new-hope/src/components/Range/variations/_view/base.ts
index c121e7d4d5..c1f74129c5 100644
--- a/packages/plasma-new-hope/src/components/Range/variations/_view/base.ts
+++ b/packages/plasma-new-hope/src/components/Range/variations/_view/base.ts
@@ -34,5 +34,13 @@ export const base = css`
 
     ${LeftHelper} {
         color: var(${tokens.leftHelperColor});
+
+        &.${classes.rangeError}, &.${classes.rangeValueError} {
+            color: var(${tokens.leftHelperColorError});
+        }
+
+        &.${classes.rangeSuccess}, &.${classes.rangeValueSuccess} {
+            color: var(${tokens.leftHelperColorSuccess});
+        }
     }
 `;
diff --git a/packages/plasma-new-hope/src/examples/plasma_b2c/components/DatePicker/DatePicker.config.ts b/packages/plasma-new-hope/src/examples/plasma_b2c/components/DatePicker/DatePicker.config.ts
index b043ab6ae0..c825d3129b 100644
--- a/packages/plasma-new-hope/src/examples/plasma_b2c/components/DatePicker/DatePicker.config.ts
+++ b/packages/plasma-new-hope/src/examples/plasma_b2c/components/DatePicker/DatePicker.config.ts
@@ -17,6 +17,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/plasma-new-hope/src/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx b/packages/plasma-new-hope/src/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx
index 475b2dc3c1..9a97b04490 100644
--- a/packages/plasma-new-hope/src/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx
+++ b/packages/plasma-new-hope/src/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx
@@ -61,6 +61,7 @@ const meta: Meta = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/plasma-new-hope/src/examples/plasma_b2c/components/Range/Range.config.ts b/packages/plasma-new-hope/src/examples/plasma_b2c/components/Range/Range.config.ts
index 763da3bd4b..7240c79c22 100644
--- a/packages/plasma-new-hope/src/examples/plasma_b2c/components/Range/Range.config.ts
+++ b/packages/plasma-new-hope/src/examples/plasma_b2c/components/Range/Range.config.ts
@@ -17,6 +17,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/plasma-new-hope/src/examples/plasma_b2c/components/Range/Range.stories.tsx b/packages/plasma-new-hope/src/examples/plasma_b2c/components/Range/Range.stories.tsx
index 4960cadd6b..216758e62b 100644
--- a/packages/plasma-new-hope/src/examples/plasma_b2c/components/Range/Range.stories.tsx
+++ b/packages/plasma-new-hope/src/examples/plasma_b2c/components/Range/Range.stories.tsx
@@ -47,6 +47,7 @@ const meta: Meta<typeof Range> = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/plasma-new-hope/src/examples/plasma_web/components/DatePicker/DatePicker.config.ts b/packages/plasma-new-hope/src/examples/plasma_web/components/DatePicker/DatePicker.config.ts
index 3175683365..6d6f8762fa 100644
--- a/packages/plasma-new-hope/src/examples/plasma_web/components/DatePicker/DatePicker.config.ts
+++ b/packages/plasma-new-hope/src/examples/plasma_web/components/DatePicker/DatePicker.config.ts
@@ -20,6 +20,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/plasma-new-hope/src/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx b/packages/plasma-new-hope/src/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx
index ebe50869d9..f1e382f7c4 100644
--- a/packages/plasma-new-hope/src/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx
+++ b/packages/plasma-new-hope/src/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx
@@ -61,6 +61,7 @@ const meta: Meta = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/plasma-new-hope/src/examples/plasma_web/components/Range/Range.config.ts b/packages/plasma-new-hope/src/examples/plasma_web/components/Range/Range.config.ts
index 7bf4ef035b..cf7594524d 100644
--- a/packages/plasma-new-hope/src/examples/plasma_web/components/Range/Range.config.ts
+++ b/packages/plasma-new-hope/src/examples/plasma_web/components/Range/Range.config.ts
@@ -18,6 +18,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/plasma-new-hope/src/examples/plasma_web/components/Range/Range.stories.tsx b/packages/plasma-new-hope/src/examples/plasma_web/components/Range/Range.stories.tsx
index b3d09ca751..ba5dca5136 100644
--- a/packages/plasma-new-hope/src/examples/plasma_web/components/Range/Range.stories.tsx
+++ b/packages/plasma-new-hope/src/examples/plasma_web/components/Range/Range.stories.tsx
@@ -47,6 +47,7 @@ const meta: Meta<typeof Range> = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/plasma-web/src/components/DatePicker/DatePicker.config.ts b/packages/plasma-web/src/components/DatePicker/DatePicker.config.ts
index f2f1079830..7c79a834ce 100644
--- a/packages/plasma-web/src/components/DatePicker/DatePicker.config.ts
+++ b/packages/plasma-web/src/components/DatePicker/DatePicker.config.ts
@@ -18,6 +18,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/plasma-web/src/components/DatePicker/DatePicker.stories.tsx b/packages/plasma-web/src/components/DatePicker/DatePicker.stories.tsx
index adde6a571a..7c4f9a5a9a 100644
--- a/packages/plasma-web/src/components/DatePicker/DatePicker.stories.tsx
+++ b/packages/plasma-web/src/components/DatePicker/DatePicker.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ComponentProps, useEffect, useRef, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 
 import { IconButton } from '../IconButton/IconButton';
 
@@ -65,6 +65,7 @@ const meta: Meta = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/plasma-web/src/components/Range/Range.config.ts b/packages/plasma-web/src/components/Range/Range.config.ts
index 583b4cf9b6..3885eaad5c 100644
--- a/packages/plasma-web/src/components/Range/Range.config.ts
+++ b/packages/plasma-web/src/components/Range/Range.config.ts
@@ -16,6 +16,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.indicatorColor}: var(--surface-negative);
 
diff --git a/packages/plasma-web/src/components/Range/Range.stories.tsx b/packages/plasma-web/src/components/Range/Range.stories.tsx
index c08d812be4..8ab8e09283 100644
--- a/packages/plasma-web/src/components/Range/Range.stories.tsx
+++ b/packages/plasma-web/src/components/Range/Range.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ChangeEvent, ComponentProps, Dispatch, SetStateAction, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 import { IconSearch, IconSber, IconArrowRight } from '@salutejs/plasma-icons';
 
 import { IconButton } from '../IconButton/IconButton';
@@ -46,6 +46,7 @@ const meta: Meta<typeof Range> = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/sdds-cs/src/components/DatePicker/DatePicker.config.ts b/packages/sdds-cs/src/components/DatePicker/DatePicker.config.ts
index f7980caa6c..2e011f0ecc 100644
--- a/packages/sdds-cs/src/components/DatePicker/DatePicker.config.ts
+++ b/packages/sdds-cs/src/components/DatePicker/DatePicker.config.ts
@@ -18,6 +18,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/sdds-cs/src/components/DatePicker/DatePicker.stories.tsx b/packages/sdds-cs/src/components/DatePicker/DatePicker.stories.tsx
index 6e9648f3fa..1460454523 100644
--- a/packages/sdds-cs/src/components/DatePicker/DatePicker.stories.tsx
+++ b/packages/sdds-cs/src/components/DatePicker/DatePicker.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ComponentProps, useRef, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 import { IconPlasma, IconCalendarOutline } from '@salutejs/plasma-icons';
 
 import { IconButton } from '../IconButton/IconButton';
@@ -66,6 +66,7 @@ const meta: Meta = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/sdds-cs/src/components/Range/Range.config.ts b/packages/sdds-cs/src/components/Range/Range.config.ts
index 10fb4ca257..8acd2372ce 100644
--- a/packages/sdds-cs/src/components/Range/Range.config.ts
+++ b/packages/sdds-cs/src/components/Range/Range.config.ts
@@ -16,6 +16,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.indicatorColor}: var(--surface-negative);
 
diff --git a/packages/sdds-cs/src/components/Range/Range.stories.tsx b/packages/sdds-cs/src/components/Range/Range.stories.tsx
index badde6b516..cdff3e0ffb 100644
--- a/packages/sdds-cs/src/components/Range/Range.stories.tsx
+++ b/packages/sdds-cs/src/components/Range/Range.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ChangeEvent, ComponentProps, Dispatch, SetStateAction, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 import { IconSearch, IconSber, IconArrowRight } from '@salutejs/plasma-icons';
 
 import { IconButton } from '../IconButton/IconButton';
@@ -46,6 +46,7 @@ const meta: Meta<typeof Range> = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/sdds-dfa/src/components/DatePicker/DatePicker.config.ts b/packages/sdds-dfa/src/components/DatePicker/DatePicker.config.ts
index 45070b81c9..c861eb7ea5 100644
--- a/packages/sdds-dfa/src/components/DatePicker/DatePicker.config.ts
+++ b/packages/sdds-dfa/src/components/DatePicker/DatePicker.config.ts
@@ -15,6 +15,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/sdds-dfa/src/components/DatePicker/DatePicker.stories.tsx b/packages/sdds-dfa/src/components/DatePicker/DatePicker.stories.tsx
index 767b196ac6..709f03fe10 100644
--- a/packages/sdds-dfa/src/components/DatePicker/DatePicker.stories.tsx
+++ b/packages/sdds-dfa/src/components/DatePicker/DatePicker.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ComponentProps, useEffect, useRef, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 
 import { IconButton } from '../IconButton';
 
@@ -65,6 +65,7 @@ const meta: Meta = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/sdds-dfa/src/components/Range/Range.config.ts b/packages/sdds-dfa/src/components/Range/Range.config.ts
index f11cb3779a..56b0fbb0c1 100644
--- a/packages/sdds-dfa/src/components/Range/Range.config.ts
+++ b/packages/sdds-dfa/src/components/Range/Range.config.ts
@@ -15,6 +15,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/sdds-dfa/src/components/Range/Range.stories.tsx b/packages/sdds-dfa/src/components/Range/Range.stories.tsx
index 11dfd44085..b6cb25ea9d 100644
--- a/packages/sdds-dfa/src/components/Range/Range.stories.tsx
+++ b/packages/sdds-dfa/src/components/Range/Range.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ChangeEvent, ComponentProps, Dispatch, SetStateAction, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 import { IconSearch, IconSber, IconArrowRight } from '@salutejs/plasma-icons';
 
 import { IconButton } from '../IconButton';
@@ -46,6 +46,7 @@ const meta: Meta<typeof Range> = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/sdds-finportal/src/components/DatePicker/DatePicker.config.ts b/packages/sdds-finportal/src/components/DatePicker/DatePicker.config.ts
index 45070b81c9..c861eb7ea5 100644
--- a/packages/sdds-finportal/src/components/DatePicker/DatePicker.config.ts
+++ b/packages/sdds-finportal/src/components/DatePicker/DatePicker.config.ts
@@ -15,6 +15,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/sdds-finportal/src/components/DatePicker/DatePicker.stories.tsx b/packages/sdds-finportal/src/components/DatePicker/DatePicker.stories.tsx
index 767b196ac6..709f03fe10 100644
--- a/packages/sdds-finportal/src/components/DatePicker/DatePicker.stories.tsx
+++ b/packages/sdds-finportal/src/components/DatePicker/DatePicker.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ComponentProps, useEffect, useRef, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 
 import { IconButton } from '../IconButton';
 
@@ -65,6 +65,7 @@ const meta: Meta = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/sdds-finportal/src/components/Range/Range.config.ts b/packages/sdds-finportal/src/components/Range/Range.config.ts
index f11cb3779a..56b0fbb0c1 100644
--- a/packages/sdds-finportal/src/components/Range/Range.config.ts
+++ b/packages/sdds-finportal/src/components/Range/Range.config.ts
@@ -15,6 +15,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/sdds-finportal/src/components/Range/Range.stories.tsx b/packages/sdds-finportal/src/components/Range/Range.stories.tsx
index 11dfd44085..b6cb25ea9d 100644
--- a/packages/sdds-finportal/src/components/Range/Range.stories.tsx
+++ b/packages/sdds-finportal/src/components/Range/Range.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ChangeEvent, ComponentProps, Dispatch, SetStateAction, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 import { IconSearch, IconSber, IconArrowRight } from '@salutejs/plasma-icons';
 
 import { IconButton } from '../IconButton';
@@ -46,6 +46,7 @@ const meta: Meta<typeof Range> = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/sdds-insol/src/components/DatePicker/DatePicker.config.ts b/packages/sdds-insol/src/components/DatePicker/DatePicker.config.ts
index be8c47949b..2150930c74 100644
--- a/packages/sdds-insol/src/components/DatePicker/DatePicker.config.ts
+++ b/packages/sdds-insol/src/components/DatePicker/DatePicker.config.ts
@@ -15,6 +15,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/sdds-insol/src/components/DatePicker/DatePicker.stories.tsx b/packages/sdds-insol/src/components/DatePicker/DatePicker.stories.tsx
index 767b196ac6..709f03fe10 100644
--- a/packages/sdds-insol/src/components/DatePicker/DatePicker.stories.tsx
+++ b/packages/sdds-insol/src/components/DatePicker/DatePicker.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ComponentProps, useEffect, useRef, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 
 import { IconButton } from '../IconButton';
 
@@ -65,6 +65,7 @@ const meta: Meta = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/sdds-insol/src/components/Range/Range.config.ts b/packages/sdds-insol/src/components/Range/Range.config.ts
index e3be0b08fd..9b22d28e98 100644
--- a/packages/sdds-insol/src/components/Range/Range.config.ts
+++ b/packages/sdds-insol/src/components/Range/Range.config.ts
@@ -15,6 +15,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/sdds-insol/src/components/Range/Range.stories.tsx b/packages/sdds-insol/src/components/Range/Range.stories.tsx
index 11dfd44085..b6cb25ea9d 100644
--- a/packages/sdds-insol/src/components/Range/Range.stories.tsx
+++ b/packages/sdds-insol/src/components/Range/Range.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ChangeEvent, ComponentProps, Dispatch, SetStateAction, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 import { IconSearch, IconSber, IconArrowRight } from '@salutejs/plasma-icons';
 
 import { IconButton } from '../IconButton';
@@ -46,6 +46,7 @@ const meta: Meta<typeof Range> = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/sdds-serv/src/components/DatePicker/DatePicker.config.ts b/packages/sdds-serv/src/components/DatePicker/DatePicker.config.ts
index 45070b81c9..c861eb7ea5 100644
--- a/packages/sdds-serv/src/components/DatePicker/DatePicker.config.ts
+++ b/packages/sdds-serv/src/components/DatePicker/DatePicker.config.ts
@@ -15,6 +15,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/sdds-serv/src/components/DatePicker/DatePicker.stories.tsx b/packages/sdds-serv/src/components/DatePicker/DatePicker.stories.tsx
index 767b196ac6..709f03fe10 100644
--- a/packages/sdds-serv/src/components/DatePicker/DatePicker.stories.tsx
+++ b/packages/sdds-serv/src/components/DatePicker/DatePicker.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ComponentProps, useEffect, useRef, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, IconPlaceholder, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 
 import { IconButton } from '../IconButton';
 
@@ -65,6 +65,7 @@ const meta: Meta = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };
 
diff --git a/packages/sdds-serv/src/components/Range/Range.config.ts b/packages/sdds-serv/src/components/Range/Range.config.ts
index f11cb3779a..56b0fbb0c1 100644
--- a/packages/sdds-serv/src/components/Range/Range.config.ts
+++ b/packages/sdds-serv/src/components/Range/Range.config.ts
@@ -15,6 +15,8 @@ export const config = {
                 ${tokens.dividerColor}: var(--text-primary);
                 ${tokens.labelColor}: var(--text-primary);
                 ${tokens.leftHelperColor}: var(--text-secondary);
+                ${tokens.leftHelperColorError}: var(--text-negative);
+                ${tokens.leftHelperColorSuccess}: var(--text-positive);
 
                 ${tokens.textFieldColor}: var(--text-primary);
                 ${tokens.textFieldPlaceholderColor}: var(--text-secondary);
diff --git a/packages/sdds-serv/src/components/Range/Range.stories.tsx b/packages/sdds-serv/src/components/Range/Range.stories.tsx
index 11dfd44085..b6cb25ea9d 100644
--- a/packages/sdds-serv/src/components/Range/Range.stories.tsx
+++ b/packages/sdds-serv/src/components/Range/Range.stories.tsx
@@ -1,7 +1,7 @@
 import React, { ChangeEvent, ComponentProps, Dispatch, SetStateAction, useState } from 'react';
 import type { StoryObj, Meta } from '@storybook/react';
 import { action } from '@storybook/addon-actions';
-import { InSpacingDecorator } from '@salutejs/plasma-sb-utils';
+import { disableProps, InSpacingDecorator } from '@salutejs/plasma-sb-utils';
 import { IconSearch, IconSber, IconArrowRight } from '@salutejs/plasma-icons';
 
 import { IconButton } from '../IconButton';
@@ -46,6 +46,7 @@ const meta: Meta<typeof Range> = {
             },
             if: { arg: 'required', truthy: true },
         },
+        ...disableProps(['view']),
     },
 };