Diacritical Details

As a tonal language, Vietnamese writing relies heavily on diacritical marks. To create legible and readable Vietnamese typefaces, the marks not only need to be clear and balanced with the base glyphs, they also must not disrupt the kerning and leading of the overall design. This chapter focuses on the typographic details to help designers see the interaction between the letters and the accents so they can design effective Vietnamese fonts.

Dyet

When designing the letter Đ (uppercase) and đ (lowercase), the width of the cross bar plays a crucial role in legibility. To avoid kerning issues, the bar must not extend too far from its base width. In a serif typeface, the bar can only exceed slightly beyond its serif. For the uppercase letter, the bar needs to be shorter on the left and longer on the right. In contrast, the bar on the lowercase letter needs to be longer on the left and shorter on the right.

Đđ
Minion Pro (left) has the cross bar slightly longer than its serif. Myriad Pro (right) has the cross bar shorter on the left of its uppercase and shorter on the right of its lowercase.

Acute & Grave

The acute (dấu sắc) and grave (dấu huyền) must have the same form. The former signifies the rising tone and the latter signifies the falling tone; therefore, they must reflect each other. On both accents, the bottom is narrower than the top. In relation to their base letter, the acute is positioned slightly right and the grave is positioned slightly left. Both accents must not extend beyond their base letter.

Acute & Grave
Adobe Text Pro has slightly steeper angled acute and grave on its uppercase than lowercase.

Circumflex

The circumflex ( ˆ ) is shaped like a chevron with thick stroke at the top and thinner strokes at both bottoms. The circumflex has the same form as the caron ( ˇ ) but flipped. (The caron is not used in Vietnamese.) The joining of an acute and a grave can create a circumflex, but modifications are needed to produce a symmetrical stroke. In most cases, the circumflex is symmetrical, but it can also be asymmetric and stressed downward. To avoid kerning issues, the circumflex must not be wider than its base letter. Regardless of its design, the circumflex must be proportional to other diacritical marks such as the acute, grave, hook above, and tilde. As a result, its form can be modified when combined with other marks.

Circumflex
Source Sans Pro positioned its circumflex closer to the base on uppercase than lowercase. The angel is deeper on the lowercase than the uppercase. These two modifications are necessary to avoid leading issue.

Breve

The breve is curved and must not be mistaken for the pointed caron ( ˇ ), which does not exist in the Vietnamese writing system. The breve should not attach to the base letter and interfere with other diacritical marks such as the acute, grave, hook above, and tilde. The bottom curve of the breve should be thicker than the two upper ends. Its form can be adjusted when combined with other marks.

Brave
Arno Pro positioned its breve closer to the base on uppercase than lowercase. In addition, the breve is less steeped when combined with other marks to avoid leading issue.

Horn

The horn must be attached to the letter o and u. The stroke begins from the upper right of the base letter and leads upward. Although appending the horn at the top of the u creates a seamless integration, attaching the horn lower on the stem of the u is also acceptable. Consistency and balance (with other diacritical marks such as the acute, grave, hook above, and tilde) are important when determining the position of the horn.

Horn
Avenir Next (left) has its horn at the top of the base letter and Corbel (right) has its horn lower on the stem of the letter.

Hook Above

Although the hook above (   ̉ ) looks like the question mark (?) without the dot, the former must be smaller than the latter and the bottom stem of the hook must be truncated. The hook must always be positioned above the circumflex, breve, and horn. When set together, they need to work in harmony.

Hook Above
Arno Pro (left) with bottom stem on its hook and More Pro (right) without

Tilde

The tilde (dấu ngã) has a symmetrical form because its structure derives from the letter N. As with the letter N, the strokes on both ends are smaller than the middle curve.1 The tilde is always positioned above the vowel, as are the circumflex, breve, and horn; therefore, they must work in harmony.

Tilde
Adobe Text Pro (left) and Arimo (right)

Underdot

For consistency, the underdot (dấu nặng) can be identical to the period and the dot on the letter i. Otherwise the underdot must be smaller than the period. Its placement must be centered directly below the base letter. In some cases with the letter y, the dot can be placed slightly right to avoid clashing with the descender.

Underdot
Cochin
  • 1 Cheng, Karen. Designing Type. (Connecticut: Yale University Press, 2005). 208