Tiếng Việt Southern

Design system

Style guide

Every building block the textbook uses, on one page. Use the moon/sun button in the top-right corner to check both themes.

Colors

--bg
--surface
--surface-2
--border
--muted
--text
--btn-bg
--south
--good
--bad

Typography

Eyebrow label

Heading one

Heading three

Body text is set in Inter at 16px. Vietnamese has stacked accents like ế, ộ and ữ, so the line height leaves room for them: Tiếng Việt có sáu dấu thanh. Here is a link, some bold text, some italic text and a bit of inline code.

A lead paragraph introduces a chapter and is slightly larger and softer.

Captions and helper text use the muted color at 14px.

Học, học nữa, học mãi. (Study, study more, study forever.)

  • Unordered list item
  • Another item with a clickable word:
  • A third item
  1. First step
  2. Second step
  3. Third step
[[xin chào]]          a clickable word
[[đ :: đờ]]           shown as "đ", spoken as "đờ"

Clickable words

Inline in a sentence: say to greet someone and to say thank you. Longer phrases work too:

Normal
Hover
Playing
No audio yet

When the spoken form differs from what's shown, like a letter name: the letter is called đờ.

Buttons

Callouts

Say each word out loud before you click it, then compare. Guessing first trains your ear much faster than just listening.

In Saigon, is said like the English y in "yes", so (happy) sounds like "yui".

and sound the same in the South, but they're still spelled differently, so learn both marks.

Tables

Vietnamese Sounds like English
sin chow hello
gahm uhn thank you
sin loy sorry
yah yes (polite, Southern)
khohm no
Tone Word Meaning
ngang ghost
sắc mother
huyền but
hỏi grave
ngã horse
nặng rice seedling

Cards

A plain card

Cards hold grouped content without a link. No shadows: they sit on a slightly warmer surface instead.

Dialogue

  • Lan: Hello!
  • Minh: Hi. What's your name?
  • Lan: My name is Lan.
  • Minh: Nice to meet you.

Reveal

Show the answer

The word is mạ, with the nặng tone: low, short and heavy.

Why are there only five tones in the South?

Southern speakers pronounce hỏi and ngã the same way, so in practice you hear five tones, not six.

Components

Tone drill

Minimal pair

Sentence builder

Tone checker

Press Record and say the word. The first time, it asks for a flat "aaa" to learn your normal voice level. Your recording stays in your browser.

Forms