Skip to main content

​
Prerequisites

  • Access to your sheet configuration YAML via Administration > Nextedy POWERSHEET > Sheet Configurations
  • Familiarity with the basic column configuration structure

​
Step 1: Apply a Predefined Header Style

Powersheet includes a set of built-in semantic style presets. Apply one to a column header using the header.style property: 
columns:
  description:
    title: Foreseeable Sequence of Events
    width: 140
    header:
      style: lightpurple

​
Available Predefined Styles

Style NameText ColorBackground ColorNotes
none——No styling
boldTitle——fontWeight: 600
unsupportedgrey800grey200Strikethrough text
darkgreygrey700grey200
greygrey700grey100
darkredred700red200
redred700red100
darkorangeorange700orange200
orangeorange700orange100
darkgreengreen700green200
greengreen700green100
lightgreengreen700primaryalt100
darkblueblue700blue200
blueblue700blue100
lightblueblue700teal100
darktealteal700teal200
tealteal700teal100
darkpurplepurple700purple200
purplepurple700purple100
lightpurplepurple700primary100
Use consistent colors across your sheet to group related columns visually: for example, red for risks, blue for requirements, green for controls, and purple for references.

​
Step 2: Define a Custom Style

If the predefined styles do not meet your needs, define your own in the styles section of the sheet configuration: 
styles:
  readOnlyStyle:
    backgroundColor: 'grey100'
  warningHeader:
    color: 'orange700'
    backgroundColor: 'orange100'
  criticalHeader:
    color: 'red700'
    backgroundColor: 'red200'
    fontWeight: 600
Then reference the custom style in a column header: 
columns:
  outlineNumber:
    title: "#"
    width: 80
    isReadOnly: true
    header:
      style: warningHeader
Custom styles can also be used in formatters for conditional cell styling: 
formatters:
  readonly:
    - expression: 'true'
      style: readOnlyStyle

​
Step 3: Style a Column Group Header

Column groups provide a second header row above individual columns. Configure group styling with groupStyle and headerStyle: 
columnGroups:
  requirements:
    groupName: System Requirements
    groupStyle: darkblue
    headerStyle: blue
    collapseTo: title
PropertyRequiredDescription
groupNameYesDisplay name in the group header row
groupStyleNoColor style for the group header band. Predefined name or custom style. Defaults to white.
headerStyleNoColor style applied to all sub-column headers in the group. Can be overridden per column with header.style.
collapseToNoColumn binding path to show when group is collapsed. Omit to disable collapse.
Assign columns to the group with the columnGroup property: 
columns:
  systemRequirements.systemRequirement.title:
    title: SR Title
    width: 200
    columnGroup: requirements
  systemRequirements.systemRequirement.severity:
    title: SR Severity
    width: 100
    columnGroup: requirements
Use YAML anchors to share header definitions across multiple columns:
columns:
  systemRequirements.systemRequirement.title:
    title: SR Title
    header: &sr_header
      style: blue
  systemRequirements.systemRequirement.severity:
    title: SR Severity
    header: *sr_header

​
Step 4: Use Color Tokens

Powersheet color tokens follow a numbering system from 100 (lightest) to 700 (darkest). Reference them in custom styles as color and backgroundColor values: 
styles:
  customHighlight:
    color: 'teal700'
    backgroundColor: 'teal100'
The exact rendering of custom styles may vary slightly. Preview your configuration in the sheet to confirm the visual result matches your expectations.

​
Step 5: Verify

Reload the powersheet document. You should now see the column headers and group headers rendered with the specified colors. Verify that:
  • Individual column headers show the correct style
  • Group headers span the correct columns with the specified groupStyle
  • The collapseTo toggle works if configured (click the collapse button in the group header)

​
See Also

KB ArticlesSource Code
  • prod-powersheet-src/com.nextedy.powersheet.client/cypress/fixtures/configurations/whole_rtm.template.yaml
  • prod-powersheet-src/com.nextedy.powersheet.client/cypress/fixtures/configurations/mip_undo_redo.template.yaml
  • prod-powersheet-src/com.nextedy.powersheet.client/ltc-repo/cypress/e2e/Sheet/column-groups.spec.ts
  • powersheet.yaml
  • prod-powersheet-src/com.nextedy.powersheet.client/ltc-repo/packages/sheet/commands/exportXlsx.tsx