Bliss SVG Builder

Appearance

Bliss SVG BuilderGenerate SVG for Blissymbolics

Compose and render Blissymbolics using a compact DSL

Get Started
View on GitHub

DSL-Powered

Use a simple domain-specific language to describe Bliss characters and compositions

Dynamic Rendering

Generate SVG output at runtime - no pre-built assets needed

Highly Customizable

Control colors, sizes, spacing, grids and more with flexible options

Multi-Format

Supports ES modules, CommonJS, and UMD for maximum compatibility

Quick Example ​

Render Bliss compositions using B-codes for Bliss characters from Blissary's Bliss dictionary:

B313 - feeling, emotion
Input:
B313
B1103 - understanding
Input:
B1103

Combine characters into words with /:

feeling + understanding = empathy
Input:
B313/B1103

And words into sentences with //:

I want to listen to music.
Input:
B513/B10//B313;B81/B319//B278;B81//B278/B462//B4

Style with options:

Styled character
Input:
[color=#2563eb]||B431

What is Blissymbolics? ​

Blissymbolics (or Bliss) is an ideographic language in which meaning is expressed through the composition of Bliss characters, each of which carries its own conceptual meaning. It is widely used as an augmentative and alternative communication (AAC) system.

Bliss-SVG-Builder makes it easy to work with the graphical representation of Bliss programmatically, supporting recursive composition of graphical elements and Bliss characters into complete Bliss sentences using SVG.