SharePoint Lists: Tweak Fonts in JSON

Key insights

• Demo overview: Chris Kent presented a practical session on advanced SharePoint list formatting JSON.
  He demonstrated real-world techniques for typography and visuals during a Microsoft 365 & Power Platform community call.
• What it does: SharePoint column formatting uses declarative JSON to change how list fields display without altering the underlying data.
  Admins and power users apply these JSON objects to control element types, text, and styles in list views.
• Core JSON structure: Key properties include $schema, elmType, txtContent, and a style object where you set font-size.
  A simple JSON block can render a field value with a chosen font size and element type.
• Advanced techniques: Use conditional logic, nested for-each loops, emoji visualizations, and relative scaling with em units to create rich list graphics.
  Combine customCardProps and math functions like floor or ceiling to calculate dynamic font sizes from data.
• Practical benefits: Dynamic font sizing improves data hierarchy, readability, and user focus while keeping lists fast and accessible.
  Formatting is no-code for view managers and preserves original list data.
• Tips for production: Prefer em units for scalable typography and use math functions to avoid overly large or tiny text.
  Preview changes with a formatter tool, test performance, and keep accessibility (contrast and size) in mind.

Microsoft published a recent YouTube demo that explores how to control font size for rich graphics within list formatting using SharePoint JSON. The session, presented by Chris Kent during a Microsoft 365 & Power Platform community call on 25 September 2025, showcases practical techniques that help teams make list data more visual and readable. Moreover, the video balances hands-on examples with explanations of why particular choices matter for accessibility and maintainability. Consequently, viewers get both recipes and the reasoning behind them.

Overview of the demo

The demo opens with a clear goal: make list items visually meaningful by changing typography without altering the underlying data. In addition, the presenter emphasizes that column formatting in SharePoint uses declarative JSON to define elements, and that styling happens through a style object that resembles CSS. For example, a simple fragment sets an element type, content, and a font-size property to change how a field displays. Therefore, even non-developers with view permissions can apply these changes.

How font sizing works in SharePoint JSON

At a basic level, you define an object with an elmType, txtContent, and style, and then include a font-size entry to change text size. The schema reference ensures that your formatter follows Microsoft’s rules, which helps prevent rendering errors and improves compatibility. Furthermore, presenters recommend using relative values when possible to keep designs consistent with site themes and user settings. As a result, lists can respect global styles while still highlighting key fields.

Advanced techniques shown

Chris demonstrates several advanced ideas, starting with nested for-each loops that let you iterate and render complex collections inside one field. He then shows how to use emoji and small graphics as inline visual cues, which make records easier to scan at a glance while retaining semantic meaning. In addition, the demo covers math functions such as floor and ceiling to calculate sizes dynamically from numeric field values, allowing typography to scale based on data.

Moreover, the session highlights relative scaling using em units, which helps typography respond to surrounding elements and user preferences. The presenter also explores customCardProps to build hover cards and interactive displays where font scaling adapts to context. Consequently, these techniques let developers craft interfaces that are both informative and interactive without adding heavy client code.

Tradeoffs and common challenges

While these capabilities expand design options, they also introduce tradeoffs that teams must weigh carefully. For instance, using large inline fonts or emoji can boost readability for sighted users but may confuse screen readers unless you provide proper ARIA labels and textual fallbacks. Additionally, heavy use of dynamic calculations can increase the cognitive burden for maintainers who need to debug or update the formatters later.

Performance and cross-browser consistency are further concerns because complex formatters increase the amount of work the client must do during rendering. Moreover, site themes and user zoom settings can affect relative units like em, which requires testing across devices and user settings. Therefore, teams should balance visual ambition with maintainability and test thoroughly to avoid surprises in production lists.

Practical guidance and tools

For those who want to try the techniques, the video points to community tools that speed up authoring and validation. Tools such as jsonify and SP Formatter can help you build and preview formatters before you apply them, and they reduce the risk of syntax errors or unexpected render results. Additionally, the presenter suggests keeping formatters small and modular so that changes are easier to track and rollback when necessary.

Finally, the demo encourages community participation through regular calls and sample galleries where people share patterns and solutions. By engaging with peers, you can learn which approaches work best across scenarios and avoid repeating common mistakes. In short, the video offers practical recipes and encourages a cautious, test-driven approach to applying rich typography in lists.

Implications for teams

Ultimately, the demo by Microsoft and Chris Kent shows that SharePoint JSON formatting can transform ordinary lists into clearer, more actionable views without changing stored data. However, teams must weigh accessibility, performance, and maintenance when adopting advanced techniques. By starting small, using community tools, and testing across users and devices, organizations can get the visual benefits while managing the risks. Consequently, the approach can deliver strong gains in usability if applied thoughtfully.

Keywords

sharepoint list formatting json font size, json list formatting font size, column formatting json font-size, responsive font size for list formatting json, adaptive cards json font size, controlling font size in json list formatting, json custom formatter graphics, powerful graphics sharepoint json