---
title: "The appearance response object"
slug: "the-appearance-response-object"
abstract: "Describes the structure and properties of the appearance object in a Sitecore Discover Search and Recommendation response."
---
# The appearance response object

You get an `appearance` JSON object in the Sitecore Discover Search and Recommendation response if you send an [appearance object in the request](https://doc.sitecore.com/discover/en/developers/discover-developer-guide/integrate-using-discover-rest-apis/search-and-recommendation-data-model/response-structure-and-objects/the-appearance-request-object.md "The appearance request object"). The response returns the HTML, CSS, and JavaScript templates and variables associated with a widget on a page. By default, the response only returns `css_names` and `html_names`.

The following code shows the basic structure of the `appearance` object in a response:

```csharp
{
    "appearance": {
	"templates": {
            "<section>": {
		"devices": {
			"<device>": {
			"<content>": "string"
	    	}
	    }
	    },
	"variables": {
	    "<variable>": {
		"valueType": "string",
		"required": false,
		"expanded": false
	        }
	    }
	    },
	"css_names": ["string"],
	"html_names": ["string"]
    }
}
```

<details>
<summary><h2>Keys</h2></summary>

Depending on your request, you may see some or all keys.

The following table describes the keys in the `appearance` response object:

| Key | Type | Description |
| --- | --- | --- |
| `templates` | object | All sections for a specific device as indicated in your request. |
| `variables` | object | All variables defined in the widget's appearance style. |
| `css_names` | string | CSS class names that apply the appearance style to the widget. |
| `html_names` | string | HTML class names that apply the appearance style to the widget. |

</details>

<details>
<summary><h2>Examples</h2></summary>

The following code shows a sample request to get all HTML templates and variables for mobiles and tablets:

```csharp
{
    "appearance": {
	"templates": {},
	"variables": {}
    }
}
```

The following code shows the response to the above request. Along with `css_names` and `html_names`, you also see information about the templates for the devices and variables.

```csharp
{
    "appearance": {
	"css_names": [
        	"rfk2_seo",
		"rfk2_hs_home_seo"
	],
	"html_names": [
		"seo",
		"hs_home_seo"
	],
	"templates": {
		"html": {
		    "devices": {
		        "mobile": {
			    "content": "<title>Reflektion</title><meta content=\"Reflektion Demo\" name=\"description\"><meta content=\"{{$keywords}}\" name=\"keywords\">\n"
			},
			"tablet": {
			    "content": "<title>Reflektion</title><meta content=\"Reflektion Demo\" name=\"description\"><meta content=\"{{$keywords}}\" name=\"keywords\">\n"
			}
		    }
		}
        },
	"variables": {
		"keywords": {
	            "valueType": "paragraph",
		    "required": false,
		    "expanded": false
		},
		"description": {
		    "valueType": "paragraph",
		    "required": false,
		    "expanded": true,
		    "value": "Reflektion Demo"
		},
		"title": {
		    "valueType": "string",
		    "required": false,
		    "expanded": true,
		    "value": "Reflektion"
		}
	}
    }
}
```

</details>