CSS Variable Picker feature will allow you to get a list of entire variables on the page and insert them with just one click. Besides the list, you will get a search field to narrow down your wish list quickly.
CSS Variable picker works with CSS and SCSS files regardless if you enable the option to create a file or not.
Enable CSS Variable picker.
This feature is enabled by default, and you don’t need to do anything under the settings.
![screenshot 2022 09 19 at 21.07.25](https://dplugins.com/wp-content/uploads/2022/09/Screenshot-2022-09-19-at-21.07.25-1024x258.png)
Still, to make it work you need to:
- Open the Preview
- Navigate to the page from where you want to pick up variables
- Press “Control + S”
- Reload the page.
After that, you can click in the top right corner and enable the least.
![screenshot 2022 09 19 at 21.07.52](https://dplugins.com/wp-content/uploads/2022/09/Screenshot-2022-09-19-at-21.07.52-1024x404.png)
Search field
This will give you the option to easily narrow your wish list. The list will automatically change as you type.
![screenshot 2022 09 19 at 21.08.32](https://dplugins.com/wp-content/uploads/2022/09/Screenshot-2022-09-19-at-21.08.32-1024x445.png)