/* For headings, you might prefer SF Pro Display (slightly different metrics) */ h1, h2, h3, h4, h5, h6 { font-family: "SF Pro Display", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: 600; letter-spacing: -0.02em; }
/* If using SF Pro specifically for numeric/UI clarity */ .ui-text, .code-like, .tabular-nums { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; } sf pro font
/* SF Pro Font Stack */ body { font-family: "SF Pro Text", "SF Pro Display", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: 400; font-size: 16px; line-height: 1.5; font-synthesis: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* For headings, you might prefer SF Pro