SEN Language Editor

⚡

Welcome to SEN Editor

A modern language for creating web experiences

SEN (Shape Expression Notation) is a revolutionary markup language designed to create beautiful, interactive experiences with minimal code.

<doc!SEN>

<?/src=myproject>

<stylistic>

  align.center=true

</stylistic>

<label:"{Hello SEN World}">

<button=clickable>

You can add comments using # or #$:

#$ This is a multi-line comment

#$ that spans multiple lines

# This is a single-line comment

Tag	Description
<doc!SEN>	Document start marker
<?/src=name>	Set document source name
<stylistic>	Visual styles container
<underlystics>	Animation effects container
<label:"{text}">	Add text label
<add=dc{placeholder="text"}>	Add input field
<button=clickable>	Create clickable button
<stylistics=color.{blue}.shape=square[...]	Create styled shapes

Shortcut	Action
Ctrl + Enter	Compile code
Ctrl + S	Download .sen file
Ctrl + O	Import file
Ctrl + E	Export to HTML
Tab	Insert 4 spaces
<	Show tag autocomplete
{	Show color/value autocomplete
Ctrl + Space	Force show autocomplete

When typing inside color values: c shows color suggestions

When typing inside shape definitions: s shows shape suggestions

When typing functions: f shows function suggestions

Shapes are created with the <stylistics> tag:

<stylistics=color.{blue}.shape=square[

  width=100px

  height=100px

]>

square

rectangle

triangle

cone

circle

blue

red

green

purple

yellow

You can add textures to shapes:

<stylistics=color.{blue}.shape=square[

  width=150px

  height=150px

  <texture=pattern.png>

]>