diff --git a/installers/charm/ng-ui/.yamllint.yaml b/installers/charm/ng-ui/.yamllint.yaml
new file mode 100644
index 0000000..ab52c60
--- /dev/null
+++ b/installers/charm/ng-ui/.yamllint.yaml
@@ -0,0 +1,23 @@
+# Copyright 2020 Canonical Ltd.
+#
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+#
+#     http://www.apache.org/licenses/LICENSE-2.0
+#
+#     Unless required by applicable law or agreed to in writing, software
+#     distributed under the License is distributed on an "AS IS" BASIS,
+#     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+#     See the License for the specific language governing permissions and
+#     limitations under the License.
+---
+extends: default
+
+yaml-files:
+  - "*.yaml"
+  - "*.yml"
+  - ".yamllint"
+ignore: |
+  .tox
+  mod
diff --git a/installers/charm/ng-ui/README.md b/installers/charm/ng-ui/README.md
new file mode 100644
index 0000000..e6a3d58
--- /dev/null
+++ b/installers/charm/ng-ui/README.md
@@ -0,0 +1,57 @@
+<!-- #   Copyright 2020 Canonical Ltd.
+#
+#   Licensed under the Apache License, Version 2.0 (the "License");
+#   you may not use this file except in compliance with the License.
+#   You may obtain a copy of the License at
+#
+#       http://www.apache.org/licenses/LICENSE-2.0
+#
+#   Unless required by applicable law or agreed to in writing, software
+#   distributed under the License is distributed on an "AS IS" BASIS,
+#   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+#   See the License for the specific language governing permissions and
+#   limitations under the License. -->
+
+# NG-UI Charm
+
+## How to deploy
+
+```bash
+juju deploy . # cs:~charmed-osm/ng-ui --channel edge
+juju relate ng-ui nbi-k8s
+```
+
+## How to expose the NG-UI through ingress
+
+```bash
+juju config ng-ui juju-external-hostname=ng.<k8s_worker_ip>.xip.io
+juju expose ng-ui
+```
+
+> Note: The <k8s_worker_ip> is the IP of the K8s worker node. With microk8s, you can see the IP with `microk8s.config`. It is usually the IP of your host machine.
+
+## How to scale
+
+```bash
+    juju scale-application ng-ui 3
+```
+
+## How to use certificates
+
+Generate your own certificate if you don't have one already:
+
+```bash
+sudo openssl req -x509 -nodes -days 365 -newkey rsa:2048 -keyout ssl_certificate.key -out ssl_certificate.crt
+sudo chown $USER:$USER ssl_certificate.key
+juju config ng-ui ssl_certificate=`cat ssl_certificate.crt | base64 -w 0`
+juju config ng-ui ssl_certificate_key=`cat ssl_certificate.key | base64 -w 0`
+```
+
+## Config Examples
+
+```bash
+juju config ng-ui image=opensourcemano/ng-ui:<tag>
+juju config ng-ui port=80
+juju config server_name=<name>
+juju config client_max_body_size=25M
+```
diff --git a/installers/charm/ng-ui/config.yaml b/installers/charm/ng-ui/config.yaml
new file mode 100644
index 0000000..a80a280
--- /dev/null
+++ b/installers/charm/ng-ui/config.yaml
@@ -0,0 +1,44 @@
+# -*- coding: utf-8 -*-
+
+# Copyright 2020 Arctos Labs Scandinavia AB
+#
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+#
+#    http://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+# implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+
+options:
+  image:
+    description: Docker image name
+    type: string
+    default: opensourcemano/ng-ui:8
+  port:
+    description: Port number
+    type: int
+    default: 80
+  https_port:
+    description: Port number
+    type: int
+    default: 443
+  server_name:
+    description: Server name
+    type: string
+    default: localhost
+  client_max_body_size:
+    description: Client maximum body size
+    type: string
+    default: 15M
+  ssl_certificate:
+    description: Base64 encoded ssl certificate
+    type: string
+  ssl_certificate_key:
+    description: Base64 encoded ssl certificate key
+    type: string
diff --git a/installers/charm/ng-ui/files/default b/installers/charm/ng-ui/files/default
new file mode 100644
index 0000000..e014715
--- /dev/null
+++ b/installers/charm/ng-ui/files/default
@@ -0,0 +1,37 @@
+#   Copyright 2020 Canonical Ltd.
+#
+#   Licensed under the Apache License, Version 2.0 (the "License");
+#   you may not use this file except in compliance with the License.
+#   You may obtain a copy of the License at
+#
+#       http://www.apache.org/licenses/LICENSE-2.0
+#
+#   Unless required by applicable law or agreed to in writing, software
+#   distributed under the License is distributed on an "AS IS" BASIS,
+#   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+#   See the License for the specific language governing permissions and
+#   limitations under the License.
+
+
+
+server {
+    listen $http_port;
+    listen $https_port default ssl;
+    server_name  $server_name;
+    root   /usr/share/nginx/html;
+    index  index.html index.htm;
+    client_max_body_size $client_max_body_size;
+    $ssl_crt
+    $ssl_crt_key
+    ssl_protocols       TLSv1 TLSv1.1 TLSv1.2;
+    ssl_ciphers EECDH+AESGCM:EDH+AESGCM:AES256+EECDH:AES256+EDH;
+    location /osm {
+        proxy_pass https://$nbi_host:$nbi_port;
+        proxy_next_upstream error timeout invalid_header http_500 http_502 http_503 http_504;
+        proxy_set_header Accept-Encoding "";
+    }
+
+    location / {
+        try_files $$uri $$uri/ /index.html;
+    }
+}
diff --git a/installers/charm/ng-ui/hooks/start b/installers/charm/ng-ui/hooks/start
new file mode 120000
index 0000000..25b1f68
--- /dev/null
+++ b/installers/charm/ng-ui/hooks/start
@@ -0,0 +1 @@
+../src/charm.py
\ No newline at end of file
diff --git a/installers/charm/ng-ui/lib/ops b/installers/charm/ng-ui/lib/ops
new file mode 120000
index 0000000..d934193
--- /dev/null
+++ b/installers/charm/ng-ui/lib/ops
@@ -0,0 +1 @@
+../mod/operator/ops
\ No newline at end of file
diff --git a/installers/charm/ng-ui/metadata.yaml b/installers/charm/ng-ui/metadata.yaml
new file mode 100644
index 0000000..a0a5921
--- /dev/null
+++ b/installers/charm/ng-ui/metadata.yaml
@@ -0,0 +1,27 @@
+#   Copyright 2020 Canonical Ltd.
+#
+#   Licensed under the Apache License, Version 2.0 (the "License");
+#   you may not use this file except in compliance with the License.
+#   You may obtain a copy of the License at
+#
+#       http://www.apache.org/licenses/LICENSE-2.0
+#
+#   Unless required by applicable law or agreed to in writing, software
+#   distributed under the License is distributed on an "AS IS" BASIS,
+#   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+#   See the License for the specific language governing permissions and
+#   limitations under the License.
+
+name: ng-ui
+summary: A Next Generation UI charm for Opensource MANO
+description: |
+  New UI for OSM
+series:
+  - kubernetes
+min-juju-version: 2.7.0
+deployment:
+  type: stateless
+  service: cluster
+requires:
+  nbi:
+    interface: osm-nbi
diff --git a/installers/charm/ng-ui/mod/operator b/installers/charm/ng-ui/mod/operator
new file mode 160000
index 0000000..a84ce87
--- /dev/null
+++ b/installers/charm/ng-ui/mod/operator
@@ -0,0 +1 @@
+Subproject commit a84ce8776b368a8b2bccdb173716e342db9a6b36
diff --git a/installers/charm/ng-ui/src/charm.py b/installers/charm/ng-ui/src/charm.py
new file mode 100755
index 0000000..ce48927
--- /dev/null
+++ b/installers/charm/ng-ui/src/charm.py
@@ -0,0 +1,200 @@
+#!/usr/bin/env python3
+#   Copyright 2020 Canonical Ltd.
+#
+#   Licensed under the Apache License, Version 2.0 (the "License");
+#   you may not use this file except in compliance with the License.
+#   You may obtain a copy of the License at
+#
+#       http://www.apache.org/licenses/LICENSE-2.0
+#
+#   Unless required by applicable law or agreed to in writing, software
+#   distributed under the License is distributed on an "AS IS" BASIS,
+#   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+#   See the License for the specific language governing permissions and
+#   limitations under the License.
+
+import sys
+import logging
+import base64
+
+sys.path.append("lib")
+
+from ops.charm import CharmBase
+from ops.framework import StoredState, Object
+from ops.main import main
+from ops.model import (
+    ActiveStatus,
+    MaintenanceStatus,
+    BlockedStatus,
+    ModelError,
+    WaitingStatus,
+)
+
+from glob import glob
+from pathlib import Path
+from string import Template
+
+logger = logging.getLogger(__name__)
+
+
+class NGUICharm(CharmBase):
+    state = StoredState()
+
+    def __init__(self, framework, key):
+        super().__init__(framework, key)
+        self.state.set_default(spec=None)
+        self.state.set_default(nbi_host=None)
+        self.state.set_default(nbi_port=None)
+
+        # Observe Charm related events
+        self.framework.observe(self.on.config_changed, self.on_config_changed)
+        self.framework.observe(self.on.start, self.on_start)
+        self.framework.observe(self.on.upgrade_charm, self.on_upgrade_charm)
+        self.framework.observe(
+            self.on.nbi_relation_changed, self.on_nbi_relation_changed
+        )
+
+        # SSL Certificate path
+        self.ssl_folder = "/certs"
+        self.ssl_crt_name = "ssl_certificate.crt"
+        self.ssl_key_name = "ssl_certificate.key"
+
+    def _apply_spec(self):
+        # Only apply the spec if this unit is a leader.
+        unit = self.model.unit
+        if not unit.is_leader():
+            unit.status = ActiveStatus("ready")
+            return
+        if not self.state.nbi_host or not self.state.nbi_port:
+            unit.status = WaitingStatus("Waiting for NBI")
+            return
+        unit.status = MaintenanceStatus("Applying new pod spec")
+
+        new_spec = self.make_pod_spec()
+        if new_spec == self.state.spec:
+            unit.status = ActiveStatus("ready")
+            return
+        self.framework.model.pod.set_spec(new_spec)
+        self.state.spec = new_spec
+        unit.status = ActiveStatus("ready")
+
+    def make_pod_spec(self):
+        config = self.framework.model.config
+
+        config_spec = {
+            "http_port": config["port"],
+            "https_port": config["https_port"],
+            "server_name": config["server_name"],
+            "client_max_body_size": config["client_max_body_size"],
+            "nbi_host": self.state.nbi_host or config["nbi_host"],
+            "nbi_port": self.state.nbi_port or config["nbi_port"],
+            "ssl_crt": "",
+            "ssl_crt_key": "",
+        }
+
+        ssl_certificate = None
+        ssl_certificate_key = None
+        ssl_enabled = False
+
+        if "ssl_certificate" in config and "ssl_certificate_key" in config:
+            # Get bytes of cert and key
+            cert_b = base64.b64decode(config["ssl_certificate"])
+            key_b = base64.b64decode(config["ssl_certificate_key"])
+            # Decode key and cert
+            ssl_certificate = cert_b.decode("utf-8")
+            ssl_certificate_key = key_b.decode("utf-8")
+            # Get paths
+            cert_path = "{}/{}".format(self.ssl_folder, self.ssl_crt_name)
+            key_path = "{}/{}".format(self.ssl_folder, self.ssl_key_name)
+
+            config_spec["port"] = "{} ssl".format(config["https_port"])
+            config_spec["ssl_crt"] = "ssl_certificate {};".format(cert_path)
+            config_spec["ssl_crt_key"] = "ssl_certificate_key {};".format(key_path)
+            ssl_enabled = True
+        else:
+            config_spec["ssl_crt"] = ""
+            config_spec["ssl_crt_key"] = ""
+
+        files = [
+            {
+                "name": "configuration",
+                "mountPath": "/etc/nginx/sites-available/",
+                "files": {
+                    Path(filename)
+                    .name: Template(Path(filename).read_text())
+                    .substitute(config_spec)
+                    for filename in glob("files/*")
+                },
+            }
+        ]
+        port = config["https_port"] if ssl_enabled else config["port"]
+        ports = [
+            {"name": "port", "containerPort": port, "protocol": "TCP", },
+        ]
+
+        kubernetes = {
+            "readinessProbe": {
+                "tcpSocket": {"port": port},
+                "timeoutSeconds": 5,
+                "periodSeconds": 5,
+                "initialDelaySeconds": 10,
+            },
+            "livenessProbe": {
+                "tcpSocket": {"port": port},
+                "timeoutSeconds": 5,
+                "initialDelaySeconds": 45,
+            },
+        }
+
+        if ssl_certificate and ssl_certificate_key:
+            files.append(
+                {
+                    "name": "ssl",
+                    "mountPath": self.ssl_folder,
+                    "files": {
+                        self.ssl_crt_name: ssl_certificate,
+                        self.ssl_key_name: ssl_certificate_key,
+                    },
+                }
+            )
+        logger.debug(files)
+        spec = {
+            "version": 2,
+            "containers": [
+                {
+                    "name": self.framework.model.app.name,
+                    "image": "{}".format(config["image"]),
+                    "ports": ports,
+                    "kubernetes": kubernetes,
+                    "files": files,
+                }
+            ],
+        }
+
+        return spec
+
+    def on_config_changed(self, event):
+        """Handle changes in configuration"""
+        self._apply_spec()
+
+    def on_start(self, event):
+        """Called when the charm is being installed"""
+        self._apply_spec()
+
+    def on_upgrade_charm(self, event):
+        """Upgrade the charm."""
+        unit = self.model.unit
+        unit.status = MaintenanceStatus("Upgrading charm")
+        self.on_start(event)
+
+    def on_nbi_relation_changed(self, event):
+        unit = self.model.unit
+        if not unit.is_leader():
+            return
+        self.state.nbi_host = event.relation.data[event.unit].get("host")
+        self.state.nbi_port = event.relation.data[event.unit].get("port")
+        self._apply_spec()
+
+
+if __name__ == "__main__":
+    main(NGUICharm)
diff --git a/installers/charm/ng-ui/tox.ini b/installers/charm/ng-ui/tox.ini
new file mode 100644
index 0000000..aafa301
--- /dev/null
+++ b/installers/charm/ng-ui/tox.ini
@@ -0,0 +1,55 @@
+#   Copyright 2020 Canonical Ltd.
+#
+#   Licensed under the Apache License, Version 2.0 (the "License");
+#   you may not use this file except in compliance with the License.
+#   You may obtain a copy of the License at
+#
+#       http://www.apache.org/licenses/LICENSE-2.0
+#
+#   Unless required by applicable law or agreed to in writing, software
+#   distributed under the License is distributed on an "AS IS" BASIS,
+#   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+#   See the License for the specific language governing permissions and
+#   limitations under the License.
+[tox]
+envlist = pep8
+skipsdist = True
+
+[testenv]
+setenv = VIRTUAL_ENV={envdir}
+         PYTHONHASHSEED=0
+whitelist_externals = juju
+passenv = HOME TERM CS_API_* OS_* AMULET_*
+deps = -r{toxinidir}/test-requirements.txt
+install_command =
+  pip install {opts} {packages}
+
+[testenv:black]
+basepython = python3
+deps =
+    black
+    yamllint
+commands =
+    black --check --diff src
+    yamllint .
+
+[testenv:pep8]
+basepython = python3
+deps=charm-tools
+commands = charm-proof
+
+[testenv:func-noop]
+basepython = python3
+commands =
+    true
+
+[testenv:func]
+basepython = python3
+commands = functest-run-suite
+
+[testenv:func-smoke]
+basepython = python3
+commands = functest-run-suite --keep-model --smoke
+
+[testenv:venv]
+commands = {posargs}