Learn Common (CL)

Sixteen short lessons. Each one runs live on this page, and each has a button that opens it in the editor so you can change it.

🏰New: the Common Quest. Ten levels, from the gate to the throne, with an editor that hints every word as you type. Your progress is saved as you go.Start ▶
The three rules, and that is all of them
  1. Every line starts with a command: show, set, if, for each, repeat…
  2. A value goes inside text in brackets: show "Hello, [name]"
  3. if, for each, repeat, to, and a show on its own, own the lines below them, up to a line that says end.
Learn these ten. Look up the rest.
show set [ ] if / otherwise / end for each repeat query form include count of

These ten build a whole personal site. The other words are in the glossary when you need them.

1. Put something on the page with show
show "Hello, world!"
show "Lines come out in order."
show 2 + 2
Output Try it ▶
Hello, world! Lines come out in order. 4
2. Remember a value with set
set planet to "Earth"
set moons to 1
show "Welcome to [planet], home of [moons] moon."
Output Try it ▶
Welcome to Earth, home of 1 moon.
3. Math works the way you expect
set price to 19.99
set quantity to 3
set total to price * quantity
show "Three at $[price] is $[total]"
show "Half of that is $[total / 2]"
show "Grouping: [(2 + 3) * 4]"
Output Try it ▶
Three at $19.99 is $59.97 Half of that is $29.985 Grouping: 20
4. Decide with if, otherwise, end
set temperature to 31
if temperature is more than 30
  show "It is hot."
otherwise if temperature is less than 10
  show "It is cold."
otherwise
  show "It is fine."
end
Output Try it ▶
It is hot.
5. Combine with and, or, not
set age to 16
set with_adult to yes
if age is at least 18 or with_adult
  show "Come in."
end
if not with_adult and age is less than 18
  show "Sorry."
end
show "Is 7 at most 7? [7 is at most 7]"
Output Try it ▶
Come in. Is 7 at most 7? yes
6. Lists
set colors to "red", "green", "blue"
add "yellow" to colors
show "There are [count of colors] colors: [colors]"
show "First: [first of colors]"
show "Last: [last of colors]"
show "Second: [item 2 of colors]"
Output Try it ▶
There are 4 colors: red, green, blue, yellow First: red Last: yellow Second: green
7. Walk a list with for each
set tasks to "Write the code", "Test it", "Ship it"
set done to 0
show "<ol>"
for each task in tasks
  set done to done + 1
  show "<li>[task]</li>"
end
show "</ol>"
show "[done] tasks."
Output Try it ▶
  1. Write the code
  2. Test it
  3. Ship it
3 tasks.
8. Do something N times with repeat
set rating to 4
repeat rating times
  show "★"
end
repeat 5 - rating times
  show "☆"
end
Output Try it ▶
★ ★ ★ ★ ☆
9. Read the address with query
set mood to query "mood"
if mood is empty
  show "Add ?mood=happy to the address bar."
otherwise
  show "You are feeling [mood]."
end
Output Try it ▶
Add ?mood=happy to the address bar.
10. Blocks nest: a times table
set rows to 1, 2, 3, 4, 5
show "<table>"
for each row in rows
  show "<tr>"
  for each col in rows
    if row is col
      show "<td><b>[row * col]</b></td>"
    otherwise
      show "<td>[row * col]</td>"
    end
  end
  show "</tr>"
end
show "</table>"
Output Try it ▶
1 2 3 4 5
2 4 6 8 10
3 6 9 12 15
4 8 12 16 20
5 10 15 20 25
11. Shape text
set heading to "  Hello, World  "
show "[trim of heading]"
show "[uppercase of heading]"
set slug to replace " " with "-" in lowercase of trim of heading
show "[slug]"
set parts to split "2026-10-24" by "-"
show "Year [item 1 of parts], month [item 2 of parts]"
show "[number of "21"] doubled is [number of "21" * 2]"
Output Try it ▶
Hello, World HELLO, WORLD hello,-world Year 2026, month 10 21 doubled is 42
12. Dates, paragraphs and an empty list
show "Today is [date of today]."
set story to "One line.\n\nThen a blank line.\n\nThen a third."
for each paragraph in paragraphs of story
  show "<p>[paragraph]</p>"
end
set names to empty list
add "Ada" to names
show "[count of names] name: [names]"
Output Try it ▶
Today is 30 October 2026.

One line.

Then a blank line.

Then a third.

1 name: Ada
13. Longer text: a show block
set title to "Cards"
set items to "one", "two"
show
  <h3>[title]</h3>
  <p>There are [the count of items] items.</p>
end
for each item in items
  show
    <li>[item]</li>
  end
end
Output Try it ▶

Cards

There are 2 items.

  • one
  • two
    • 14. Your own verbs
    to greet someone
  show "<p>Hello, [someone]!</p>"
end

to slug_of heading
  give replace " " with "-" in lowercase of trim of heading
end

greet "Ada"
greet "Grace"
show "<p>Slug: [slug_of "Hello World"]</p>"
    Output Try it ▶

    Hello, Ada!

    Hello, Grace!

    Slug: hello-world

    15. Records you make
    set lamp to record
  name: "Desk lamp"
  price: 19
  stock: 7
end
show "<p>[name of lamp] costs $[price of lamp]</p>"
set price of lamp to 15
show "<p>Now $[price of lamp], [stock of lamp] left</p>"
    Output Try it ▶

    Desk lamp costs $19

    Now $15, 7 left

    16. Repeat until
    set found to no
set n to 0
repeat 100 times until found
  set n to n + 1
  if n * n is more than 50
    set found to yes
  end
end
show "The first number whose square passes 50 is [n]."
    Output Try it ▶
    The first number whose square passes 50 is 8.

    Now the exercises Build a guestbook in ten minutes