diff --git a/src/routes/Player/ControlBar/ControlBar.js b/src/routes/Player/ControlBar/ControlBar.js
index 646be59a5..3bf4d4017 100644
--- a/src/routes/Player/ControlBar/ControlBar.js
+++ b/src/routes/Player/ControlBar/ControlBar.js
@@ -33,6 +33,7 @@ class ControlBar extends Component {
             nextProps.volume !== this.props.volume ||
             nextProps.subtitleTracks !== this.props.subtitleTracks ||
             nextProps.selectedSubtitleTrackId !== this.props.selectedSubtitleTrackId ||
+            nextProps.subtitleSize !== this.props.subtitleSize ||
             nextState.sharePopupOpen !== this.state.sharePopupOpen ||
             nextState.subtitlesPopupOpen !== this.state.subtitlesPopupOpen;
     }
@@ -49,6 +50,10 @@ class ControlBar extends Component {
         this.props.setSelectedSubtitleTrackId(selectedSubtitleTrackId);
     }
 
+    setSubtitleSize = (size) => {
+        this.props.setSubtitleSize(size);
+    }
+
     mute = () => {
         this.props.mute();
     }
@@ -142,8 +147,10 @@ class ControlBar extends Component {
                     <SubtitlesPicker
                         className={classnames(styles['popup-content'], styles['subtitles-popup-content'])}
                         subtitleTracks={this.props.subtitleTracks}
+                        subtitleSize={this.props.subtitleSize}
                         selectedSubtitleTrackId={this.props.selectedSubtitleTrackId}
                         setSelectedSubtitleTrackId={this.setSelectedSubtitleTrackId}
+                        setSubtitleSize={this.setSubtitleSize}
                     />
                 </Popup.Menu>
             </Popup >
diff --git a/src/routes/Player/ControlBar/SubtitlesPicker/SubtitlesPicker.js b/src/routes/Player/ControlBar/SubtitlesPicker/SubtitlesPicker.js
index e4ceb2861..d4cb4346e 100644
--- a/src/routes/Player/ControlBar/SubtitlesPicker/SubtitlesPicker.js
+++ b/src/routes/Player/ControlBar/SubtitlesPicker/SubtitlesPicker.js
@@ -39,6 +39,10 @@ class SubtitlesPicker extends PureComponent {
         this.props.setSelectedSubtitleTrackId(event.currentTarget.dataset.trackId);
     }
 
+    setSubtitleSize = (event) => {
+        this.props.setSubtitleSize(event.currentTarget.dataset.value);
+    }
+
     renderToggleButton({ selectedTrack }) {
         return (
             <div className={styles['toggle-button-container']} onClick={this.toggleOnClick}>
@@ -81,6 +85,24 @@ class SubtitlesPicker extends PureComponent {
         );
     }
 
+    renderNumberInput({ value, unit, onChange }) {
+        if (value === null) {
+            return null;
+        }
+
+        return (
+            <div className={styles['number-input-container']}>
+                <div className={styles['number-input-button']} data-value={value - 1} onClick={onChange}>
+                    <Icon className={styles['number-input-icon']} icon={'ic_minus'} />
+                </div>
+                <div className={styles['number-input-value']}>{value}{unit}</div>
+                <div className={styles['number-input-button']} data-value={value + 1} onClick={onChange}>
+                    <Icon className={styles['number-input-icon']} icon={'ic_plus'} />
+                </div>
+            </div>
+        );
+    }
+
     renderPreferences({ groupedTracks, selectedTrack }) {
         if (!selectedTrack) {
             return (
@@ -120,15 +142,7 @@ class SubtitlesPicker extends PureComponent {
                         <Icon className={styles['number-input-icon']} icon={'ic_plus'} />
                     </div>
                 </div>
-                <div className={styles['number-input-container']}>
-                    <div className={styles['number-input-button']}>
-                        <Icon className={styles['number-input-icon']} icon={'ic_minus'} />
-                    </div>
-                    <div className={styles['number-input-value']}>17pt</div>
-                    <div className={styles['number-input-button']}>
-                        <Icon className={styles['number-input-icon']} icon={'ic_plus'} />
-                    </div>
-                </div>
+                {this.renderNumberInput({ value: this.props.subtitleSize, unit: 'pt', onChange: this.setSubtitleSize })}
             </div>
         );
     }
diff --git a/src/routes/Player/Player.js b/src/routes/Player/Player.js
index b230fc86b..9a6521768 100644
--- a/src/routes/Player/Player.js
+++ b/src/routes/Player/Player.js
@@ -16,7 +16,8 @@ class Player extends Component {
             duration: null,
             volume: null,
             subtitleTracks: [],
-            selectedSubtitleTrackId: null
+            selectedSubtitleTrackId: null,
+            subtitleSize: null
         };
     }
 
@@ -26,7 +27,8 @@ class Player extends Component {
             nextState.duration !== this.state.duration ||
             nextState.volume !== this.state.volume ||
             nextState.subtitleTracks !== this.state.subtitleTracks ||
-            nextState.selectedSubtitleTrackId !== this.state.selectedSubtitleTrackId;
+            nextState.selectedSubtitleTrackId !== this.state.selectedSubtitleTrackId ||
+            nextState.subtitleSize !== this.state.subtitleSize;
     }
 
     componentDidMount() {
@@ -74,6 +76,10 @@ class Player extends Component {
         this.videoRef.current && this.videoRef.current.dispatch('setProp', 'selectedSubtitleTrackId', selectedSubtitleTrackId);
     }
 
+    setSubtitleSize = (size) => {
+        this.videoRef.current && this.videoRef.current.dispatch('setProp', 'subtitleSize', size);
+    }
+
     mute = () => {
         this.videoRef.current && this.videoRef.current.dispatch('command', 'mute');
     }
@@ -117,11 +123,13 @@ class Player extends Component {
                 volume={this.state.volume}
                 subtitleTracks={this.state.subtitleTracks}
                 selectedSubtitleTrackId={this.state.selectedSubtitleTrackId}
+                subtitleSize={this.state.subtitleSize}
                 play={this.play}
                 pause={this.pause}
                 setTime={this.setTime}
                 setVolume={this.setVolume}
                 setSelectedSubtitleTrackId={this.setSelectedSubtitleTrackId}
+                setSubtitleSize={this.setSubtitleSize}
                 mute={this.mute}
                 unmute={this.unmute}
             />
diff --git a/src/routes/Player/Video/stremio-video/HTMLVideo.js b/src/routes/Player/Video/stremio-video/HTMLVideo.js
index 541b33c88..29ee189a3 100644
--- a/src/routes/Player/Video/stremio-video/HTMLVideo.js
+++ b/src/routes/Player/Video/stremio-video/HTMLVideo.js
@@ -20,7 +20,7 @@ var HTMLVideo = function(container) {
 
     container.appendChild(styles);
     styles.sheet.insertRule('#' + container.id + ' video { width: 100%; height: 100%; position: relative; z-index: 0; }', styles.sheet.cssRules.length);
-    styles.sheet.insertRule('#' + container.id + ' .subtitles { position: absolute; right: 0; bottom: 120px; left: 0; font-size: 22px; color: white; text-align: center; }', styles.sheet.cssRules.length);
+    var subtitleStylesIndex = styles.sheet.insertRule('#' + container.id + ' .subtitles { position: absolute; right: 0; bottom: 120px; left: 0; font-size: 22px; color: white; text-align: center; }', styles.sheet.cssRules.length);
     container.appendChild(video);
     video.crossOrigin = 'anonymous';
     video.controls = false;
@@ -65,6 +65,9 @@ var HTMLVideo = function(container) {
 
         return selectedSubtitleTrackId;
     }
+    function getSubtitleSize() {
+        return parseInt(styles.sheet.cssRules[subtitleStylesIndex].style.fontSize);
+    }
     function onEnded() {
         events.emit('ended');
     }
@@ -121,6 +124,9 @@ var HTMLVideo = function(container) {
     function onSelectedSubtitleTrackIdChanged() {
         events.emit('propChanged', 'selectedSubtitleTrackId', getSelectedSubtitleTrackId());
     }
+    function onSubtitleSizeChanged() {
+        events.emit('propChanged', 'subtitleSize', getSubtitleSize());
+    }
     function updateSubtitlesText() {
         while (subtitles.hasChildNodes()) {
             subtitles.removeChild(subtitles.lastChild);
@@ -189,6 +195,9 @@ var HTMLVideo = function(container) {
                     case 'selectedSubtitleTrackId':
                         events.emit('propValue', 'selectedSubtitleTrackId', getSelectedSubtitleTrackId());
                         return;
+                    case 'subtitleSize':
+                        events.emit('propValue', 'subtitleSize', getSubtitleSize());
+                        return;
                     default:
                         throw new Error('observeProp not supported: ' + arguments[1]);
                 }
@@ -237,6 +246,12 @@ var HTMLVideo = function(container) {
                             onSelectedSubtitleTrackIdChanged();
                         }
                         break;
+                    case 'subtitleSize':
+                        if (!isNaN(arguments[2])) {
+                            styles.sheet.cssRules[subtitleStylesIndex].style.fontSize = parseInt(arguments[2]) + 'px';
+                            onSubtitleSizeChanged();
+                        }
+                        return;
                     case 'volume':
                         if (!isNaN(arguments[2])) {
                             video.muted = false;
@@ -353,7 +368,7 @@ var HTMLVideo = function(container) {
 HTMLVideo.manifest = {
     name: 'HTMLVideo',
     embedded: true,
-    props: ['paused', 'time', 'duration', 'volume', 'subtitleTracks', 'selectedSubtitleTrackId']
+    props: ['paused', 'time', 'duration', 'volume', 'subtitleTracks', 'selectedSubtitleTrackId', 'subtitleSize']
 };
 
 module.exports = HTMLVideo;