编程字体

选择编程字体

选择一种字体来查看代码显示效果：

细粗400

小大13px

Iosevka Custom

Recursive Mono

IBM Plex Mono

Fira Code

JetBrains Mono

Cascadia Code

Source Code Pro

monospace

Rocq / Coq

From Coq Require Import ssreflect.

(* ensure proofs are well-structured *)
Set Default Goal Selector "!".
#[global] Open Scope general_if_scope.

Module list_playground.
  (* Let's do a typical proof by induction: we'll define [list] as an inductive,
     [app] (list append) as a recursive function, and prove that [app] is
     associative. *)
  Inductive list (A: Type) :=
  | nil
  | cons (x: A) (l: list A).

  (* Fix up implicit arguments. *)
  Arguments nil {A}.
  Arguments cons {A} x l.
  Notation "[]" := nil.
  Infix "::" := cons.

  Fixpoint app {A} (l1 l2: list A): list A :=
    match l1 with
    | [] => l2
    | x :: l1 => x :: app l1 l2
    end.

  Infix "++" := app.

  Theorem app_assoc {A} (l1 l2 l3: list A) :
    (l1 ++ l2) ++ l3 = l1 ++ (l2 ++ l3).
  Proof.
    induction l1 as [|x l1]; simpl.
    - reflexivity.
    - by rewrite IHl1.
  Qed.
End list_playground.

JavaScript

// 箭头函数和连字示例
const fibonacci = (n) => {
  if (n <= 1) return n;
  return fibonacci(n - 1) + fibonacci(n - 2);
};

// 比较操作符连字
if (x !== y && x >= 0) {
  return x <= max ? x : max;
}

// 逻辑操作符和箭头
const result = isValid && isReady || hasDefault;
const transform = (data) => data.map(x => x * 2);

// 函数式编程
const compose = (f, g) => (x) => f(g(x));
const pipe = (...fns) => (value) => fns.reduce((acc, fn) => fn(acc), value);

TypeScript

// TypeScript 类型定义
interface User {
  id: number;
  name: string;
  email?: string;
}

// 泛型函数
function createArray<T>(item: T, length: number): T[] {
  return Array(length).fill(item);
}

// 条件类型和映射类型
type NonNullable<T> = T extends null | undefined ? never : T;
type Partial<T> = {
  [P in keyof T]?: T[P];
};

// 箭头函数和解构
const processUser = ({ id, name, ...rest }: User) => ({
  userId: id,
  displayName: name,
  ...rest
});

CSS

/* CSS 变量和现代语法 */
:root {
  --primary-color: #3498db;
  --secondary-color: #2ecc71;
  --font-family: 'Inter', sans-serif;
}

/* Grid 和 Flexbox */
.container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1rem;
}

/* 现代 CSS 选择器 */
.card:has(.important) {
  border-left: 4px solid var(--primary-color);
}

/* 函数式 CSS */
.button {
  background: linear-gradient(45deg, var(--primary-color), var(--secondary-color));
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

我的 Iosevka 构建方案

参考 Thanks for all the font suggestions, I made this Iosevka plan which I replaced Code Saver with! - Reddit

构建指南 Building Iosevka from Source - be5invis/Iosevka

private-build-plans.toml

[buildPlans.IosevkaCustom]
family = "Iosevka Custom"
spacing = "normal"
serifs = "sans"
noCvSs = false
exportGlyphNames = true

[buildPlans.IosevkaCustom.variants]
inherits = "ss17"

[buildPlans.IosevkaCustom.variants.design]
one = "base"
two = "straight-neck-serifless"
three = "flat-top-serifless"
four = "semi-open-non-crossing-serifless"
five = "oblique-arched-serifless"
six = "open-contour"
eight = "crossing-asymmetric"
nine = "open-contour"
capital-a = "straight-serifless"
capital-b = "standard-serifless"
capital-c = "serifless"
capital-d = "more-rounded-serifless"
capital-e = "serifless"
capital-f = "serifless"
capital-g = "toothless-corner-serifless-hooked"
capital-i = "serifed"
capital-j = "serifed"
capital-k = "straight-serifless"
capital-l = "serifless"
capital-m = "hanging-serifless"
capital-p = "closed-serifless"
capital-q = "crossing"
capital-r = "straight-serifless"
capital-s = "serifless"
capital-t = "serifless"
a = "double-storey-serifless"
b = "toothed-serifless"
d = "toothed-serifless"
f = "serifless"
g = "double-storey"
i = "serifed"
l = "serifed-semi-tailed"
n = "straight-serifless"
r = "serifless"
t = "flat-hook-short-neck"
w = "straight-almost-flat-top-serifless"
capital-eszet = "rounded-serifless"
long-s = "bent-hook-diagonal-tailed"
cyrl-en = "serifless"
cyrl-er = "eared-serifless"
cyrl-capital-u = "cursive-serifless"
cyrl-e = "serifless"
tittle = "round"
diacritic-dot = "round"
punctuation-dot = "round"
braille-dot = "round"
tilde = "low"
asterisk = "penta-high"
underscore = "high"
caret = "medium"
ascii-grave = "straight"
ascii-single-quote = "straight"
paren = "large-contour"
brace = "curly-flat-boundary"
guillemet = "straight"
number-sign = "slanted"
at = "threefold"
dollar = "interrupted"
cent = "bar-interrupted"
percent = "rings-segmented-slash"
bar = "natural-slope"
question = "corner"
pilcrow = "curved"
micro-sign = "tailed-serifless"
decorative-angle-brackets = "middle"
lig-ltgteq = "flat"
lig-neq = "more-slanted-dotted"
lig-equal-chain = "with-notch"
lig-plus-chain = "without-notch"
lig-double-arrow-bar = "with-notch"
lig-single-arrow-bar = "without-notch"


[buildPlans.IosevkaCustom.ligations]
# inherits = "dlig"
inherits = "default-calt"

[buildPlans.IosevkaCustom.variants.italic]
a = "single-storey-serifed"
# f = "tailed"
g = "single-storey-serifless"
# i = "tailed-serifed"
# l = "tailed-serifed"
# n = "tailed-serifless"
m = "serifless"
n = "straight-serifless"
# t = "bent-hook-short-neck"
u = "toothed-serifless"  # removes bottom-right serif which makes the space after 'u' too tight
w = "cursive-serifless"

# "IBM Plex Mono" style italic
f = "flat-hook-diagonal-tailed"
i = "serifed-diagonal-tailed"
k = "diagonal-tailed-cursive-serifless"
l = "serifed-diagonal-tailed"
t = "diagonal-tailed-short-neck"
# x = "cursive"

[buildPlans.IosevkaCustom.widths.Normal]
shape = 600
menu = 5
css = "normal"



[buildPlans.IosevkaCustom.slopes.Upright]
angle = 0
shape = "upright"
menu = "upright"
css = "normal"

[buildPlans.IosevkaCustom.slopes.Italic]
angle = 9.4
shape = "italic"
menu = "italic"
css = "italic"

[buildPlans.IosevkaCustom.weights.Light]
shape = 300
menu = 300
css = 300

[buildPlans.IosevkaCustom.weights.Regular]
shape = 400
menu = 400
css = 400

[buildPlans.IosevkaCustom.weights.Bold]
shape = 700
menu = 700
css = 700