diff --git a/public/locales/en/component.json b/public/locales/en/component.json
index 02c37c4bd986..eb8b0099d881 100644
--- a/public/locales/en/component.json
+++ b/public/locales/en/component.json
@@ -3,5 +3,9 @@
     "title": "Components",
     "searchPlaceholder": "Search by component name",
     "color-input_validation-format-error": "Incorrect format",
-    "maintainers": "Maintainers:"
+    "maintainers": "Maintainers:",
+    "theme": "Switch theme",
+    "rtlOn": "Switch RTL on",
+    "rtlOff": "Switch RTL off",
+    "rtlNotSupported": "RTL not supported"
 }
diff --git a/public/locales/ru/component.json b/public/locales/ru/component.json
index d78680c31347..dc452bcf66e3 100644
--- a/public/locales/ru/component.json
+++ b/public/locales/ru/component.json
@@ -2,5 +2,10 @@
     "actions_openInFigma": "Открыть в Figma",
     "title": "Компоненты",
     "searchPlaceholder": "Поиск по названию",
-    "color-input_validation-format-error": "Неверный формат"
+    "color-input_validation-format-error": "Неверный формат",
+    "maintainers": "Maintainers:",
+    "theme": "Переключить тему",
+    "rtlOn": "Включить RTL",
+    "rtlOff": "Выключить RTL",
+    "rtlNotSupported": "RTL не поддерживается"
 }
diff --git a/src/components/SandboxBlock/SandboxBlock.tsx b/src/components/SandboxBlock/SandboxBlock.tsx
index 8e7b9d4b35b5..4c8b6609d186 100644
--- a/src/components/SandboxBlock/SandboxBlock.tsx
+++ b/src/components/SandboxBlock/SandboxBlock.tsx
@@ -1,4 +1,9 @@
-import {ChevronsCollapseUpRight, ChevronsExpandUpRight, TextAlignRight} from '@gravity-ui/icons';
+import {
+    ChevronsCollapseUpRight,
+    ChevronsExpandUpRight,
+    TextAlignLeft,
+    TextAlignRight,
+} from '@gravity-ui/icons';
 import {
     Col,
     Direction,
@@ -13,6 +18,7 @@ import {
     Theme,
     Tooltip,
 } from '@gravity-ui/uikit';
+import {useTranslation} from 'next-i18next';
 import React from 'react';
 
 import themeIcon from '../../assets/icons/theme.svg';
@@ -29,6 +35,8 @@ const SandboxBlock: React.FC<SandboxBlockTypes> = ({
     sandboxConfig,
     isSupportRTL,
 }) => {
+    const {t} = useTranslation('component');
+
     const [props, setProps] = React.useState({});
 
     const [isIframeLoaded, setIsIframeLoaded] = React.useState(false);
@@ -178,6 +186,10 @@ const SandboxBlock: React.FC<SandboxBlockTypes> = ({
         }
     }, [isIframeLoaded, props, iframeTheme, iframeDirection]);
 
+    const isRtl = iframeDirection === 'rtl';
+
+    const rtlIcon = isRtl ? TextAlignRight : TextAlignLeft;
+
     return (
         <div className={b({'full-screen': isFullScreen})}>
             <Row space="0">
@@ -193,39 +205,44 @@ const SandboxBlock: React.FC<SandboxBlockTypes> = ({
                 <Col s="12" l="4" m="4">
                     <div className={b('top-actions')}>
                         <div className={b('top-actions-wrapper')}>
-                            <div
-                                tabIndex={0}
-                                role="button"
-                                className={b('control-icon')}
-                                onClick={() => {
-                                    setIframeTheme(iframeTheme === 'dark' ? 'light' : 'dark');
-                                }}
-                            >
-                                <Icon data={themeIcon} size={18} />
-                            </div>
-                            <div
-                                tabIndex={0}
-                                role="button"
-                                className={
-                                    isSupportRTL ? b('control-icon') : b('control-icon-disabled')
-                                }
-                                onClick={() => {
-                                    if (isSupportRTL) {
-                                        setIframeDirection(
-                                            iframeDirection === 'ltr' ? 'rtl' : 'ltr',
-                                        );
-                                    }
-                                }}
-                            >
-                                {isSupportRTL && (
-                                    <Icon className={b('icon')} data={TextAlignRight} size={18} />
-                                )}
-                                {!isSupportRTL && (
-                                    <Tooltip content={'RTL not supported'}>
-                                        <Icon data={TextAlignRight} size={18} />
-                                    </Tooltip>
-                                )}
-                            </div>
+                            <Tooltip content={t('theme')}>
+                                <div
+                                    tabIndex={0}
+                                    role="button"
+                                    className={b('control-icon')}
+                                    onClick={() => {
+                                        setIframeTheme(iframeTheme === 'dark' ? 'light' : 'dark');
+                                    }}
+                                >
+                                    <Icon data={themeIcon} size={18} />
+                                </div>
+                            </Tooltip>
+
+                            {isSupportRTL && (
+                                <Tooltip content={isRtl ? t('rtlOff') : t('rtlOn')}>
+                                    <div
+                                        tabIndex={0}
+                                        role="button"
+                                        className={b('control-icon')}
+                                        onClick={() => {
+                                            setIframeDirection(isRtl ? 'ltr' : 'rtl');
+                                        }}
+                                    >
+                                        <Icon className={b('icon')} data={rtlIcon} size={18} />
+                                    </div>
+                                </Tooltip>
+                            )}
+                            {!isSupportRTL && (
+                                <Tooltip content={t('rtlNotSupported')}>
+                                    <div
+                                        tabIndex={0}
+                                        role="button"
+                                        className={b('control-icon-disabled')}
+                                    >
+                                        <Icon data={rtlIcon} size={18} />
+                                    </div>
+                                </Tooltip>
+                            )}
                         </div>
                         <div
                             tabIndex={0}