diff --git a/src/common/Button/Button.js b/src/common/Button/Button.js
index 7e87b2e38..d163a3413 100644
--- a/src/common/Button/Button.js
+++ b/src/common/Button/Button.js
@@ -1,10 +1,10 @@
 const React = require('react');
 const classnames = require('classnames');
-const { useFocusable } = require('stremio-router');
+const useTabIndex = require('stremio/common/useTabIndex');
 const styles = require('./styles');
 
 const Button = React.forwardRef(({ children, ...props }, ref) => {
-    const focusable = useFocusable();
+    const tabIndex = useTabIndex(props.tabIndex, props.disabled);
     const onKeyUp = React.useCallback((event) => {
         if (typeof props.onKeyUp === 'function') {
             props.onKeyUp(event);
@@ -29,10 +29,10 @@ const Button = React.forwardRef(({ children, ...props }, ref) => {
     return React.createElement(
         typeof props.href === 'string' && props.href.length > 0 ? 'a' : 'div',
         {
-            tabIndex: focusable && !props.disabled ? 0 : -1,
             ...props,
             ref,
             className: classnames(props.className, styles['button-container'], { 'disabled': props.disabled }),
+            tabIndex,
             onKeyUp,
             onMouseDown
         },
diff --git a/src/common/TextInput/TextInput.js b/src/common/TextInput/TextInput.js
index 3cf5f5e7b..910a1529d 100644
--- a/src/common/TextInput/TextInput.js
+++ b/src/common/TextInput/TextInput.js
@@ -1,10 +1,10 @@
 const React = require('react');
 const classnames = require('classnames');
-const { useFocusable } = require('stremio-router');
+const useTabIndex = require('stremio/common/useTabIndex');
 const styles = require('./styles');
 
 const TextInput = React.forwardRef((props, ref) => {
-    const focusable = useFocusable();
+    const tabIndex = useTabIndex(props.tabIndex, props.disabled);
     const onKeyUp = React.useCallback((event) => {
         if (typeof props.onKeyUp === 'function') {
             props.onKeyUp(event);
@@ -21,10 +21,10 @@ const TextInput = React.forwardRef((props, ref) => {
             autoCapitalize={'off'}
             autoComplete={'off'}
             spellCheck={false}
-            tabIndex={focusable && !props.disabled ? 0 : -1}
             {...props}
             ref={ref}
             className={classnames(props.className, styles['text-input-container'], { 'disabled': props.disabled })}
+            tabIndex={tabIndex}
             onKeyUp={onKeyUp}
         />
     );
diff --git a/src/common/index.js b/src/common/index.js
index 9afac5aba..b22b17376 100644
--- a/src/common/index.js
+++ b/src/common/index.js
@@ -20,6 +20,7 @@ const useBinaryState = require('./useBinaryState');
 const useFullscreen = require('./useFullscreen');
 const useLocationHash = require('./useLocationHash');
 const useRouteActive = require('./useRouteActive');
+const useTabIndex = require('./useTabIndex');
 
 module.exports = {
     Button,
@@ -43,5 +44,6 @@ module.exports = {
     useBinaryState,
     useFullscreen,
     useLocationHash,
-    useRouteActive
+    useRouteActive,
+    useTabIndex
 };
diff --git a/src/common/useTabIndex.js b/src/common/useTabIndex.js
new file mode 100644
index 000000000..fc74a088d
--- /dev/null
+++ b/src/common/useTabIndex.js
@@ -0,0 +1,11 @@
+const { useFocusable } = require('stremio-router');
+
+const useTabIndex = (tabIndex, disabled) => {
+    const focusable = useFocusable();
+    return (tabIndex === null || isNaN(tabIndex)) ?
+        (focusable && !disabled ? 0 : -1)
+        :
+        tabIndex;
+};
+
+module.exports = useTabIndex;