skills.rest
pnp
pnpOFFICIAL
Explore all skills by this author →
Website𝕏@m365pnpGitHub

style-monochrome

Generates monochrome slate design tokens and rowFormatter JSON for SharePoint list styling.

128|50|Updated May 4, 2026
Search Tags:#json#sharepoint#copilot#list formatting#monochrome#view formatting#rowformatter
One-click install
npx skills add https://github.com/pnp/sharepoint-skills --skill style-monochrome-pnp
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: style-monochrome
Source: https://github.com/pnp/sharepoint-skills/tree/main/Skills/style-monochrome/style-monochrome
Command: npx skills add https://github.com/pnp/sharepoint-skills --skill style-monochrome-pnp

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Styling SharePoint list views with a consistent, restrained single-color design requires hand-writing complex view-formatting JSON, which is error-prone and time-consuming. This Skill provides ready-made monochrome design tokens and a complete rowFormatter template so Copilot in SharePoint can apply a corporate slate-blue card layout to a list. ## Core Features & Use Cases - Monochrome Design Tokens: Predefined badge and row-card tokens using a single slate-blue hue family, with a shade ramp mapping list status values from lightest (earliest) to darkest (final). - Complete rowFormatter JSON: A full SharePoint view-formatting template featuring a 32px hero progress number, 4px left accent border, status badge, deadline display with overdue handling, and a tonal progress bar. - Lifecycle Mapping Guidance: Rules for mapping non-linear workflows (parallel branches, paused states, terminal failures) to the shade ramp without breaking tonal restraint. - Use Case: A user managing a document approval list asks Copilot for a "monochrome" or "corporate" look, and the Skill produces adapted view-formatting JSON matching the list's actual column names and Choice values. ## Quick Start Ask Copilot in SharePoint to apply the monochrome style to your list view with a large progress number and slate status badges.

Frequently Asked Questions about style-monochrome

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I apply a monochrome style to a SharePoint list view?▼

Install the skill folder containing SKILL.md into the Skills folder of your site's Agent Assets library, then ask Copilot in SharePoint for a monochrome or corporate style. The rowFormatter JSON is adapted to your list's actual column names and Choice values before being applied.

What is SharePoint rowFormatter JSON view formatting?▼

rowFormatter is part of SharePoint's view-formatting schema that replaces the default column grid with custom HTML-like element trees. It uses expressions referencing list fields, such as [$Status] or [$Progress], to control layout, colors, and conditional styling per row.

Can the monochrome style handle more than five status values?▼

The slate shade ramp supports five distinct states legibly, from lightest to darkest. With more than five states the shades become ambiguous, so the Skill recommends choosing a different style such as Bento or Figma-clean for those lists.

How are overdue items shown without using red color?▼

Overdue deadlines are rendered with bold 700-weight text plus an em-dash overdue suffix, keeping the palette strictly monochrome. The progress bar and hero number also use status shades instead of traffic-light colors.

How do I map paused or reverted workflow states to the shade ramp?▼

Map paused or reverted states to the same shade as the most recent forward state, adding only a thin 1px dashed outline. Terminal failure states like Cancelled use the darkest shade with an italicized label, never red.

Related Skills

Explore More Design & Creative Skills→
zrosenfieldzrosenfield
84

list-formatting

Create custom JSON visual styles for SharePoint lists and libraries.

Community
Intermediate
alastor0325alastor0325

open-team

Opens Firefox review-team dashboards hosted on GitHub Pages for specified teams.

Community
Basic
RorySullivan1RorySullivan1

sharepoint-column-formatting

Generates declarative JSON formatters that style SharePoint list columns and views.

Community
Intermediate
Strategic-AutomationStrategic-Automation
6

openhue

Automates Philips Hue lighting control via the command line.

Official
Intermediate