MoonshotAI / MoonshotAI/kimi-code

[web] Support switching the UI font family

Open
#1,797 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
7.5k
Forks
1.2k
Avg merge
11h 53m
Merged PRs (30d)
350

Description

Problem

The Kimi Web settings dialog exposes color scheme, accent, and font size preferences, but there is no way to change the font family. The UI and reading text are pinned to the Inter-first stack (--font-ui), so users who prefer the native platform font or a serif face for long reading sessions have no recourse. (There was a code-font switcher in early iterations that was removed during the dark-mode refactor in June; nothing covers the UI/reading font today.)

Proposal

Add a Font preference to Appearance settings (desktop SettingsDialog + mobile MobileSettingsSheet) with a small curated set:

  • Default — the current Inter-first stack (unchanged)
  • System — the platform's native UI stack (SF Pro / Segoe / Roboto + CJK fallbacks), no webfont download
  • Serif — a reading-oriented serif stack (Charter/Georgia + Songti/Noto Serif CJK fallbacks), also local-only

Implementation follows the existing appearance-preference pattern: persist the choice in localStorage, mirror it onto <html data-ui-font-family>, and remap the --font-ui token in CSS. Since --font-display and --sans reference var(--font-ui), every component picks the new face up with zero component-level changes; --font-mono (code) is unaffected.

Happy to send a PR for this.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reading the existing appearance-preference implementation in SettingsDialog and MobileSettingsSheet, then trace how choices reach localStorage, the html data attribute, and the --font-ui token. Add the three specified font choices to both settings surfaces and verify that the default, system, and serif stacks update UI and reading text while leaving --font-mono unchanged.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, typescript
Domain
frontend, web-dev
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
72/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.