engineering blog at https://blog.tangled.sh

update fonts

anirudh.fi 08d8e672 b97a6941

verified
+69 -117
+1
.gitignore
··· 2 2 build/ 3 3 static/tw.css 4 4 *.ttf 5 + *.woff2 5 6 !.gitignore
+22 -11
flake.lock
··· 1 1 { 2 2 "nodes": { 3 - "ia-fonts-src": { 3 + "ibm-plex-mono-src": { 4 4 "flake": false, 5 5 "locked": { 6 - "lastModified": 1686932517, 7 - "narHash": "sha256-2T165nFfCzO65/PIHauJA//S+zug5nUwPcg8NUEydfc=", 8 - "owner": "iaolo", 9 - "repo": "iA-Fonts", 10 - "rev": "f32c04c3058a75d7ce28919ce70fe8800817491b", 11 - "type": "github" 6 + "lastModified": 1731402384, 7 + "narHash": "sha256-OwUmrPfEehLDz0fl2ChYLK8FQM2p0G1+EMrGsYEq+6g=", 8 + "type": "tarball", 9 + "url": "https://github.com/IBM/plex/releases/download/@ibm/plex-mono@1.1.0/ibm-plex-mono.zip" 12 10 }, 13 11 "original": { 14 - "owner": "iaolo", 15 - "repo": "iA-Fonts", 16 - "type": "github" 12 + "type": "tarball", 13 + "url": "https://github.com/IBM/plex/releases/download/@ibm/plex-mono@1.1.0/ibm-plex-mono.zip" 14 + } 15 + }, 16 + "inter-fonts-src": { 17 + "flake": false, 18 + "locked": { 19 + "lastModified": 1731680160, 20 + "narHash": "sha256-5vdKKvHAeZi6igrfpbOdhZlDX2/5+UvzlnCQV6DdqoQ=", 21 + "type": "tarball", 22 + "url": "https://github.com/rsms/inter/releases/download/v4.1/Inter-4.1.zip" 23 + }, 24 + "original": { 25 + "type": "tarball", 26 + "url": "https://github.com/rsms/inter/releases/download/v4.1/Inter-4.1.zip" 17 27 } 18 28 }, 19 29 "nixpkgs": { ··· 48 58 }, 49 59 "root": { 50 60 "inputs": { 51 - "ia-fonts-src": "ia-fonts-src", 61 + "ibm-plex-mono-src": "ibm-plex-mono-src", 62 + "inter-fonts-src": "inter-fonts-src", 52 63 "nixpkgs": "nixpkgs", 53 64 "vite": "vite" 54 65 }
+11 -5
flake.nix
··· 4 4 inputs = { 5 5 nixpkgs.url = "github:nixos/nixpkgs"; 6 6 vite.url = "github:icyphox/go-vite"; 7 - ia-fonts-src = { 8 - url = "github:iaolo/iA-Fonts"; 7 + inter-fonts-src = { 8 + url = "https://github.com/rsms/inter/releases/download/v4.1/Inter-4.1.zip"; 9 + flake = false; 10 + }; 11 + ibm-plex-mono-src = { 12 + url = "https://github.com/IBM/plex/releases/download/%40ibm%2Fplex-mono%401.1.0/ibm-plex-mono.zip"; 9 13 flake = false; 10 14 }; 11 15 }; ··· 14 18 { self 15 19 , nixpkgs 16 20 , vite 17 - , ia-fonts-src 21 + , inter-fonts-src 22 + , ibm-plex-mono-src 18 23 }: 19 24 let 20 25 supportedSystems = [ ··· 42 47 pkgs.tailwindcss 43 48 ]; 44 49 shellHook = '' 45 - cp -f ${ia-fonts-src}/"iA Writer Quattro"/Static/*.ttf static/fonts/ 46 - cp -f ${ia-fonts-src}/"iA Writer Mono"/Static/*.ttf static/fonts/ 50 + cp -f ${inter-fonts-src}/web/InterVariable*.woff2 static/fonts/ 51 + cp -f ${inter-fonts-src}/web/InterDisplay*.woff2 static/fonts/ 52 + cp -f ${ibm-plex-mono-src}/fonts/complete/woff2/IBMPlexMono-Regular.woff2 static/fonts/ 47 53 ''; 48 54 }; 49 55 }
+32 -99
input.css
··· 2 2 @tailwind components; 3 3 @tailwind utilities; 4 4 @layer base { 5 - @font-face { 6 - font-family: "iA Writer Quattro S"; 7 - src: url("/static/fonts/iAWriterQuattroS-Regular.ttf") 8 - format("truetype"); 9 - font-weight: normal; 10 - font-style: normal; 11 - font-display: swap; 12 - font-feature-settings: 13 - "calt" 1, 14 - "kern" 1; 15 - } 16 - @font-face { 17 - font-family: "iA Writer Quattro S"; 18 - src: url("/static/fonts/iAWriterQuattroS-Bold.ttf") format("truetype"); 19 - font-weight: bold; 20 - font-style: normal; 21 - font-display: swap; 22 - font-feature-settings: 23 - "calt" 1, 24 - "kern" 1; 25 - } 26 - @font-face { 27 - font-family: "iA Writer Quattro S"; 28 - src: url("/static/fonts/iAWriterQuattroS-Italic.ttf") format("truetype"); 29 - font-weight: normal; 30 - font-style: italic; 31 - font-display: swap; 32 - font-feature-settings: 33 - "calt" 1, 34 - "kern" 1; 35 - } 36 - @font-face { 37 - font-family: "iA Writer Quattro S"; 38 - src: url("/static/fonts/iAWriterQuattroS-BoldItalic.ttf") 39 - format("truetype"); 40 - font-weight: bold; 41 - font-style: italic; 42 - font-display: swap; 43 - font-feature-settings: 44 - "calt" 1, 45 - "kern" 1; 46 - } 5 + @font-face { 6 + font-family: "InterVariable"; 7 + src: url("/static/fonts/InterVariable.woff2") format("woff2"); 8 + font-weight: normal; 9 + font-style: normal; 10 + font-display: swap; 11 + } 12 + 13 + @font-face { 14 + font-family: "InterVariable"; 15 + src: url("/static/fonts/InterVariable-Italic.woff2") format("woff2"); 16 + font-weight: normal; 17 + font-style: italic; 18 + font-display: swap; 19 + } 20 + 21 + @font-face { 22 + font-family: "InterDisplay"; 23 + src: url("/static/fonts/InterDisplay-Regular.woff2") format("woff2"); 24 + font-weight: normal; 25 + font-style: normal; 26 + font-display: swap; 27 + } 47 28 48 - @font-face { 49 - font-family: "iA Writer Mono S"; 50 - src: url("/static/fonts/iAWriterMonoS-Regular.ttf") format("truetype"); 51 - font-weight: normal; 52 - font-style: normal; 53 - font-display: swap; 54 - font-feature-settings: 55 - "calt" 1, 56 - "kern" 1; 57 - } 58 - @font-face { 59 - font-family: "iA Writer Mono S"; 60 - src: url("/static/fonts/iAWriterMonoS-Bold.ttf") format("truetype"); 61 - font-weight: bold; 62 - font-style: normal; 63 - font-display: swap; 64 - font-feature-settings: 65 - "calt" 1, 66 - "kern" 1; 67 - } 68 - @font-face { 69 - font-family: "iA Writer Mono S"; 70 - src: url("/static/fonts/iAWriterMonoS-Italic.ttf") format("truetype"); 71 - font-weight: normal; 72 - font-style: italic; 73 - font-display: swap; 74 - font-feature-settings: 75 - "calt" 1, 76 - "kern" 1; 77 - } 78 - @font-face { 79 - font-family: "iA Writer Mono S"; 80 - src: url("/static/fonts/iAWriterMonoS-BoldItalic.ttf") 81 - format("truetype"); 82 - font-weight: bold; 83 - font-style: italic; 84 - font-display: swap; 85 - font-feature-settings: 86 - "calt" 1, 87 - "kern" 1; 88 - } 29 + @font-face { 30 + font-family: "IBMPlexMono"; 31 + src: url("/static/fonts/IBMPlexMono-Regular.woff2") format("woff2"); 32 + font-weight: normal; 33 + font-style: italic; 34 + font-display: swap; 35 + } 89 36 90 - @font-face { 91 - font-family: "Inter"; 92 - font-style: normal; 93 - font-weight: 400; 94 - font-display: swap; 95 - font-feature-settings: 96 - "calt" 1, 97 - "kern" 1; 98 - } 99 - h1 { 37 + h1, h2, h3 { 100 38 @apply text-2xl; 101 - @apply font-sans; 39 + @apply font-display; 102 40 @apply text-black; 103 41 @apply font-bold; 104 42 } ··· 107 45 @apply bg-yellow-400; 108 46 @apply text-black; 109 47 @apply bg-opacity-30; 110 - } 111 - 112 - html { 113 - letter-spacing: -0.01em; 114 - word-spacing: -0.07em; 115 48 } 116 49 117 50 @layer base {
+3 -2
tailwind.config.js
··· 15 15 }, 16 16 extend: { 17 17 fontFamily: { 18 - sans: ["iA Writer Quattro S", "Inter", "system-ui", "sans-serif", "ui-sans-serif"], 19 - mono: ["iA Writer Mono S", "ui-monospace", "SFMono-Regular", "Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", "monospace"], 18 + display: ["InterDisplay", "system-ui", "sans-serif", "ui-sans-serif"], 19 + sans: ["InterVariable", "system-ui", "sans-serif", "ui-sans-serif"], 20 + mono: ["IBMPlexMono", "ui-monospace", "SFMono-Regular", "Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", "monospace"], 20 21 }, 21 22 maxWidth: { 22 23 'prose': '65ch',