diff --git a/apps/contract-verification/src/app/app.tsx b/apps/contract-verification/src/app/app.tsx
index 0ea4332543..85ebbfb19b 100644
--- a/apps/contract-verification/src/app/app.tsx
+++ b/apps/contract-verification/src/app/app.tsx
@@ -13,6 +13,7 @@ import { CompilerAbstract } from '@remix-project/remix-solidity'
 import { useLocalStorage } from './hooks/useLocalStorage'
 import { getVerifier } from './Verifiers'
 import { ContractDropdownSelection } from './components/ContractDropdown'
+import { IntlProvider } from 'react-intl'
 
 const plugin = new ContractVerificationPluginClient()
 
@@ -32,11 +33,25 @@ const App = () => {
   const [proxyAddressError, setProxyAddressError] = useState('')
   const [abiEncodedConstructorArgs, setAbiEncodedConstructorArgs] = useState<string>('')
   const [abiEncodingError, setAbiEncodingError] = useState<string>('')
+  const [locale, setLocale] = useState<{ code: string; messages: any }>({
+    code: 'en',
+    messages: {}
+  })
 
   const timer = useRef(null)
 
   useEffect(() => {
     plugin.internalEvents.on('verification_activated', () => {
+
+      // @ts-ignore
+      plugin.call('locale', 'currentLocale').then((locale: any) => {
+        setLocale(locale)
+      })
+
+      // @ts-ignore
+      plugin.on('locale', 'localeChanged', (locale: any) => {
+        setLocale(locale)
+      })
       // Fetch compiler artefacts initially
       plugin.call('compilerArtefacts' as any, 'getAllCompilerAbstracts').then((obj: any) => {
         setCompilationOutput(obj)
@@ -143,11 +158,13 @@ const App = () => {
   }, [submittedContracts])
 
   return (
-    <AppContext.Provider value={{ themeType, setThemeType, clientInstance: plugin, settings, setSettings, chains, compilationOutput, submittedContracts, setSubmittedContracts }}>
-      <VerifyFormContext.Provider value={{ selectedChain, setSelectedChain, contractAddress, setContractAddress, contractAddressError, setContractAddressError, selectedContract, setSelectedContract, proxyAddress, setProxyAddress, proxyAddressError, setProxyAddressError, abiEncodedConstructorArgs, setAbiEncodedConstructorArgs, abiEncodingError, setAbiEncodingError }}>
-        <DisplayRoutes />
-      </VerifyFormContext.Provider>
-    </AppContext.Provider>
+    <IntlProvider locale={locale.code} messages={locale.messages}>
+      <AppContext.Provider value={{ themeType, setThemeType, clientInstance: plugin, settings, setSettings, chains, compilationOutput, submittedContracts, setSubmittedContracts }}>
+        <VerifyFormContext.Provider value={{ selectedChain, setSelectedChain, contractAddress, setContractAddress, contractAddressError, setContractAddressError, selectedContract, setSelectedContract, proxyAddress, setProxyAddress, proxyAddressError, setProxyAddressError, abiEncodedConstructorArgs, setAbiEncodedConstructorArgs, abiEncodingError, setAbiEncodingError }}>
+          <DisplayRoutes />
+        </VerifyFormContext.Provider>
+      </AppContext.Provider>
+    </IntlProvider>
   )
 }
 
diff --git a/apps/contract-verification/src/app/components/ContractAddressInput.tsx b/apps/contract-verification/src/app/components/ContractAddressInput.tsx
index 5eb6e73d1e..ef0af854b0 100644
--- a/apps/contract-verification/src/app/components/ContractAddressInput.tsx
+++ b/apps/contract-verification/src/app/components/ContractAddressInput.tsx
@@ -2,11 +2,11 @@ import React, { useEffect, useState, useContext } from 'react'
 import { ethers } from 'ethers/'
 
 interface ContractAddressInputProps {
-  label: string
+  label: string | any
   id: string
   contractAddress: string
   setContractAddress: (address: string) => void
-  contractAddressError: string
+  contractAddressError: string | any
   setContractAddressError: (error: string) => void
 }
 
diff --git a/apps/contract-verification/src/app/components/NavMenu.tsx b/apps/contract-verification/src/app/components/NavMenu.tsx
index d835e1a193..22e5199f5a 100644
--- a/apps/contract-verification/src/app/components/NavMenu.tsx
+++ b/apps/contract-verification/src/app/components/NavMenu.tsx
@@ -1,13 +1,15 @@
 import React from 'react'
 import { NavLink } from 'react-router-dom'
+import { useIntl, FormattedMessage } from 'react-intl'
 
 interface NavItemProps {
   to: string
   icon: JSX.Element
-  title: string
+  title: string | any
 }
 
 const NavItem: React.FC<NavItemProps> = ({ to, icon, title }) => {
+  const intl = useIntl()
   return (
     <NavLink
       data-id={`${title}Tab`}
@@ -24,11 +26,11 @@ const NavItem: React.FC<NavItemProps> = ({ to, icon, title }) => {
 
 export const NavMenu = () => {
   return (
-    <nav className="d-flex medium flex-row w-100" style={{backgroundColor: 'var(--body-bg)!important'}}>
-      <NavItem to="/" icon={<i className="fas fa-home"></i>} title="Verify" />
-      <NavItem to="/receipts" icon={<i className="fas fa-receipt"></i>} title="Receipts" />
-      <NavItem to="/lookup" icon={<i className="fas fa-search"></i>} title="Lookup" />
-      <NavItem to="/settings" icon={<i className="fas fa-cog"></i>} title="Settings" />
+    <nav className="d-flex medium flex-row w-100" style={{ backgroundColor: 'var(--body-bg)!important' }}>
+      <NavItem to="/" icon={<i className="fas fa-home"></i>} title={ <FormattedMessage id="contractverification.verifyNavTitle" /> } />
+      <NavItem to="/receipts" icon={<i className="fas fa-receipt"></i>} title={ <FormattedMessage id="contractverification.receiptsNavTitle" /> } />
+      <NavItem to="/lookup" icon={<i className="fas fa-search"></i>} title={ <FormattedMessage id="contractverification.lookupNavTitle" /> } />
+      <NavItem to="/settings" icon={<i className="fas fa-cog"></i>} title={ <FormattedMessage id="contractverification.settingsNavTitle" /> } />
     </nav>
   )
 }
diff --git a/apps/contract-verification/src/app/layouts/Default.tsx b/apps/contract-verification/src/app/layouts/Default.tsx
index b02a4a77e3..d4276c5207 100644
--- a/apps/contract-verification/src/app/layouts/Default.tsx
+++ b/apps/contract-verification/src/app/layouts/Default.tsx
@@ -4,8 +4,8 @@ import { NavMenu } from '../components/NavMenu'
 
 interface Props {
   from: string
-  title?: string
-  description?: string
+  title?: string | any
+  description?: string | any
 }
 
 export const DefaultLayout = ({ children, title, description }: PropsWithChildren<Props>) => {
diff --git a/apps/remix-ide/src/app/tabs/locales/en/contractverification.json b/apps/remix-ide/src/app/tabs/locales/en/contractverification.json
new file mode 100644
index 0000000000..8fc8951064
--- /dev/null
+++ b/apps/remix-ide/src/app/tabs/locales/en/contractverification.json
@@ -0,0 +1,6 @@
+{
+  "contractverification.verifyNavTitle": "Verify",
+  "contractverification.receiptsNavTitle": "Receipts",
+  "contractverification.lookupNavTitle": "Lookup",
+  "contractverification.settingsNavTitle": "Settings"
+}
diff --git a/apps/remix-ide/src/app/tabs/locales/es/contractverification.json b/apps/remix-ide/src/app/tabs/locales/es/contractverification.json
new file mode 100644
index 0000000000..0e3ec6e56d
--- /dev/null
+++ b/apps/remix-ide/src/app/tabs/locales/es/contractverification.json
@@ -0,0 +1,6 @@
+{
+  "contractverification.verifyNavTitle": "Verificar",
+  "contractverification.receiptsNavTitle": "Receipts",
+  "contractverification.lookupNavTitle": "Lookups",
+  "contractverification.settingsNavTitle": "Settings"
+}
diff --git a/apps/remix-ide/src/app/tabs/locales/fr/contractverification.json b/apps/remix-ide/src/app/tabs/locales/fr/contractverification.json
new file mode 100644
index 0000000000..d59490c3c9
--- /dev/null
+++ b/apps/remix-ide/src/app/tabs/locales/fr/contractverification.json
@@ -0,0 +1,6 @@
+{
+  "contractverification.verifyNavTitle": "Verifiers",
+  "contractverification.receiptsNavTitle": "Receipts",
+  "contractverification.lookupNavTitle": "Lookups",
+  "contractverification.settingsNavTitle": "Settings"
+}
diff --git a/apps/remix-ide/src/app/tabs/locales/it/contractverification.json b/apps/remix-ide/src/app/tabs/locales/it/contractverification.json
new file mode 100644
index 0000000000..d59490c3c9
--- /dev/null
+++ b/apps/remix-ide/src/app/tabs/locales/it/contractverification.json
@@ -0,0 +1,6 @@
+{
+  "contractverification.verifyNavTitle": "Verifiers",
+  "contractverification.receiptsNavTitle": "Receipts",
+  "contractverification.lookupNavTitle": "Lookups",
+  "contractverification.settingsNavTitle": "Settings"
+}
diff --git a/apps/remix-ide/src/app/tabs/locales/ko/contractverification.json b/apps/remix-ide/src/app/tabs/locales/ko/contractverification.json
new file mode 100644
index 0000000000..d59490c3c9
--- /dev/null
+++ b/apps/remix-ide/src/app/tabs/locales/ko/contractverification.json
@@ -0,0 +1,6 @@
+{
+  "contractverification.verifyNavTitle": "Verifiers",
+  "contractverification.receiptsNavTitle": "Receipts",
+  "contractverification.lookupNavTitle": "Lookups",
+  "contractverification.settingsNavTitle": "Settings"
+}
diff --git a/apps/remix-ide/src/app/tabs/locales/ru/contractverification.json b/apps/remix-ide/src/app/tabs/locales/ru/contractverification.json
new file mode 100644
index 0000000000..d59490c3c9
--- /dev/null
+++ b/apps/remix-ide/src/app/tabs/locales/ru/contractverification.json
@@ -0,0 +1,6 @@
+{
+  "contractverification.verifyNavTitle": "Verifiers",
+  "contractverification.receiptsNavTitle": "Receipts",
+  "contractverification.lookupNavTitle": "Lookups",
+  "contractverification.settingsNavTitle": "Settings"
+}
diff --git a/apps/remix-ide/src/app/tabs/locales/zh/contractverification.json b/apps/remix-ide/src/app/tabs/locales/zh/contractverification.json
new file mode 100644
index 0000000000..d59490c3c9
--- /dev/null
+++ b/apps/remix-ide/src/app/tabs/locales/zh/contractverification.json
@@ -0,0 +1,6 @@
+{
+  "contractverification.verifyNavTitle": "Verifiers",
+  "contractverification.receiptsNavTitle": "Receipts",
+  "contractverification.lookupNavTitle": "Lookups",
+  "contractverification.settingsNavTitle": "Settings"
+}
diff --git a/apps/vyper/src/app/app.tsx b/apps/vyper/src/app/app.tsx
index b7d48329d0..eadce98f8f 100644
--- a/apps/vyper/src/app/app.tsx
+++ b/apps/vyper/src/app/app.tsx
@@ -56,8 +56,8 @@ const App = () => {
       try {
         remixClient.call('locale' as any, 'currentLocale').then((currentLocale) => {
           setLocale(currentLocale)
-        })        
-  
+        })
+
         remixClient.on('locale' as any, 'localeChanged', (locale: any) => {
           setLocale(locale)
         })
@@ -118,113 +118,113 @@ const App = () => {
 
   return (
     <IntlProvider locale={locale.code} messages={locale.messages}>
-    <main id="vyper-plugin">
-      <section>
-        <div className="px-3 pt-3 mb-3 w-100">
-          <CustomTooltip placement="bottom" tooltipText="Clone a repo of Vyper examples. Switch to the File Explorer to see the examples.">
-            <button data-id="add-repository" className="w-100 text-dark btn border" onClick={() => {
-              {cloneCount === 0 ? remixClient.cloneVyperRepo() : remixClient.cloneVyperRepo(cloneCount)}
-              setCloneCount((prev) => {
-                return ++prev
-              })
-            }}>
+      <main id="vyper-plugin">
+        <section>
+          <div className="px-3 pt-3 mb-3 w-100">
+            <CustomTooltip placement="bottom" tooltipText="Clone a repo of Vyper examples. Switch to the File Explorer to see the examples.">
+              <button data-id="add-repository" className="w-100 text-dark btn border" onClick={() => {
+                {cloneCount === 0 ? remixClient.cloneVyperRepo() : remixClient.cloneVyperRepo(cloneCount)}
+                setCloneCount((prev) => {
+                  return ++prev
+                })
+              }}>
               Clone a repo of Vyper examples
-            </button>
-          </CustomTooltip>
-        </div>
-
-        <Accordion className="border-0 w-100 accordion-background">
-          <div className="border-0">
-            <div className="">
-              <CustomAccordionToggle eventKey="0">
-                <label style={{fontSize: "1REM"}}>Configurations</label>
-              </CustomAccordionToggle>
-            </div>
-            <Accordion.Collapse eventKey="0">
-              <div className="pb-2 border-bottom">
-                <Form>
-                  <div className="d-flex flex-row justify-content-around mb-1 mt-2">
-                    <div className={`custom-control custom-radio ${state.environment === 'remote' ? 'd-flex' : 'd-flex cursor-status'}`}>
-                      <input
-                        type="radio"
-                        id="remote-compiler"
-                        data-id="remote-compiler"
-                        name="remote"
-                        value={state.environment}
-                        checked={state.environment === 'remote'}
-                        onChange={() => setEnvironment('remote')}
-                        className={`custom-control-input ${state.environment === 'remote' ? 'd-flex mr-1' : 'd-flex mr-1 cursor-status'}`}
-                      />
-                      <label
-                        htmlFor="remote-compiler"
-                        className="form-check-label custom-control-label"
-                        style={{ paddingTop: '0.19rem' }}
-                      >Remote Compiler</label>
-                    </div>
-                    <div className={`custom-control custom-radio ${state.environment === 'local' ? 'mr-2' : `cursor-status`}`}>
-                      <input
-                        id="local-compiler"
-                        data-id="local-compiler"
-                        checked={state.environment === 'local'}
-                        type="radio"
-                        name="local"
-                        value={state.environment}
-                        onChange={() => setEnvironment('local')}
-                        className={`custom-control-input  ${state.environment === 'local' ? '' : `cursor-status`}`}
-                      />
-                      <label
-                        htmlFor="local-compiler"
-                        className="form-check-label custom-control-label"
-                        style={{ paddingTop: '0.19rem' }}
-                      >Local Compiler</label>
-                    </div>
-                  </div>
-                </Form>
-                <LocalUrlInput url={state.localUrl} setUrl={setLocalUrl} environment={state.environment} />
-              </div>
-            </Accordion.Collapse>
+              </button>
+            </CustomTooltip>
           </div>
-        </Accordion>
-        <span className="w-100 px-3 mt-3 mb-1 small text-warning">
+
+          <Accordion className="border-0 w-100 accordion-background">
+            <div className="border-0">
+              <div className="">
+                <CustomAccordionToggle eventKey="0">
+                  <label style={{ fontSize: "1REM" }}>Configurations</label>
+                </CustomAccordionToggle>
+              </div>
+              <Accordion.Collapse eventKey="0">
+                <div className="pb-2 border-bottom">
+                  <Form>
+                    <div className="d-flex flex-row justify-content-around mb-1 mt-2">
+                      <div className={`custom-control custom-radio ${state.environment === 'remote' ? 'd-flex' : 'd-flex cursor-status'}`}>
+                        <input
+                          type="radio"
+                          id="remote-compiler"
+                          data-id="remote-compiler"
+                          name="remote"
+                          value={state.environment}
+                          checked={state.environment === 'remote'}
+                          onChange={() => setEnvironment('remote')}
+                          className={`custom-control-input ${state.environment === 'remote' ? 'd-flex mr-1' : 'd-flex mr-1 cursor-status'}`}
+                        />
+                        <label
+                          htmlFor="remote-compiler"
+                          className="form-check-label custom-control-label"
+                          style={{ paddingTop: '0.19rem' }}
+                        >Remote Compiler</label>
+                      </div>
+                      <div className={`custom-control custom-radio ${state.environment === 'local' ? 'mr-2' : `cursor-status`}`}>
+                        <input
+                          id="local-compiler"
+                          data-id="local-compiler"
+                          checked={state.environment === 'local'}
+                          type="radio"
+                          name="local"
+                          value={state.environment}
+                          onChange={() => setEnvironment('local')}
+                          className={`custom-control-input  ${state.environment === 'local' ? '' : `cursor-status`}`}
+                        />
+                        <label
+                          htmlFor="local-compiler"
+                          className="form-check-label custom-control-label"
+                          style={{ paddingTop: '0.19rem' }}
+                        >Local Compiler</label>
+                      </div>
+                    </div>
+                  </Form>
+                  <LocalUrlInput url={state.localUrl} setUrl={setLocalUrl} environment={state.environment} />
+                </div>
+              </Accordion.Collapse>
+            </div>
+          </Accordion>
+          <span className="w-100 px-3 mt-3 mb-1 small text-warning">
           Specify the{' '}
-          <a className="text-warning" target="_blank" href="https://remix-ide.readthedocs.io/en/latest/vyper.html#specify-vyper-version">
+            <a className="text-warning" target="_blank" href="https://remix-ide.readthedocs.io/en/latest/vyper.html#specify-vyper-version">
             compiler version
-          </a>{' '}
+            </a>{' '}
           &{' '}
-          <a className="text-warning" href="https://remix-ide.readthedocs.io/en/latest/vyper.html#evm-version" target="_blank" rel="noopener noreferrer">
+            <a className="text-warning" href="https://remix-ide.readthedocs.io/en/latest/vyper.html#evm-version" target="_blank" rel="noopener noreferrer">
             EVM version
-          </a>{' '}
+            </a>{' '}
           in the .vy file.
-        </span>
-        <div className="px-3 w-100 mb-3 mt-1" id="compile-btn">
-          <CompilerButton compilerUrl={compilerUrl()} contract={contract} setOutput={(name, update) => setOutput({ ...output, [name]: update })} resetCompilerState={resetCompilerResultState} output={output} remixClient={remixClient}/>
-        </div>
-        <article id="result" className="px-3 p-2 w-100 border-top mt-2 vyper-errorBlobs">
-          {output && output.status === 'success' && 
+          </span>
+          <div className="px-3 w-100 mb-3 mt-1" id="compile-btn">
+            <CompilerButton compilerUrl={compilerUrl()} contract={contract} setOutput={(name, update) => setOutput({ ...output, [name]: update })} resetCompilerState={resetCompilerResultState} output={output} remixClient={remixClient}/>
+          </div>
+          <article id="result" className="px-3 p-2 w-100 border-top mt-2 vyper-errorBlobs">
+            {output && output.status === 'success' &&
             <>
               <VyperResult output={output} plugin={remixClient} />
             </>
-          }
-          {output && output.status === 'failed' &&
+            }
+            {output && output.status === 'failed' &&
             output.errors && output.errors.map((error: VyperCompilationError, index: number) => {
               return <Renderer key={index}
-                  message={extractRelativePath(error.message, contract)}
-                  plugin={remixClient}
-                  context='vyper'
-                  opt={{
-                    useSpan: false,
-                    type: 'error',
-                    errorType: error.error_type,
-                    errCol: error.column,
-                    errLine: error.line ? error.line - 1 : null,
-                    errFile: contract
-                  }}
-                />
-            })            
-          }
-        </article>
-      </section>
-    </main>
+                message={extractRelativePath(error.message, contract)}
+                plugin={remixClient}
+                context='vyper'
+                opt={{
+                  useSpan: false,
+                  type: 'error',
+                  errorType: error.error_type,
+                  errCol: error.column,
+                  errLine: error.line ? error.line - 1 : null,
+                  errFile: contract
+                }}
+              />
+            })
+            }
+          </article>
+        </section>
+      </main>
     </IntlProvider>
   )
 }