Basically, the bar itself is a rectangle that can hold arbitrarily many <em>items</em>, which can be configured to do awesome stuff.
An <em>item</em> will occupy a space in the bar and can be equipped to show an <em>icon</em> and a <em>label</em>. The <em>icon</em> and <em>label</em> can be changed through
<em>scripts</em> that can be attached to the <em>item</em>. It is also possible to <em>subscribe</em> an <em>item</em> to certain <em>events</em> for their <em>script</em> execution action,
which makes very powerful items possible.
Furthermore, an <em>item</em> can be assigned to mission control spaces or displays, such that they only show on a certain space or display, which makes multi-desktop configuration
of the bar possible and opens the possibility to create individualized bar configuration on a per display and per space level.
These simple ingredients make <em>items</em> almost endlessly customizable and can be used to display arbitrary information and perform useful actions. For some examples see my sketchybarrc and
the plugins folder.</p><p>Some special features can not be accomplished with a simple <em>item</em>, this is where the <em>components</em> come into play. They basically are <em>items</em> with
extra steps. They contain all the properties a regular item does, but they can do specialized tasks a simple item can not. For example, there
is a <em>graph</em> component, which can be used to display graphs in the bar.</p><p>For more details on how the configuration works, see the configuration section.</p><h2class="anchor anchorWithStickyNavbar_mojV"id="examples">Examples<aclass="hash-link"href="#examples"title="Direct link to heading"></a></h2><p><imgloading="lazy"alt="examples"src="/SketchyBar/assets/images/examples-e91544141827cce7e424ef77f613cea2.png"width="3840"height="2148"class="img_E7b_"></p></div></article><navclass="pagination-nav docusaurus-mt-lg"aria-label="Docs pages navigation"><divclass="pagination-nav__item"></div><divclass="pagination-nav__item pagination-nav__item--next"><aclass="pagination-nav__link"href="/SketchyBar/setup"><divclass="pagination-nav__sublabel">Next</div><divclass="pagination-nav__label">Setup</div></a></div></nav></div></div><divclass="col col--3"><divclass="tableOfContents_cNA8 thin-scrollbar theme-doc-toc-desktop"><ulclass="table-of-contents table-of-contents__left-border"><li><ahref="#features"class="table-of-contents__link toc-highlight">Features</a></li><li><ahref="#examples"class="table-of-contents__link toc-highlight">Examples</a></li></ul></div></div></div></div></main></div></div></div>