---
title: ArticleDocument.componentStyles
framework: applenewsformat
role: symbol
role_heading: Object
path: applenewsformat/articledocument/componentstyles-data.dictionary
---

# ArticleDocument.componentStyles

An object containing component style objects that components in the article can refer to.

## Declaration

```data
object ArticleDocument.componentStyles
```

## Properties

Any Key: A component style, with a name you define that components within this document can refer to.

## Mentioned in

Enhancing Your Articles with Styles Defining a Component Style

## Discussion

Discussion ArticleDocument.componentStyles is an object containing the component style objects that components in your article can use. You provide each component style object as a key-value pair. In each pair, you create a key that’s meaningful to you. The value of each pair is a ComponentStyle object. Example {   "title": "Article Title",   "identifier": "sample",   "version": "1.8",   "language": "en",   "layout": {     "columns": 20,     "width": 1024,     "margin": 60,     "gutter": 20   },   "documentStyle": {     "backgroundColor": "#FFFFFF"   },   "components": [     {       "role": "section",       "style": "exampleStyle",       "components": [         {           "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.",           "layout": {             "margin": {               "top": 10,               "bottom": 10             }           }         }       ]     }   ],   "componentTextStyles": {},   "textStyles": {},   "componentStyles": {     "exampleStyle": {       "backgroundColor": "#FFFFFF",       "opacity": 1,       "border": {         "all": {           "width": 1,           "color": "black"         },         "left": false,         "right": false       }     }   },   "componentLayouts": {} }

## See Also

### Objects

- [ArticleDocument.componentLayouts](applenewsformat/articledocument/componentlayouts-data.dictionary.md)
- [ArticleDocument.componentTextStyles](applenewsformat/articledocument/componenttextstyles-data.dictionary.md)
- [ArticleDocument.textStyles](applenewsformat/articledocument/textstyles-data.dictionary.md)
- [ArticleDocument.colorScheme](applenewsformat/articledocument/colorscheme-data.dictionary.md)
