Home
Softono
code-input

code-input

Open source MIT JavaScript
Website GitHub
235
Stars
29
Forks
27
Issues
4
Watchers
2 months
Last Commit
CSS Frameworks & UI Kits Developer Tools

About code-input

code-input is a lightweight, modular JavaScript library that transforms a standard textarea into an editable code editor with syntax highlighting support. Unlike monolithic alternatives, it is designed to work with any syntax highlighting algorithm or library, including popular options like Prism.js and highlight.js. The library emphasizes flexibility, progressive enhancement, and web standards compliance by maintaining full HTML form compatibility and the standard textarea JavaScript API. Its plugin-based architecture allows developers to extend functionality modularly without bloating the core package. Use cases include embedding code editors in documentation, creating live demo environments, building lightweight IDEs, or any scenario requiring user-editable highlighted text. The project supports multiple themes, languages, and use cases while remaining accessible and performant. It is available via npm and Yarn, with interactive demos and comprehensive documentation to help developers get started quickly.

Platforms

Web Self-hosted

Languages

JavaScript

Links

Website Source Code
w
Published by
webcoder49
Visit View Profile

README.md

View on GitHub

code-input

Click to SwitchWebsite and DemosGitHubCodebergYarnNPM

View License View Releases

An editable <textarea> that supports any syntax highlighting algorithm, for code or something else. Also, added plugins.

Aiming to be more flexible, lightweight, modular, progressively enhanced and standards-based than the alternatives, we support HTML forms, the <textarea> JavaScript interface, more languages and more use cases.

Demos and usage instructions are available at https://code-input-js.org and the docs directory, to let you get started quickly!

A lightweight setup like the animation below is still the default for code-input.js, but a wide range of plugins are available to modularly and progressively enhance the experience - see the website for interactive demos!

Using code-input with many different themes This demonstration uses themes from Prism.js and highlight.js, two syntax-highlighting programs which work well with and have compatibility built-in with code-input.

Contributing

If you have any features you would like to add to code-input as plugins or core functionality, or have found any bugs, please open an issue or fork and submit a pull request! All contributions to this open-source project will be greatly appreciated. You can see more info in our CONTRIBUTING.md file.

If you find a sensitive security vulnerability in the code-input.js library, please email the maintainer Oliver Geer at [email protected], optionally using this encryption key. GitHub security advisories (different to the more general "issues") are also accepted.

Contributors
...have contributed pull requests so far.
(source: contrib.rocks)