Zebar

Zebar lets you create customizable and cross-platform desktop widgets.

[![Discord invite][discord-badge]][discord-link] [![Good first issues][issues-badge]][issues-link]

Accessing Zebar GUI

Click the Zebar icon in your system tray to open the GUI interface.

Auto-starting widgets

Widgets can be set to run on startup by right clicking the Zebar tray icon then going to Widget packs -> ` -> -> Run on startup` and clicking the widget name to check it.

Intro to Zebar

Widgets are powered by native webviews (_similar_ to Electron, but more lightweight).

Creating your own widgets

Zebar looks within the ~/.glzr/zebar directory for directories containing a zpack.json file. Each zpack.json file defines a widget pack. Each widget pack can contain multiple widgets, each defined individually within the zpack.json file.

For example, a widget pack config could be located at ~/.glzr/zebar/example-widget/zpack.json, which would create a widget pack with an id of example-widget. Zebar only looks for zpack.json files one level deep within the ~/.glzr/zebar directory, so ~/glzr/zebar/example-widget/widget-1/zpack.json is invalid.

In the My widgets tab of the Zebar GUI, you can click Create new pack to generate a widget pack scaffold with the given name and description.

Within each widget pack, in the Widgets section you can click Add widget to create a new widget within that pack. When creating a new widget you can pick between some templates to get you started.

Apart from the React buildless template, other available templates require you to have Node.js and a package manager (npm/pnpm) installed. For these templates, run the build command (e.g. pnpm build) from the widget directory after any source code changes.

Modifying marketplace widgets

To edit a marketplace widget without fear of your changes being overridden, you should copy the folder from the marketplace directory (located at %AppData%/zebar/downloads/) to your own Zebar directory (located at ~/.glzr/zebar/).

DO NOT re-publish other peoples widgets without permission.

Advanced Customization

What is the zpack.json file?

Widgets are stored in packs, with each pack being defined by a zpack.json file. Each pack can contain multiple widgets, each individually defined within zpack.json.

Widgets consist of an HTML file, and any…