Skip to content

ZephJS is an easy, understandable, and ultra-light framework for defining and using Web Components.


Notifications You must be signed in to change notification settings


Repository files navigation

npm GitHub npm GitHub contributors GitHub last commit Twitter Follow
node GitHub issues Snyk Vulnerabilities for GitHub Repo dependency status for latest release


ZephJS is an easy, understandable, and ultra-light framework for defining and using Web Components. It is perfect for people writing component libraries, teams building applications or sites that just require a few custom components, or projects building whole applications that do not want all the weight of a modern JavaScript Browser framework. ZephJS simplifies the process of defining custom Web Components into a declarative, highly readable structure that uses standard JavaScript, standard HTML markup, and standard CSS Styling.

ZephJS aims to bring the promised ease of web components back to the community. It does so by living up to the following principles:

  • Define new components simply in a readable, declarative manner.
  • Make it easy for a component or component library to be used by others.
  • Use the standards and technologies that have made the web great.
  • Never try to outwit the browser.
  • Keep it incredibly small and light.

ZephJS is often called just "Zeph" and pronounced "Zef".


ZephJS has the following features...

  • Easily define Web Components;
  • Extremely readable declarative syntax;
  • Uses 100% Standard Browser APIs;
  • Uses 100% Standard JavaScript/ES2018;
  • Uses 100% Standard HTML, inline or separated;
  • Uses 100% Standard CSS, inline or separated;
  • Encapsulated styles and content do not leak;
  • Components can extend other components;
  • Value propagation via Attribute/Property/Content binding;
  • Supports building one-off components;
  • or Supports building component libraries;
  • or Supports building entire applications;
  • Included CLI for easy new component scaffolding;
  • Included Bundler (using Rollup) to package into a single distributable;
  • and ZephJS is under 20k minified!

Get Started

ZephJS has four different use cases that are addressable as one gets started:

Pick the best way to get started for you and start using ZephJS today!

Additional Information


ZephJS Provides a ton of documentation to help you use it...

Getting Started





Command Line Tool

Command Line Reference

ZephJS ships with a little command line tool (CLI) to help with your ZephJS related needs. This is installed locally when you install ZephJS via npm and can be accessed with the shell command zeph. It has the following syntax:

zeph <command>

There are a number of commands you can do. Very quickly:

  • hello: Generate the example hello world application.
  • create: Create a new component including .js, .html, and .css stub files.
  • serve: Run a small Web Server on http://localhost:4000 that will serve the current directory.
  • bundle: Bundle multiple ZephJS components into a single file.

For more information, see our documentation on the Zeph Command Line Interface.


ZephJS ships with a set of examples for your reference.

Browser Compatability

ZephJS is built on modern browser standards and thus requires a modern browser to work. In particular it requires the following Web Standards: Shadow DOM v1, Custom Elements v1, Mutation Observer, and Fetch.

The following browser compatability chart indicates which browsers are supported and which are not. (All browser statistics taken from and used under the conditions of thier license.)

Browser Minimum Required Version Notes
Firefox 63
Chrome 54
Safari 10.1 :host and ::slotted psuedo-selectors are buggy.
Opera 41
Microsoft Edge 15 (with Polyfill) Requires use of Polymer polyfill. See ZephJS Polyfill Documentation.
Microsoft Internet Explorer NOT SUPPORTED
IOS Safari 10.3 :host and ::slotted psuedo-selectors are buggy.
Android Browser 67
Blackberry Browser NOT SUPPORTED No support as ov v10.
Opera Mobile 46
Chrome for Android 71
Firefox for Android 64
IE Mobile NOT SUPPORTED No support as of v11
UC Browser for Android 11.8
Samsung Internet 6.2
QQBrowser NOT SUPPORTED No support as of v1.2
Baidu Browser NOT SUPPORTED No support as of v7.12
(Chart last updated Feb 25, 2019)

The Awesome Engineering Company

ZephJS is written and maintained by The Awesome Engineering Company. The Awesome Engineering Company believes in building clean, configurable, creative software for engineers and architects and customers.

To learn more about The Awesome Engineering Company and our suite of products, visit us on the web at

Support and Help

This product is maintained and supported by The Awesome Engineering Company. For support please file an issue or contact us via our Webiste at We will do our best to respond to you in a timely fashion.


ZephJS is released under the MIT License. Please read the LICENSE file for details.


ZephJS is an easy, understandable, and ultra-light framework for defining and using Web Components.




Code of conduct





No releases published


No packages published