diff --git a/src/components/html/Modal/ModalPortal.jsx b/src/components/html/Modal/ModalPortal.jsx
new file mode 100644
index 0000000..0d93074
--- /dev/null
+++ b/src/components/html/Modal/ModalPortal.jsx
@@ -0,0 +1,35 @@
+import React from "react";
+import * as ReactDOM from "react-dom";
+
+export default class ModalPortal extends React.Component {
+    constructor(props) {
+        super(props);
+        this.portalElement = null;
+    }
+
+    componentDidMount() {
+        var p = document.createElement('div');
+        p.id = this.props.portalId;
+        document.body.appendChild(p);
+
+        this.portalElement = p;
+
+        this.componentDidUpdate();
+    }
+
+    componentWillUnmount() {
+        document.body.removeChild(this.portalElement);
+        ReactDOM.unmountComponentAtNode(this.portalElement)
+    }
+
+    componentDidUpdate() {
+        ReactDOM.render(
+            <React.Fragment>{this.props.children}</React.Fragment>,
+            this.portalElement
+        );
+    }
+
+    render() {
+        return null;
+    }
+}
diff --git a/src/components/html/Modal/MountedModal.jsx b/src/components/html/Modal/MountedModal.jsx
new file mode 100644
index 0000000..6b5d489
--- /dev/null
+++ b/src/components/html/Modal/MountedModal.jsx
@@ -0,0 +1,19 @@
+import React from "react";
+import ModalPortal from "./ModalPortal";
+import Modal from "./Modal";
+
+export default class MountedModal extends React.Component {
+    render() {
+        if (this.props.show === false) {
+            return null;
+        }
+
+        return <ModalPortal portalId="react-modal-container">
+            <Modal style={{display: 'block'}} className="in">
+                {this.props.children}
+            </Modal>
+
+            <div className="modal__backdrop in" />
+        </ModalPortal>
+    }
+}