---
id: 5a9d726c424fe3d0e10cad11
title: Create a custom CSS Variable
challengeType: 0
videoUrl: 'https://scrimba.com/c/cQd27Hr'
---
## Description
To create a CSS Variable, you just need to give it a name
with two dashes
in front of it and assign it a value
like this:
--penguin-skin: gray;
This will create a variable named --penguin-skin
and assign it the value of gray
.
Now you can use that variable elsewhere in your CSS to change the value of other elements to gray.
## Instructions
In the penguin
class, create a variable name --penguin-skin
and give it a value of gray
## Tests
```yml
tests:
- text: penguin
class should declare the --penguin-skin
variable and assign it to gray
.
testString: assert(code.match(/.penguin\s*?{[\s\S]*--penguin-skin\s*?:\s*?gray\s*?;[\s\S]*}/gi), 'penguin
class should declare the --penguin-skin
variable and assign it to gray
.');
```
## Challenge Seed
## Solution
```js
var code = ".penguin {--penguin-skin: gray;}"
```