USING KANYIT FONTS

Use Kanyit fonts.

Add a hosted font, use it in an app, or download the files for self-hosting.

01. Add a font to a website.

Place the stylesheet link inside your document’s <head>. Then apply the family in your CSS. Each font page generates examples for its available weights.

HTML / index.html

<link rel="stylesheet"
  href="https://fonts.kanyit.com/api/css?family=Padauk%3Awght%40400%3B700" />

CSS / styles.css

body {
  font-family: 'Padauk', sans-serif;
  font-weight: 400;
  line-height: 1.8;
}

strong { font-weight: 700; }

You can use @import at the beginning of your CSS, but an HTML link lets the browser discover the stylesheet earlier. The API includes font-display: swap so text stays readable while fonts load.

02. Use a font in React.

For a Vite React app, put the link in index.html and the font rule in your global stylesheet. No runtime package is needed.

React / a Myanmar text component

export function Greeting() {
  return <p lang="my" className="myanmar">မင်္ဂလာပါ</p>;
}

/* Your global CSS */
.myanmar {
  font-family: 'Padauk', sans-serif;
  line-height: 1.8;
}

For server-rendered frameworks, place the link in the root document or layout using your framework’s head API. With Tailwind, use a CSS class like the one above or your project’s font-family token.

03. Self-host the files.

Open a font page and download the web or desktop files you need.
Download its license and keep it alongside the font.
Place both in your project’s public/fonts/ directory.
Add one @font-face rule per weight and style.

CSS / self-hosted Padauk Regular

@font-face {
  font-family: 'Padauk';
  src: url('/fonts/padauk-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

Self-hosting removes the hosted API dependency. Serve fonts with the correct MIME type, and use versioned filenames when applying long-lived caching. Review the included license before modifying or redistributing a family. The download tool can package selected styles with the original files, license, and a matchingfonts.css file.

04. Use the font API.

HTTP / discover fonts

GET https://fonts.kanyit.com/api/fonts?q=Padauk&page=1
GET https://fonts.kanyit.com/api/fonts/padauk
GET https://fonts.kanyit.com/api/css?family=Padauk%3Awght%40400%3B700

The list returns fonts, total, page, and limit (24 per page). Filter with q, category, or variable=true; sort with sort=name or sort=newest.

The CSS endpoint accepts one family and normal-style weights: family=Padauk:wght@400;700. This legacy form selects individual normal weights. To select exact catalog styles, use styles=id,id; variable styles expose their full declared axis ranges. Unknown families return 404; unsupported weights, styles, or subsets return 400. Arbitrary Google Fonts axis syntax is not supported.

Bundled fonts include their full character coverage. Selecting a subset does not physically shrink a full font file. Style IDs select exact variants, including italic styles. Variable variants keep their full declared axis ranges.

05. Format Myanmar text.

Use Unicode text and lang="my". Allow generous line height for stacked consonants and marks. Avoid artificial letter spacing, clipping, and forced uppercase. Test real sentences at the smallest text size in your design.

Kanyit hosts Unicode fonts. Legacy Zawgyi text needs conversion before it can display correctly with these fonts.

Browse fonts ↗