0.1.0 • Published 2 years ago

kell v0.1.0

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

kell

the simplest and smallest code editor for web, with no dependencies

try it online!

features

  • even smaller than its contemporaries (535 bytes of JavaScript, minified and gzipped)
  • no-frills editing area (nothing except for line numbers)
  • still customizable (use CSS variables, or write your own styles)

size comparisons

librarysize (min+gzip)size (min)
kell535B882B
CodeJar2.33kB5.21kB
CodeFlask8.27kB24.7kB
EditArea29.4kB115kB
CodeMirror 557kB173kB
Ace100kB367kB
librarysize (min+gzip)size (min)
kell535B882B
spell912B1.66kB
pell1.37kB3.4kB

usage

<link rel="stylesheet" type="text/css" href="https://unpkg.com/kell/dist/kell.min.css">

<div id="container"></div>

<script src="https://unpkg.com/kell"></script>
<script>const editor = kell('editor', document.getElementById('container'))</script>

API

const editor = kell(id, container)

create a new kell component, and return it.

id

type: string

an ID to assign to the component.

container

type: Element

an element to append the component to.

editor.content

type: string

getter & setter for the contents of the component's textarea.

customization

change the size:

/* maybe a little smaller... */
.kell {
  width:500px;
  height:250px;
}

change the colors:

/* how about a dark theme? */
:root {
  --kell-gutter-bg:#222;
  --kell-gutter-fg:#ccc;
  --kell-content-bg:#333;
  --kell-content-fg:#fff;
  --kell-border:#555;
}

license

MIT

donate

you can support the development of this project and others via Patreon:

Support me on Patreon