diff --git a/CHANGELOG.md b/CHANGELOG.md
index 3aff5a9cb75e3f44d0246cd98da78541cb3822d1..509b6bb9cfa9feda6b6b326ea50bd6322d046115 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -18,6 +18,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Fixed
 
 * Arrow keys usage for on-screen gamepad
+* Wrong UX for keyboard focus and fullscreen
 
 ## [0.4.1] - 2022-11-06
 
diff --git a/examples/web/react/components/button/button.tsx b/examples/web/react/components/button/button.tsx
index 27a15fcb518552feb1a9af9786f9c3aec9e0d55d..c65deb6913e85d035a87e585be12e49c19161dff 100644
--- a/examples/web/react/components/button/button.tsx
+++ b/examples/web/react/components/button/button.tsx
@@ -21,7 +21,7 @@ export const Button: FC<ButtonProps> = ({
     image,
     imageAlt,
     enabled = false,
-    focusable = false,
+    focusable = true,
     file = false,
     accept = ".txt",
     size = "small",
diff --git a/examples/web/react/components/display/display.css b/examples/web/react/components/display/display.css
index 0781b767f944e7c3e73c50e0533e63bd6cd9f49c..f0e987b779519ae3a66b0069e7596f97b81adfca 100644
--- a/examples/web/react/components/display/display.css
+++ b/examples/web/react/components/display/display.css
@@ -100,5 +100,11 @@
 }
 
 .display > .display-frame > .display-canvas {
+    outline: none;
+    -o-outline: none;
+    -ms-outline: none;
+    -moz-outline: none;
+    -khtml-outline: none;
+    -webkit-outline: none;
     width: 100%;
 }
diff --git a/examples/web/react/components/display/display.tsx b/examples/web/react/components/display/display.tsx
index 821bb268bcf0c1cef87ebc21cc0d09f336d41e81..a71d57aeb22fe77457a11cb59678bd60dc2510e7 100644
--- a/examples/web/react/components/display/display.tsx
+++ b/examples/web/react/components/display/display.tsx
@@ -88,6 +88,7 @@ export const Display: FC<DisplayProps> = ({
 
     useEffect(() => {
         if (fullscreen) {
+            canvasRef.current?.focus();
             resizeRef.current();
             document.getElementsByTagName("body")[0].style.overflow = "hidden";
             window.addEventListener("resize", resizeRef.current);
@@ -139,6 +140,7 @@ export const Display: FC<DisplayProps> = ({
             >
                 <canvas
                     ref={canvasRef}
+                    tabIndex={-1}
                     className="display-canvas"
                     width={options.width * options.scale}
                     height={options.height * options.scale}
diff --git a/examples/web/react/components/keyboard-gb/keyboard-gb.css b/examples/web/react/components/keyboard-gb/keyboard-gb.css
index 70d2cd4e9ea8065fadfa170f333c286888333f1d..fce8fc547108e455ee868cc71b224c423b69a75c 100644
--- a/examples/web/react/components/keyboard-gb/keyboard-gb.css
+++ b/examples/web/react/components/keyboard-gb/keyboard-gb.css
@@ -67,8 +67,8 @@
 
 .keyboard-gb > .dpad .key {
     border: none;
-    padding: 0px 0px 0px 0px;
     font-size: 24px;
+    padding: 0px 0px 0px 0px;
 }
 
 .keyboard-gb > .dpad .key.pressed {
@@ -113,8 +113,8 @@
     -webkit-border-radius: 0px 6px 6px 0px;
     border-right: 3px solid #ffffff;
     border-top: 3px solid #ffffff;
-    margin-right: 0px;
     margin-left: -3px;
+    margin-right: 0px;
 }
 
 .keyboard-gb > .dpad .key.center {
@@ -155,10 +155,10 @@
     -webkit-border-radius: 32px 32px 32px 32px;
     border-width: 3px;
     font-size: 30px;
+    font-weight: 900;
     height: 58px;
     line-height: 52px;
     width: 58px;
-    font-weight: 900;
 }
 
 .keyboard-gb > .action > .key.a {
@@ -179,12 +179,12 @@
 
 .keyboard-gb > .options > .key {
     font-size: 14px;
+    font-weight: 900;
     height: 30px;
     line-height: 26px;
     margin-left: 16px;
     margin-right: 16px;
     min-width: 100px;
-    font-weight: 900;
 }
 
 .keyboard-gb > .break {
diff --git a/examples/web/react/components/modal/modal.css b/examples/web/react/components/modal/modal.css
index bcc2c27ca6885de37f72e0dcbeed5d466fae82ba..6c65b6796283906cea57602ab467e36b975c5a43 100644
--- a/examples/web/react/components/modal/modal.css
+++ b/examples/web/react/components/modal/modal.css
@@ -58,6 +58,12 @@
     -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.5);
     margin-top: 30px;
     max-width: 100%;
+    outline: none;
+    -o-outline: none;
+    -ms-outline: none;
+    -moz-outline: none;
+    -khtml-outline: none;
+    -webkit-outline: none;
     padding: 24px 24px 24px 24px;
     text-align: left;
     transform: scale(0.96);
diff --git a/examples/web/react/components/modal/modal.tsx b/examples/web/react/components/modal/modal.tsx
index c72f676188cba2db6d04e100e553d47e4b4fbbe5..a73a48b162fb084f649331c0d5aca25c8aeac2ef 100644
--- a/examples/web/react/components/modal/modal.tsx
+++ b/examples/web/react/components/modal/modal.tsx
@@ -1,4 +1,4 @@
-import React, { FC, useEffect } from "react";
+import React, { FC, useEffect, useRef } from "react";
 import Button from "../button/button";
 
 import "./modal.css";
@@ -26,6 +26,7 @@ export const Modal: FC<ModalProps> = ({
 }) => {
     const classes = () =>
         ["modal", visible ? "visible" : "", ...style].join(" ");
+    const modalRef = useRef<HTMLDivElement>(null);
     useEffect(() => {
         const onKeyDown = (event: KeyboardEvent) => {
             if (event.key === "Escape") {
@@ -37,6 +38,11 @@ export const Modal: FC<ModalProps> = ({
             document.removeEventListener("keydown", onKeyDown);
         };
     }, []);
+    useEffect(() => {
+        if (visible) {
+            modalRef.current?.focus();
+        }
+    }, [visible]);
     const getTextHtml = (separator = /\n/g) => ({
         __html: text.replace(separator, "<br/>")
     });
@@ -48,7 +54,12 @@ export const Modal: FC<ModalProps> = ({
     };
     return (
         <div className={classes()} onClick={onCancel}>
-            <div className="modal-window" onClick={onWindowClick}>
+            <div
+                ref={modalRef}
+                className="modal-window"
+                onClick={onWindowClick}
+                tabIndex={-1}
+            >
                 <div className="modal-top-buttons">
                     <Button
                         text={""}