diff --git a/docs/developer/plugin-list.asciidoc b/docs/developer/plugin-list.asciidoc
index 90bf3d3c29b41..a46e492db5e24 100644
--- a/docs/developer/plugin-list.asciidoc
+++ b/docs/developer/plugin-list.asciidoc
@@ -329,6 +329,10 @@ The plugin exposes the static DefaultEditorController class to consume.
 |WARNING: Missing README.
 
 
+|{kib-repo}blob/{branch}/src/plugins/vis_type_script/README.md[visTypeScript]
+|This plugin defines the script-based visualization type. Users can use JavaScript and the popular D3 library to build script-based custom visualizations directly in Kibana.
+
+
 |{kib-repo}blob/{branch}/src/plugins/vis_types/table/README.md[visTypeTable]
 |Contains the data table visualization, that allows presenting data in a simple table format.
 
diff --git a/package.json b/package.json
index d6d4a2225a08c..d3d91616f1d4c 100644
--- a/package.json
+++ b/package.json
@@ -198,6 +198,7 @@
     "@mapbox/mapbox-gl-rtl-text": "0.2.3",
     "@mapbox/vector-tile": "1.3.1",
     "@reduxjs/toolkit": "^1.6.1",
+    "@remote-ui/rpc": "1.3.0",
     "@slack/webhook": "^5.0.4",
     "@turf/along": "6.0.1",
     "@turf/area": "6.0.1",
diff --git a/src/core/public/index.ts b/src/core/public/index.ts
index 9291201237279..d02dcf917cb62 100644
--- a/src/core/public/index.ts
+++ b/src/core/public/index.ts
@@ -61,6 +61,7 @@ import { DeprecationsServiceStart } from './deprecations';
 import type { ThemeServiceSetup, ThemeServiceStart } from './theme';
 import { ExecutionContextSetup, ExecutionContextStart } from './execution_context';
 import type { AnalyticsServiceSetup, AnalyticsServiceStart } from './analytics';
