---
title: ConditionalDocumentStyle
framework: applenewsformat
role: symbol
role_heading: Object
path: applenewsformat/conditionaldocumentstyle
---

# ConditionalDocumentStyle

The object for defining conditional properties for a document style, and when the conditional properties are in effect.

## Declaration

```data
object ConditionalDocumentStyle
```

## Properties

conditions: An instance or array of conditions that, when met, cause the conditional document style properties to take effect. backgroundColor: The document’s background color. The value defaults to white.

## Mentioned in

Supporting Dark Mode for Your Article

## Discussion

Discussion Use the ConditionalDocumentStyle object to define an array of conditional document-style properties and the conditions under which to apply them. When a condition is met, the value of a property in ConditionalDocumentStyle overrides the value of the same property if defined in the parent DocumentStyle object. See DocumentStyle. Example {   "documentStyle": {     "backgroundColor": "#FFF",     "conditional": [       {         "backgroundColor": "#000",         "conditions": [           {             "preferredColorScheme": "dark"           }         ]       }     ]   },   "components": [     {       "role": "title",       "text": "Apple News Format"     },     {       "role": "body",       "text": "Apple News Format allows publishers to craft beautiful editorial layouts. Galleries, audio, video, and fun interactions like animation make stories spring to life."     },     {       "role": "photo",       "URL": "bundle://image.jpg"     }   ] }

## Relationships

### Inherits From

- [DocumentStyle](applenewsformat/documentstyle.md)

## See Also

### Conditional Design Elements

- [Condition](applenewsformat/condition.md)
- [ConditionalComponent](applenewsformat/conditionalcomponent.md)
- [ConditionalComponentLayout](applenewsformat/conditionalcomponentlayout.md)
- [ConditionalAutoPlacement](applenewsformat/conditionalautoplacement.md)
- [ConditionalSection](applenewsformat/conditionalsection.md)
- [ConditionalText](applenewsformat/conditionaltext.md)
- [ConditionalTextStyle](applenewsformat/conditionaltextstyle.md)
- [ConditionalComponentTextStyle](applenewsformat/conditionalcomponenttextstyle.md)
- [ConditionalComponentStyle](applenewsformat/conditionalcomponentstyle.md)
- [ConditionalContainer](applenewsformat/conditionalcontainer.md)
- [ConditionalDivider](applenewsformat/conditionaldivider.md)
- [ConditionalButton](applenewsformat/conditionalbutton.md)