https://github.com/jncraton/box-line-text

Simple virtual whiteboarding
https://github.com/jncraton/box-line-text

whiteboard

Last synced: 28 days ago
JSON representation

Simple virtual whiteboarding

• Host: GitHub
• URL: https://github.com/jncraton/box-line-text
• Owner: jncraton
• License: other
• Created: 2020-04-19T20:03:28.000Z (over 4 years ago)
• Default Branch: main
• Last Pushed: 2024-11-14T20:55:58.000Z (28 days ago)
• Last Synced: 2024-11-14T21:31:42.056Z (28 days ago)
• Topics: whiteboard
• Language: HTML
• Homepage:
• Size: 128 KB
• Stars: 455
• Watchers: 9
• Forks: 27
• Open Issues: 4
• Metadata Files:
  • Readme: readme.md
  • License: license.txt

Awesome Lists containing this project

• awesome-starred - jncraton/box-line-text - Simple virtual whiteboarding (others)

README

        
Box Line Text

=============

[![Netlify Status](https://api.netlify.com/api/v1/badges/99b4904a-b8a1-42b7-8495-13215fb6ba7d/deploy-status)](https://app.netlify.com/sites/box-line-text/deploys)

[![UI Test](https://github.com/jncraton/box-line-text/actions/workflows/test.yml/badge.svg)](https://github.com/jncraton/box-line-text/actions/workflows/test.yml)

Box Line Text (BLT) is a simple virtual whiteboarding tool. It is minimalistic and contains no visible UI for a clean screencasting experience.

[Use it](https://box-line-text.netlify.app/)

![Basic demo](media/demo.gif)

Usage

-----

- Click anywhere to create a text element

- Click and drag a straight line to make a line

- Click and drag a diagonal line to make a box

- Hold shift to use the mouse as an eraser

- Share documents via URL

Advanced Usage

- Press Ctrl-z to undo creating elements

- Press Ctrl and drag an element to move it

- Press Ctrl and drag the background to move all elements

- Immediately after creating an element, use the arrow keys to cycle through a few basic styles:

    - Boxes - Background colors

    - Lines - Arrows

    - Floating text - Double size, quad size, vertical

    

This tool assumes that you are screencasting from a laptop or desktop, so it is optimized for using a mouse to create figures and a physical keyboard to create text. It does not provide touch and pen support.

FAQ

---

### How do I save?

Diagram state is stored in the URL, so any method of saving a URL can be used to save your work. In most browsers, you also can save the page as an HTML file. This should save your diagram and allow you to pick up where you left off. Screenshots and/or screen recordings may also be used to save your work.

### Is there a way to make the diagram larger or smaller?

Native zoom in your browser is supported and should work for this purpose.

### Can I make the diagram fill my entire screen?

Yes. Full screen mode is supported. You can enter full screen mode as you normally would in your browser (perhaps by pressing F11).