+import type { InjectedMetadataSetup } from './injected_metadata';
 
 export type {
   PackageInfo,
@@ -251,6 +252,7 @@ export interface CoreSetup<TPluginsStart extends object = object, TStart = unkno
    * */
   injectedMetadata: {
     getInjectedVar: (name: string, defaultValue?: any) => unknown;
+    getCsp: () => ReturnType<InjectedMetadataSetup['getCspConfig']>;
   };
   /** {@link ThemeServiceSetup} */
   theme: ThemeServiceSetup;
diff --git a/src/core/public/injected_metadata/injected_metadata_service.ts b/src/core/public/injected_metadata/injected_metadata_service.ts
index 07f56b889fc79..f51b3026fb07f 100644
--- a/src/core/public/injected_metadata/injected_metadata_service.ts
+++ b/src/core/public/injected_metadata/injected_metadata_service.ts
@@ -161,6 +161,7 @@ export interface InjectedMetadataSetup {
   getKibanaVersion: () => string;
   getCspConfig: () => {
     warnLegacyBrowsers: boolean;
+    nonce: string;
   };
   getExternalUrlConfig: () => {
     policy: IExternalUrlPolicy[];
diff --git a/src/core/public/plugins/plugin_context.ts b/src/core/public/plugins/plugin_context.ts
index 7d288799a34c3..9c2044ef8f8fa 100644
--- a/src/core/public/plugins/plugin_context.ts
+++ b/src/core/public/plugins/plugin_context.ts
@@ -95,6 +95,7 @@ export function createPluginSetupContext<
     uiSettings: deps.uiSettings,
     injectedMetadata: {
       getInjectedVar: deps.injectedMetadata.getInjectedVar,
+      getCsp: deps.injectedMetadata.getCspConfig,
     },
     theme: deps.theme,
     getStartServices: () => plugin.startDependencies,
diff --git a/src/core/server/http_resources/http_resources_service.ts b/src/core/server/http_resources/http_resources_service.ts
index 2d49cb17cf4c0..411bc4060cc69 100644
--- a/src/core/server/http_resources/http_resources_service.ts
+++ b/src/core/server/http_resources/http_resources_service.ts
@@ -6,6 +6,7 @@
  * Side Public License, v 1.
  */
 
+import { randomBytes } from 'crypto';
 import { RequestHandlerContext } from '..';
 
 import { CoreContext } from '../core_context';
@@ -93,6 +94,7 @@ export class HttpResourcesService implements CoreService<InternalHttpResourcesSe
     return {
       async renderCoreApp(options: HttpResourcesRenderOptions = {}) {
         const apmConfig = getApmConfig(request.url.pathname);
+        const nonce = randomBytes(16).toString('hex');
         const { uiSettings } = await context.core;
         const body = await deps.rendering.render(request, uiSettings.client, {
           isAnonymousPage: false,
@@ -100,11 +102,15 @@ export class HttpResourcesService implements CoreService<InternalHttpResourcesSe
             apmConfig,
           },
           includeExposedConfigKeys: options.includeExposedConfigKeys,
+          nonce,
         });
 
         return response.ok({
           body,
-          headers: { ...options.headers, 'content-security-policy': cspHeader },
+          headers: {
+            ...options.headers,
+            'content-security-policy': `${cspHeader}; script-src '${nonce}';`,
+          },
         });
       },
       async renderAnonymousCoreApp(options: HttpResourcesRenderOptions = {}) {
@@ -124,6 +130,7 @@ export class HttpResourcesService implements CoreService<InternalHttpResourcesSe
         });
       },
       renderHtml(options: HttpResourcesResponseOptions) {
+        // TODO do nonce to csp header
         return response.ok({
           body: options.body,
           headers: {
diff --git a/src/core/server/rendering/rendering_service.tsx b/src/core/server/rendering/rendering_service.tsx
index 73746a8f202ff..e0449c86acc43 100644
--- a/src/core/server/rendering/rendering_service.tsx
+++ b/src/core/server/rendering/rendering_service.tsx
@@ -80,7 +80,7 @@ export class RenderingService {
     { http, uiPlugins, status }: RenderOptions,
     request: KibanaRequest,
     uiSettings: IUiSettingsClient,
-    { isAnonymousPage = false, vars, includeExposedConfigKeys }: IRenderOptions = {}
+    { isAnonymousPage = false, vars, includeExposedConfigKeys, nonce }: IRenderOptions = {}
   ) {
     const env = {
       mode: this.coreContext.env.mode,
@@ -131,7 +131,7 @@ export class RenderingService {
           darkMode,
           version: themeVersion,
         },
-        csp: { warnLegacyBrowsers: http.csp.warnLegacyBrowsers },
+        csp: { warnLegacyBrowsers: http.csp.warnLegacyBrowsers, nonce },
         externalUrl: http.externalUrl,
         vars: vars ?? {},
         uiPlugins: await Promise.all(
diff --git a/src/plugins/vis_type_script/README.md b/src/plugins/vis_type_script/README.md
new file mode 100644
index 0000000000000..8ee3636b0fb70
--- /dev/null
+++ b/src/plugins/vis_type_script/README.md
@@ -0,0 +1,17 @@
+## Description
+
+This plugin defines the script-based visualization type. Users can use JavaScript and the popular D3 library to build script-based custom visualizations directly in Kibana.
+
+## Setup
+
+To use this plugin, you need to relax Kibana's default content security policy via `kibana.yml`. (This will no longer be necessary once issue [101579](https://github.com/elastic/kibana/issues/101579) is resolved.)
+
+Add the following to `kibana.yml` (**DO NOT USE IN PRODUCTION**):
+
+```yml
+csp.warnLegacyBrowsers: false
+csp.strict: false
+csp.script_src:
+  - 'unsafe-inline'
+  - 'https://unpkg.com/'
+```
diff --git a/src/plugins/vis_type_script/config.ts b/src/plugins/vis_type_script/config.ts
new file mode 100644
index 0000000000000..b831d26854c30
--- /dev/null
+++ b/src/plugins/vis_type_script/config.ts
@@ -0,0 +1,15 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { schema, TypeOf } from '@kbn/config-schema';
+
+export const configSchema = schema.object({
+  enabled: schema.boolean({ defaultValue: true }),
+});
+
+export type ConfigSchema = TypeOf<typeof configSchema>;
diff --git a/src/plugins/vis_type_script/jest.config.js b/src/plugins/vis_type_script/jest.config.js
new file mode 100644
index 0000000000000..835d37312eadd
--- /dev/null
+++ b/src/plugins/vis_type_script/jest.config.js
@@ -0,0 +1,16 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+module.exports = {
+  preset: '@kbn/test',
+  rootDir: '../../..',
+  roots: ['<rootDir>/src/plugins/vis_type_markdown'],
+  coverageDirectory: '<rootDir>/target/kibana-coverage/jest/src/plugins/vis_type_markdown',
+  coverageReporters: ['text', 'html'],
+  collectCoverageFrom: ['<rootDir>/src/plugins/vis_type_markdown/{public,server}/**/*.{ts,tsx}'],
+};
diff --git a/src/plugins/vis_type_script/kibana.json b/src/plugins/vis_type_script/kibana.json
new file mode 100644
index 0000000000000..20a08aac9a48b
--- /dev/null
+++ b/src/plugins/vis_type_script/kibana.json
@@ -0,0 +1,13 @@
+{
+  "id": "visTypeScript",
+  "owner": {
+    "name": "Kibana Presentation",
+    "githubTeam": "kibana-presentation"
+  },
+  "description": "Adds a script-based visualization type",
+  "version": "kibana",
+  "ui": true,
+  "server": false,
+  "requiredPlugins": ["expressions", "visualizations", "data"],
+  "requiredBundles": ["expressions", "visualizations", "visDefaultEditor", "kibanaReact"]
+}
diff --git a/src/plugins/vis_type_script/public/expression/fn.ts b/src/plugins/vis_type_script/public/expression/fn.ts
new file mode 100644
index 0000000000000..5d41e9f1a68b3
--- /dev/null
+++ b/src/plugins/vis_type_script/public/expression/fn.ts
@@ -0,0 +1,64 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { i18n } from '@kbn/i18n';
+import type { ExpressionFunctionDefinition, Render } from '@kbn/expressions-plugin/public';
+import { ExpressionValueSearchContext } from '@kbn/data-plugin/common';
+import type { Arguments } from '../types';
+import type { RenderValue } from './renderer';
+
+type ScriptVisExpressionFunctionDefinition = ExpressionFunctionDefinition<
+  'scriptVis',
+  ExpressionValueSearchContext | null,
+  Arguments,
+  Render<RenderValue>
+>;
+
+export const createScriptVisFn = (): ScriptVisExpressionFunctionDefinition => ({
+  name: 'scriptVis',
+  type: 'render',
+  inputTypes: ['kibana_context', 'null'],
+  help: i18n.translate('visTypeMarkdown.function.help', {
+    defaultMessage: 'Script-based visualization',
+  }),
+  args: {
+    script: {
+      types: ['string'],
+      required: true,
+      help: i18n.translate('visTypeScript.function.markdown.help', {
+        defaultMessage: 'Visualization script',
+      }),
+    },
+    dependencyUrls: {
+      types: ['string'],
+      multi: true,
+      required: true,
+      help: i18n.translate('visTypeScript.function.markdown.help', {
+        defaultMessage: 'List of script dependencies',
+      }),
+    },
+  },
+  fn(input, args) {
+    return {
+      type: 'render',
+      as: 'script_vis',
+      value: {
+        visType: 'script',
+        visParams: {
+          script: args.script,
+          dependencyUrls: args.dependencyUrls,
+        },
+        visSearchContext: {
+          timeRange: input?.timeRange,
+          query: input?.query,
+          filter: input?.filters,
+        },
+      },
+    };
+  },
+});
diff --git a/src/plugins/vis_type_script/public/expression/renderer.tsx b/src/plugins/vis_type_script/public/expression/renderer.tsx
new file mode 100644
index 0000000000000..2e3f743813b67
--- /dev/null
+++ b/src/plugins/vis_type_script/public/expression/renderer.tsx
@@ -0,0 +1,57 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import React from 'react';
+import { render, unmountComponentAtNode } from 'react-dom';
+import { IExternalUrl } from '@kbn/core/public';
+import type { ExpressionRenderDefinition } from '@kbn/expressions-plugin';
+import { VisualizationContainer } from '@kbn/visualizations-plugin/public';
+import { DataPublicPluginStart } from '@kbn/data-plugin/public';
+import { VisParams, VisSearchContext } from '../types';
+import { ScriptRenderer } from '../renderer';
+import { VisTypeScriptKibanaApi } from '../kibana_api';
+
+export interface RenderValue {
+  visType: 'script';
+  visParams: VisParams;
+  visSearchContext: VisSearchContext;
+}
+
+export const scriptVisRenderer: (
+  // TODO: not sure if this is correct way of passing deps to vis renderer
+  getDeps: () => Promise<{
+    data: DataPublicPluginStart;
+    validateUrl: IExternalUrl['validateUrl'];
+    nonce: string;
+  }>
+) => ExpressionRenderDefinition<RenderValue> = (getDeps) => ({
+  name: 'script_vis',
+  displayName: 'script-based visualization',
+  reuseDomNode: true,
+  render: async (domNode, { visParams, visSearchContext }, handlers) => {
+    const deps = await getDeps();
+    const visTypeScriptKibanaApi = new VisTypeScriptKibanaApi(deps, visSearchContext);
+
+    handlers.onDestroy(() => {
+      unmountComponentAtNode(domNode);
+    });
+
+    render(
+      <VisualizationContainer className="scriptVis" handlers={handlers}>
+        <ScriptRenderer
+          script={visParams.script}
+          dependencyUrls={visParams.dependencyUrls}
+          kibanaApi={visTypeScriptKibanaApi}
+          validateUrl={deps.validateUrl}
+          nonce={deps.nonce}
+        />
+      </VisualizationContainer>,
+      domNode
+    );
+  },
+});
diff --git a/src/plugins/vis_type_script/public/expression/to_ast.ts b/src/plugins/vis_type_script/public/expression/to_ast.ts
new file mode 100644
index 0000000000000..eb1d7ba9ff31d
--- /dev/null
+++ b/src/plugins/vis_type_script/public/expression/to_ast.ts
@@ -0,0 +1,31 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { VisToExpressionAst } from '@kbn/visualizations-plugin/public';
+import { buildExpression, buildExpressionFunction } from '@kbn/expressions-plugin/public';
+import type { ExpressionFunctionDefinition, Render } from '@kbn/expressions-plugin/public';
+import type { RenderValue } from './renderer';
+import { VisParams } from '../types';
+
+type ScriptVisExpressionFunctionDefinition = ExpressionFunctionDefinition<
+  'scriptVis',
+  unknown,
+  {},
+  Render<RenderValue>
+>;
+
+export const toExpressionAst: VisToExpressionAst<VisParams> = (vis) => {
+  const scriptVis = buildExpressionFunction<ScriptVisExpressionFunctionDefinition>('scriptVis', {
+    script: vis.params.script,
+    dependencyUrls: vis.params.dependencyUrls,
+  });
+
+  const ast = buildExpression([scriptVis]);
+
+  return ast.toAst();
+};
diff --git a/src/plugins/vis_type_script/public/index.ts b/src/plugins/vis_type_script/public/index.ts
new file mode 100644
index 0000000000000..f5663344d469c
--- /dev/null
+++ b/src/plugins/vis_type_script/public/index.ts
@@ -0,0 +1,14 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { PluginInitializerContext } from '@kbn/core/public';
+import { ScriptVisPlugin as Plugin } from './plugin';
+
+export function plugin(initializerContext: PluginInitializerContext) {
+  return new Plugin(initializerContext);
+}
diff --git a/src/plugins/vis_type_script/public/kibana_api/index.ts b/src/plugins/vis_type_script/public/kibana_api/index.ts
new file mode 100644
index 0000000000000..877de71ecd62c
--- /dev/null
+++ b/src/plugins/vis_type_script/public/kibana_api/index.ts
@@ -0,0 +1,9 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+export * from './kibana_api';
diff --git a/src/plugins/vis_type_script/public/kibana_api/kibana_api.ts b/src/plugins/vis_type_script/public/kibana_api/kibana_api.ts
new file mode 100644
index 0000000000000..f376eb0236aa7
--- /dev/null
+++ b/src/plugins/vis_type_script/public/kibana_api/kibana_api.ts
@@ -0,0 +1,119 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import type * as estypes from '@elastic/elasticsearch/lib/api/types';
+import { lastValueFrom } from 'rxjs';
+import {
+  ENHANCED_ES_SEARCH_STRATEGY,
+  SQL_SEARCH_STRATEGY,
+  SqlSearchStrategyRequest,
+  SqlSearchStrategyResponse,
+} from '@kbn/data-plugin/common';
+import { DataPublicPluginStart } from '@kbn/data-plugin/public';
+import { VisSearchContext } from '../types';
+
+export interface VisTypeScriptKibanaApiDeps {
+  data: DataPublicPluginStart;
+}
+
+export interface ESSearchOptions {
+  useKibanaContext: boolean;
+  timeField?: string;
+}
+
+// disallow transport properties that are handled by data_plugin and allow only query related properties
+const allowedESSearchRequestKeys = [
+  'index',
+  'aggregations',
+  'aggs',
+  'query',
+  'q',
+  'sort',
+  'from',
+] as const;
+export type ESSearchRequest = Pick<
+  estypes.SearchRequest,
+  typeof allowedESSearchRequestKeys[number]
+>;
+export type ESSearchResponse = estypes.SearchResponse;
+
+export interface SQLSearchOptions {
+  useKibanaContext: boolean;
+  timeField?: string;
+}
+
+const allowedSQLSearchRequestKeys = [
+  'query',
+  'columnar',
+  'cursor',
+  'fetch_size',
+  'filter',
+  'time_zone',
+] as const;
+export type SQLSearchRequest = Pick<
+  estypes.SqlQueryRequest,
+  typeof allowedSQLSearchRequestKeys[number]
+>;
+export type SQLSearchResponse = estypes.SqlQueryResponse;
+
+function sanitizeRequest<T extends Record<string, unknown>>(payload: T, allowedKeys: string[]): T {
+  if (payload == null || typeof payload !== 'object') return payload;
+  return allowedKeys.reduce((sanitized, allowedKey) => {
+    if (allowedKey in payload) {
+      sanitized[allowedKey] = payload[allowedKey];
+    }
+    return sanitized;
+  }, {} as Record<string, unknown>) as T;
+}
+
+export class VisTypeScriptKibanaApi {
+  constructor(
+    private readonly deps: VisTypeScriptKibanaApiDeps,
+    private readonly visSearchContext: VisSearchContext
+  ) {}
+
+  async esSearch(
+    payload: ESSearchRequest,
+    { useKibanaContext = true }: ESSearchOptions = { useKibanaContext: true }
+  ): Promise<ESSearchResponse> {
+    payload = sanitizeRequest(payload, [...allowedESSearchRequestKeys]);
+
+    if (useKibanaContext) {
+      // TODO: adjust request based on this.visSearchContext
+      // eslint-disable-next-line no-console
+      console.log(this.visSearchContext);
+    }
+
+    const response = await lastValueFrom(
+      this.deps.data.search.search({ params: payload }, { strategy: ENHANCED_ES_SEARCH_STRATEGY })
+    );
+    return response.rawResponse;
+  }
+
+  async sqlSearch(
+    payload: SQLSearchRequest,
+    { useKibanaContext = true }: ESSearchOptions = { useKibanaContext: true }
+  ): Promise<SQLSearchResponse> {
+    payload = sanitizeRequest(payload, [...allowedSQLSearchRequestKeys]);
+
+    if (useKibanaContext) {
+      // TODO: adjust request based on this.visSearchContext
+      // eslint-disable-next-line no-console
+      console.log(this.visSearchContext);
+    }
+
+    const response = await lastValueFrom(
+      this.deps.data.search.search<SqlSearchStrategyRequest, SqlSearchStrategyResponse>(
+        { params: payload },
+        { strategy: SQL_SEARCH_STRATEGY }
+      )
+    );
+
+    return response.rawResponse;
+  }
+}
diff --git a/src/plugins/vis_type_script/public/plugin.ts b/src/plugins/vis_type_script/public/plugin.ts
new file mode 100644
index 0000000000000..62bb7f63053fd
--- /dev/null
+++ b/src/plugins/vis_type_script/public/plugin.ts
@@ -0,0 +1,61 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { PluginInitializerContext, CoreSetup, CoreStart, Plugin } from '@kbn/core/public';
+import { Plugin as ExpressionsPublicPlugin } from '@kbn/expressions-plugin/public';
+import { VisualizationsSetup } from '@kbn/visualizations-plugin/public';
+
+import { DataPublicPluginStart } from '@kbn/data-plugin/public';
+import { getScriptVisDefinition } from './vis_definition';
+import { ConfigSchema } from '../config';
+import { scriptVisRenderer } from './expression/renderer';
+import { createScriptVisFn } from './expression/fn';
+
+/** @internal */
+export interface ScriptVisPluginSetupDependencies {
+  expressions: ReturnType<ExpressionsPublicPlugin['setup']>;
+  visualizations: VisualizationsSetup;
+}
+
+/** @internal */
+export interface ScriptVisPluginStartDependencies {
+  data: DataPublicPluginStart;
+}
+
+/** @internal */
+export class ScriptVisPlugin
+  implements Plugin<void, void, ScriptVisPluginSetupDependencies, ScriptVisPluginStartDependencies>
+{
+  initializerContext: PluginInitializerContext<ConfigSchema>;
+
+  constructor(initializerContext: PluginInitializerContext<ConfigSchema>) {
+    this.initializerContext = initializerContext;
+  }
+
+  public setup(
+    core: CoreSetup<ScriptVisPluginStartDependencies>,
+    { expressions, visualizations }: ScriptVisPluginSetupDependencies
+  ) {
+    const validateUrl = core.http.externalUrl.validateUrl;
+    visualizations.createBaseVisualization(getScriptVisDefinition(validateUrl));
+    expressions.registerRenderer(
+      scriptVisRenderer(() =>
+        core.getStartServices().then(([coreStart, plugins]) => ({
+          data: plugins.data,
+          validateUrl,
+          nonce: core.injectedMetadata.getCsp().nonce,
+        }))
+      )
+    );
+    expressions.registerFunction(createScriptVisFn);
+  }
+
+  public start(core: CoreStart) {
+    // nothing to do here yet
+  }
+}
diff --git a/src/plugins/vis_type_script/public/renderer/index.scss b/src/plugins/vis_type_script/public/renderer/index.scss
new file mode 100644
index 0000000000000..7bf9848db0885
--- /dev/null
+++ b/src/plugins/vis_type_script/public/renderer/index.scss
@@ -0,0 +1,3 @@
+.script-based-visualization-renderer {
+  height: 100%;
+}
\ No newline at end of file
diff --git a/src/plugins/vis_type_script/public/renderer/index.tsx b/src/plugins/vis_type_script/public/renderer/index.tsx
new file mode 100644
index 0000000000000..d8dadbf87875d
--- /dev/null
+++ b/src/plugins/vis_type_script/public/renderer/index.tsx
@@ -0,0 +1,150 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import React, { useEffect, useState, useMemo } from 'react';
+import { createEndpoint, fromIframe } from '@remote-ui/rpc';
+
+import './index.scss';
+import { IExternalUrl } from '@kbn/core/public';
+import {
+  ESSearchOptions,
+  VisTypeScriptKibanaApi,
+  ESSearchResponse,
+  ESSearchRequest,
+  SQLSearchRequest,
+  SQLSearchOptions,
+  SQLSearchResponse,
+} from '../kibana_api';
+
+export const KIBANA_API_CONSTANT_NAME = 'KIBANA';
+
+const getSandboxDocument = (script: string, dependencies: string[], nonce: string) => {
+  return `
+    <!DOCTYPE html>
+    <html>
+      <head>
+        <meta http-equiv="content-security-policy" content="default-src none; script-src 'nonce-${nonce}'">
+        ${dependencies
+          .map((dependency) => `<script nonce="${nonce}">${dependency}</script>`)
+          .join('')}
+        <script nonce="${nonce}" type="module">
+          //  TODO: probably can't leave this using type=module
+          import { createEndpoint, fromInsideIframe } from "https://unpkg.com/@remote-ui/rpc@1.3.0/index.mjs";
+
+          const endpoint = createEndpoint(fromInsideIframe());
+
+          let onResize = () => {};
+
+          const ${KIBANA_API_CONSTANT_NAME} = {
+            searchEs: (payload, options) => {
+              return  endpoint.call.esSearch(payload, options);
+            },
+            searchSql: (payload, options) => {
+              return  endpoint.call.sqlSearch(payload, options);
+            },
+            subscribeToResize: (fn) => {
+              onResize = fn;
+            },
+            getWindowDimensions: () => {
+              return { width: window.innerWidth, height: window.innerHeight };
+            }
+          }
+
+          window.${KIBANA_API_CONSTANT_NAME} = ${KIBANA_API_CONSTANT_NAME};
+
+
+          window.addEventListener('resize', () => onResize(window.innerWidth, window.innerHeight));
+          function handleGlobalError(e) {
+            console.error(e);
+            // TODO a nicer error:
+            document.body.innerHTML = "<h1>" + (e.reason || e.message || e).toString() + "</h1>" + "<code>" + (e.reason || e).stack || '' + "</code>";
+          }
+          window.addEventListener('error', handleGlobalError);
+          window.addEventListener('unhandledrejection', handleGlobalError);
+        </script>
+
+        <script nonce="${nonce}">window.addEventListener('load', async () => {${script}})</script>
+      </head>
+      <body></body>
+    <html>
+    `;
+};
+
+const loadDependencies = (urls: string[]) => {
+  return Promise.all(urls.map((url) => fetch(url).then((res) => res.text())));
+};
+
+export const ScriptRenderer: React.FunctionComponent<{
+  script: string;
+  dependencyUrls: string[];
+  kibanaApi: VisTypeScriptKibanaApi;
+  validateUrl: IExternalUrl['validateUrl'];
+  nonce: string;
+}> = ({
+  script: visualizationScript,
+  dependencyUrls,
+  kibanaApi,
+  validateUrl,
+  nonce,
+}: {
+  script: string;
+  dependencyUrls: string[];
+  kibanaApi: VisTypeScriptKibanaApi;
+  validateUrl: IExternalUrl['validateUrl'];
+  nonce: string;
+}) => {
+  const iframeRef = React.useRef<HTMLIFrameElement | null>(null);
+
+  useEffect(() => {
+    if (!iframeRef.current) throw new Error('Iframe init error');
+    const iframeEl = iframeRef.current;
+    const endpoint = createEndpoint(fromIframe(iframeEl, { terminate: false }));
+
+    endpoint.expose({
+      esSearch: async (
+        payload: ESSearchRequest,
+        options?: ESSearchOptions
+      ): Promise<ESSearchResponse> => {
+        return kibanaApi.esSearch(payload, options);
+      },
+      sqlSearch: async (
+        payload: SQLSearchRequest,
+        options?: SQLSearchOptions
+      ): Promise<SQLSearchResponse> => {
+        return kibanaApi.sqlSearch(payload, options);
+      },
+    });
+
+    return () => {
+      endpoint.terminate();
+    };
+  }, [kibanaApi]);
+
+  const [dependencies, setDependencies] = useState<string[]>([]);
+
+  useEffect(() => {
+    loadDependencies(dependencyUrls.filter((url) => validateUrl(url) !== null)).then(
+      (deps: string[]) => setDependencies(deps)
+    );
+  }, [dependencyUrls, validateUrl]);
+
+  const sandboxDocument = useMemo(
+    () => getSandboxDocument(visualizationScript, dependencies, nonce),
+    [visualizationScript, dependencies, nonce]
+  );
+
+  return (
+    <iframe
+      ref={iframeRef}
+      className="script-based-visualization-renderer"
+      title="script-based-visualization-renderer"
+      srcDoc={sandboxDocument}
+      sandbox="allow-scripts"
+    />
+  );
+};
diff --git a/src/plugins/vis_type_script/public/types.ts b/src/plugins/vis_type_script/public/types.ts
new file mode 100644
index 0000000000000..62b4513a8fc2d
--- /dev/null
+++ b/src/plugins/vis_type_script/public/types.ts
@@ -0,0 +1,26 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { Filter, Query } from '@kbn/es-query';
+import { TimeRange } from '@kbn/data-plugin/common';
+
+export interface Arguments {
+  script: string;
+  dependencyUrls: string[];
+}
+
+export interface VisParams {
+  script: Arguments['script'];
+  dependencyUrls: Arguments['dependencyUrls'];
+}
+
+export interface VisSearchContext {
+  filters?: Filter[];
+  query?: Query | Query[];
+  timeRange?: TimeRange;
+}
diff --git a/src/plugins/vis_type_script/public/vis_definition/default_vis.ts b/src/plugins/vis_type_script/public/vis_definition/default_vis.ts
new file mode 100644
index 0000000000000..cb7aebd228746
--- /dev/null
+++ b/src/plugins/vis_type_script/public/vis_definition/default_vis.ts
@@ -0,0 +1,119 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+// Based on https://bl.ocks.org/mbostock/99049112373e12709381
+export const DEFAULT_VIS = `
+// Based on https://www.jasondavies.com/poisson-disc/
+function poissonDiscSampler(width, height, radius) {
+  var k = 30, // maximum number of samples before rejection
+      radius2 = radius * radius,
+      R = 3 * radius2,
+      cellSize = radius * Math.SQRT1_2,
+      gridWidth = Math.ceil(width / cellSize),
+      gridHeight = Math.ceil(height / cellSize),
+      grid = new Array(gridWidth * gridHeight),
+      queue = [],
+      queueSize = 0,
+      sampleSize = 0;
+
+  return function() {
+    if (!sampleSize) return sample(Math.random() * width, Math.random() * height);
+
+    // Pick a random existing sample and remove it from the queue.
+    while (queueSize) {
+      var i = Math.random() * queueSize | 0,
+          s = queue[i];
+
+      // Make a new candidate between [radius, 2 * radius] from the existing sample.
+      for (var j = 0; j < k; ++j) {
+        var a = 2 * Math.PI * Math.random(),
+            r = Math.sqrt(Math.random() * R + radius2),
+            x = s[0] + r * Math.cos(a),
+            y = s[1] + r * Math.sin(a);
+
+        // Reject candidates that are outside the allowed extent,
+        // or closer than 2 * radius to any existing sample.
+        if (0 <= x && x < width && 0 <= y && y < height && far(x, y)) return sample(x, y);
+      }
+
+      queue[i] = queue[--queueSize];
+      queue.length = queueSize;
+    }
+  };
+
+  function far(x, y) {
+    var i = x / cellSize | 0,
+        j = y / cellSize | 0,
+        i0 = Math.max(i - 2, 0),
+        j0 = Math.max(j - 2, 0),
+        i1 = Math.min(i + 3, gridWidth),
+        j1 = Math.min(j + 3, gridHeight);
+
+    for (j = j0; j < j1; ++j) {
+      var o = j * gridWidth;
+      for (i = i0; i < i1; ++i) {
+        if (s = grid[o + i]) {
+          var s,
+              dx = s[0] - x,
+              dy = s[1] - y;
+          if (dx * dx + dy * dy < radius2) return false;
+        }
+      }
+    }
+
+    return true;
+  }
+
+  function sample(x, y) {
+    var s = [x, y];
+    queue.push(s);
+    grid[gridWidth * (y / cellSize | 0) + (x / cellSize | 0)] = s;
+    ++sampleSize;
+    ++queueSize;
+    return s;
+  }
+}
+
+const drawVis = (width, height, svg) => {
+  var sampler = poissonDiscSampler(width, height, 40),
+    samples = [],
+    sample;
+  
+  while (sample = sampler()) samples.push(sample);
+
+  var voronoi = d3.geom.voronoi()
+      .clipExtent([[-1, -1], [width + 1, height + 1]]);
+
+  svg
+      .attr("width", width)
+      .attr("height", height);
+
+  function color(d) {
+    var dx = d[0] - width / 2,
+        dy = d[1] - height / 2;
+    return d3.lab(100 - (dx * dx + dy * dy) / 5000, dx / 10, dy / 10);
+  }
+  
+  svg.selectAll("path")
+      .data(voronoi(samples))
+    .enter().append("path")
+      .attr("d", function(d) { return "M" + d.join("L") + "Z"; })
+      .style("fill", function(d) { return color(d.point); })
+      .style("stroke", function(d) { return color(d.point); });
+}
+
+var svg = d3.select("body").append("svg")
+
+const { width, height } = KIBANA.getWindowDimensions();
+
+drawVis(width, height, svg);
+
+KIBANA.subscribeToResize((width, height) => {
+  svg.html(null)
+  drawVis(width, height, svg)
+});`;
diff --git a/src/plugins/vis_type_script/public/vis_definition/editor_options/script.scss b/src/plugins/vis_type_script/public/vis_definition/editor_options/script.scss
new file mode 100644
index 0000000000000..ead2fa3522381
--- /dev/null
+++ b/src/plugins/vis_type_script/public/vis_definition/editor_options/script.scss
@@ -0,0 +1,10 @@
+.visEditor--script {
+
+  .visEditorSidebar__config>* {
+    flex-grow: 1;
+  }
+
+  .scriptEditor {
+    height: 100%;
+  }
+}
\ No newline at end of file
diff --git a/src/plugins/vis_type_script/public/vis_definition/editor_options/script.tsx b/src/plugins/vis_type_script/public/vis_definition/editor_options/script.tsx
new file mode 100644
index 0000000000000..e0797e4119a43
--- /dev/null
+++ b/src/plugins/vis_type_script/public/vis_definition/editor_options/script.tsx
@@ -0,0 +1,166 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import React, { useCallback } from 'react';
+import { EuiPanel, EuiTitle, EuiLink, EuiFlexGroup, EuiFlexItem, EuiText } from '@elastic/eui';
+import { FormattedMessage } from '@kbn/i18n-react';
+
+import { monaco as monacoEditor } from '@kbn/monaco';
+import { CodeEditor } from '@kbn/kibana-react-plugin/public';
+import type { VisEditorOptionsProps } from '@kbn/visualizations-plugin/public';
+import type { VisParams } from '../../types';
+
+import './script.scss';
+import { KIBANA_API_CONSTANT_NAME } from '../../renderer';
+
+const provideSuggestions = (
+  model: monacoEditor.editor.ITextModel,
+  position: monacoEditor.Position,
+  context: monacoEditor.languages.CompletionContext
+): monacoEditor.languages.ProviderResult<monacoEditor.languages.CompletionList> => {
+  const suggestions: monacoEditor.languages.CompletionList['suggestions'] = [];
+
+  if (context.triggerCharacter === 'K') {
+    const wordRange = new monacoEditor.Range(
+      position.lineNumber,
+      position.column - 1,
+      position.lineNumber,
+      position.column
+    );
+
+    suggestions.push({
+      label: KIBANA_API_CONSTANT_NAME,
+      kind: monacoEditor.languages.CompletionItemKind.Constant,
+      documentation: {
+        value: 'Used to access select Kibana APIs (like querying Elasticsearch)',
+        isTrusted: true,
+      },
+      insertText: KIBANA_API_CONSTANT_NAME,
+      range: wordRange,
+    });
+  }
+
+  if (
+    context.triggerCharacter === '.' &&
+    model.getWordAtPosition({
+      lineNumber: position.lineNumber,
+      column: position.column - 2,
+    })?.word === KIBANA_API_CONSTANT_NAME
+  ) {
+    const wordRange = new monacoEditor.Range(
+      position.lineNumber,
+      position.column,
+      position.lineNumber,
+      position.column
+    );
+
+    suggestions.push(
+      {
+        label: 'searchEs',
+        kind: monacoEditor.languages.CompletionItemKind.Method,
+        documentation: {
+          value: 'Runs an Elasticsearch query',
+          isTrusted: true,
+        },
+        insertText: 'searchEs({\n\tquery: {\n\t\t$0\n\t}\n})',
+        insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
+        range: wordRange,
+      },
+      {
+        label: 'searchSql',
+        kind: monacoEditor.languages.CompletionItemKind.Method,
+        documentation: {
+          value: 'Runs an Elasticsearch SQL query',
+          isTrusted: true,
+        },
+        insertText: 'searchSql({\n\tquery: "$0"\n})',
+        insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
+        range: wordRange,
+      },
+      {
+        label: 'subscribeToResize',
+        kind: monacoEditor.languages.CompletionItemKind.Method,
+        documentation: {
+          value: 'Registers a function to be called when vis gets resized',
+          isTrusted: true,
+        },
+        insertText: 'subscribeToResize((width, height) => {$0})',
+        insertTextRules: monacoEditor.languages.CompletionItemInsertTextRule.InsertAsSnippet,
+        range: wordRange,
+      },
+      {
+        label: 'getWindowDimensions',
+        kind: monacoEditor.languages.CompletionItemKind.Method,
+        documentation: {
+          value: 'Gets the visualization dimentsions',
+          isTrusted: true,
+        },
+        insertText: 'getWindowDimensions()',
+        range: wordRange,
+      }
+    );
+  }
+
+  return {
+    suggestions,
+  };
+};
+
+function ScriptOptions({ stateParams, setValue }: VisEditorOptionsProps<VisParams>) {
+  const onScriptUpdate = useCallback((value: string) => setValue('script', value), [setValue]);
+
+  return (
+    <EuiPanel paddingSize="s">
+      <EuiFlexGroup direction="column" gutterSize="m" className="scriptEditor">
+        <EuiFlexItem grow={false}>
+          <EuiFlexGroup gutterSize="none" justifyContent="spaceBetween" alignItems="baseline">
+            <EuiFlexItem grow={false}>
+              <EuiTitle size="xs">
+                <h2>
+                  <label htmlFor="scriptVisInput">Script</label>
+                </h2>
+              </EuiTitle>
+            </EuiFlexItem>
+
+            <EuiFlexItem grow={false}>
+              <EuiText size="xs">
+                <EuiLink
+                  href="https://help.github.com/articles/github-flavored-markdown/"
+                  target="_blank"
+                >
+                  <FormattedMessage
+                    id="visTypeMarkdown.params.helpLinkLabel"
+                    defaultMessage="Help"
+                  />
+                </EuiLink>
+              </EuiText>
+            </EuiFlexItem>
+          </EuiFlexGroup>
+        </EuiFlexItem>
+
+        <EuiFlexItem>
+          {/* TODO - CodeEditor should respect dark mode */}
+          <CodeEditor
+            languageId="javascript"
+            value={stateParams.script}
+            onChange={onScriptUpdate}
+            suggestionProvider={{
+              triggerCharacters: ['K', '.'],
+              provideCompletionItems: provideSuggestions,
+            }}
+            editorDidMount={(editor) => editor.focus()}
+            fullWidth={true}
+            data-test-subj="scriptTextarea"
+          />
+        </EuiFlexItem>
+      </EuiFlexGroup>
+    </EuiPanel>
+  );
+}
+
+export { ScriptOptions };
diff --git a/src/plugins/vis_type_script/public/vis_definition/editor_options/settings.tsx b/src/plugins/vis_type_script/public/vis_definition/editor_options/settings.tsx
new file mode 100644
index 0000000000000..761628586dadc
--- /dev/null
+++ b/src/plugins/vis_type_script/public/vis_definition/editor_options/settings.tsx
@@ -0,0 +1,121 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import React, { useState } from 'react';
+import {
+  EuiButton,
+  EuiButtonIcon,
+  EuiFieldText,
+  EuiForm,
+  EuiFormRow,
+  EuiPanel,
+  EuiSpacer,
+  EuiTitle,
+} from '@elastic/eui';
+
+import type { IExternalUrl } from '@kbn/core/public';
+import type { VisEditorOptionsProps } from '@kbn/visualizations-plugin/public';
+import type { VisParams } from '../../types';
+
+const DependencyUrl = ({
+  url,
+  allowed,
+  update,
+  remove,
+}: {
+  url: string;
+  allowed: (url: string) => boolean;
+  update: (newVal: string) => void;
+  remove: () => void;
+}) => {
+  const [isFocused, setIsFocused] = useState(false);
+
+  const showErrors = !allowed(url) && !isFocused;
+  // TODO add URL format validation
+  const errors = showErrors
+    ? ['Your Kibana administrator does not allow this URL. This dependency will be ignored.']
+    : [];
+
+  return (
+    <EuiFormRow isInvalid={showErrors} error={errors} fullWidth>
+      <EuiFieldText
+        onBlur={() => setIsFocused(false)}
+        onFocus={() => setIsFocused(true)}
+        fullWidth
+        value={url}
+        onChange={(event) => update(event.target.value)}
+        isInvalid={showErrors}
+        append={
+          <EuiButtonIcon
+            aria-label="Remove"
+            iconType="crossInACircleFilled"
+            color="text"
+            onClick={() => remove()}
+          />
+        }
+      />
+    </EuiFormRow>
+  );
+};
+
+function SettingsOptions({
+  stateParams: { dependencyUrls },
+  setValue,
+  validateUrl,
+}: VisEditorOptionsProps<VisParams> & { validateUrl: IExternalUrl['validateUrl'] }) {
+  const setDependencyUrls = (newDependencyUrls: string[]) =>
+    setValue('dependencyUrls', newDependencyUrls);
+
+  const updateNthDependency = (n: number, newValue: string) => {
+    const newDependencies = [...dependencyUrls];
+    newDependencies[n] = newValue;
+    setDependencyUrls(newDependencies);
+  };
+
+  const removeNthDependency = (n: number) => {
+    setDependencyUrls(dependencyUrls.filter((_, index) => index !== n));
+  };
+
+  const addDependency = () => {
+    setDependencyUrls([...dependencyUrls, '']);
+  };
+
+  const allowed = (url: string) => {
+    try {
+      return validateUrl(url) !== null;
+    } catch {
+      return true;
+    }
+  };
+
+  return (
+    <EuiPanel paddingSize="s">
+      <EuiTitle size="xs">
+        <h2>Dependencies</h2>
+      </EuiTitle>
+      <EuiForm component="form">
+        {dependencyUrls.map((url: string, index: number) => (
+          <DependencyUrl
+            url={url}
+            allowed={allowed}
+            update={(val) => updateNthDependency(index, val)}
+            remove={() => removeNthDependency(index)}
+          />
+        ))}
+      </EuiForm>
+      <EuiSpacer size="m" />
+      <EuiButton size="s" fullWidth iconType="listAdd" onClick={addDependency}>
+        Add dependency
+      </EuiButton>
+    </EuiPanel>
+  );
+}
+
+// default export required for React.Lazy
+// eslint-disable-next-line import/no-default-export
+export { SettingsOptions as default };
diff --git a/src/plugins/vis_type_script/public/vis_definition/editor_options/settings_lazy.tsx b/src/plugins/vis_type_script/public/vis_definition/editor_options/settings_lazy.tsx
new file mode 100644
index 0000000000000..2d2cbd6335098
--- /dev/null
+++ b/src/plugins/vis_type_script/public/vis_definition/editor_options/settings_lazy.tsx
@@ -0,0 +1,21 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import React, { lazy, Suspense } from 'react';
+import { EuiLoadingSpinner } from '@elastic/eui';
+import type { IExternalUrl } from '@kbn/core/public';
+
+// @ts-ignore
+const SettingsOptionsComponent = lazy(() => import('./settings'));
+
+export const getSettingsOptions = (validateUrl: IExternalUrl['validateUrl']) => (props: any) =>
+  (
+    <Suspense fallback={<EuiLoadingSpinner />}>
+      <SettingsOptionsComponent {...props} validateUrl={validateUrl} />
+    </Suspense>
+  );
diff --git a/src/plugins/vis_type_script/public/vis_definition/index.ts b/src/plugins/vis_type_script/public/vis_definition/index.ts
new file mode 100644
index 0000000000000..06bd9f5f95ba5
--- /dev/null
+++ b/src/plugins/vis_type_script/public/vis_definition/index.ts
@@ -0,0 +1,62 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { i18n } from '@kbn/i18n';
+
+import type { IExternalUrl } from '@kbn/core/public';
+import { DefaultEditorSize } from '@kbn/vis-default-editor-plugin/public';
+import { VisGroups, VisTypeDefinition } from '@kbn/visualizations-plugin/public';
+import { ScriptOptions } from './editor_options/script';
+import { getSettingsOptions } from './editor_options/settings_lazy';
+import { toExpressionAst } from '../expression/to_ast';
+import { VisParams } from '../types';
+import { DEFAULT_VIS } from './default_vis';
+
+export const getScriptVisDefinition: (
+  validateUrl: IExternalUrl['validateUrl']
+) => VisTypeDefinition<VisParams> = (validateUrl: IExternalUrl['validateUrl']) => ({
+  name: 'script',
+  title: 'Script-based',
+  isAccessible: true,
+  icon: 'visVega',
+  group: VisGroups.PROMOTED,
+  titleInWizard: i18n.translate('visTypeScript.titleInWizard', {
+    defaultMessage: 'Script-based',
+  }),
+  description: i18n.translate('visTypeScript.description', {
+    defaultMessage: 'Create custom visualizations with a script (e.g. D3).',
+  }),
+  toExpressionAst,
+  visConfig: {
+    defaults: {
+      script: DEFAULT_VIS,
+      dependencyUrls: ['https://unpkg.com/d3@3.4.0/d3.min.js'],
+    },
+  },
+  editorConfig: {
+    optionTabs: [
+      {
+        name: 'script',
+        title: i18n.translate('visTypeScript.tabs.script', {
+          defaultMessage: 'Script',
+        }),
+        editor: ScriptOptions,
+      },
+      {
+        name: 'dependencies',
+        title: i18n.translate('visTypeMarkdown.tabs.dependencies', {
+          defaultMessage: 'Dependencies',
+        }),
+        editor: getSettingsOptions(validateUrl),
+      },
+    ],
+    enableAutoApply: true,
+    defaultSize: DefaultEditorSize.LARGE,
+  },
+  requiresSearch: true,
+});
diff --git a/src/plugins/vis_type_script/tsconfig.json b/src/plugins/vis_type_script/tsconfig.json
new file mode 100644
index 0000000000000..7c32f44935195
--- /dev/null
+++ b/src/plugins/vis_type_script/tsconfig.json
@@ -0,0 +1,21 @@
+{
+  "extends": "../../../tsconfig.base.json",
+  "compilerOptions": {
+    "outDir": "./target/types",
+    "emitDeclarationOnly": true,
+    "declaration": true,
+    "declarationMap": true
+  },
+  "include": [
+    "public/**/*",
+    "server/**/*",
+    "*.ts"
+  ],
+  "references": [
+    { "path": "../../core/tsconfig.json" },
+    { "path": "../expressions/tsconfig.json" },
+    { "path": "../visualizations/tsconfig.json" },
+    { "path": "../kibana_react/tsconfig.json" },
+    { "path": "../vis_default_editor/tsconfig.json" },
+  ]
+}
diff --git a/src/plugins/vis_types/vega/public/vega_type.ts b/src/plugins/vis_types/vega/public/vega_type.ts
index 798930db1f975..5fbdb3c496b6f 100644
--- a/src/plugins/vis_types/vega/public/vega_type.ts
+++ b/src/plugins/vis_types/vega/public/vega_type.ts
@@ -38,7 +38,7 @@ export const createVegaTypeDefinition = (): VisTypeDefinition<VisParams> => {
       defaultMessage: 'Requires knowledge of Vega syntax.',
     }),
     icon: 'visVega',
-    group: VisGroups.PROMOTED,
+    group: VisGroups.TOOLS,
     titleInWizard: i18n.translate('visTypeVega.type.vegaTitleInWizard', {
       defaultMessage: 'Custom visualization',
     }),
diff --git a/tsconfig.base.json b/tsconfig.base.json
index ac35847201b7f..8b4f6694df4f5 100644
--- a/tsconfig.base.json
+++ b/tsconfig.base.json
@@ -163,6 +163,8 @@
       "@kbn/vis-default-editor-plugin/*": ["src/plugins/vis_default_editor/*"],
       "@kbn/vis-type-markdown-plugin": ["src/plugins/vis_type_markdown"],
       "@kbn/vis-type-markdown-plugin/*": ["src/plugins/vis_type_markdown/*"],
+      "@kbn/vis-type-script-plugin": ["src/plugins/vis_type_script"],
+      "@kbn/vis-type-script-plugin/*": ["src/plugins/vis_type_script/*"],
       "@kbn/vis-type-gauge-plugin": ["src/plugins/vis_types/gauge"],
       "@kbn/vis-type-gauge-plugin/*": ["src/plugins/vis_types/gauge/*"],
       "@kbn/vis-type-heatmap-plugin": ["src/plugins/vis_types/heatmap"],
diff --git a/yarn.lock b/yarn.lock
index e4461999d72ab..0f5983431d547 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4168,6 +4168,11 @@
     redux-thunk "^2.3.0"
     reselect "^4.0.0"
 
+"@remote-ui/rpc@1.3.0":
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/@remote-ui/rpc/-/rpc-1.3.0.tgz#e9469803e8024707f096bd52041fdfe61154dac8"
+  integrity sha512-tO0nYON8IhErx/DYxufo7ccwnSh1Vo5mS41HAjUQ+fCctNmRABug0tjvCdOq1E6R6JAq1EbxN0U5w+7pYMcaFg==
+
 "@rushstack/node-core-library@3.43.2":
   version "3.43.2"
   resolved "https://registry.yarnpkg.com/@rushstack/node-core-library/-/node-core-library-3.43.2.tgz#f067371a94fd92ed8f9d9aa8201c5e9e17a19f0f"