File size: 990 Bytes
d71c768 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 |
---
title: "Styling Overlay"
groupTitle: "Examples"
sort: 8
---
import { CodeSample } from "../../components/CodeSample.tsx";
You can customize the overlay opacity and color using `overlayOpacity` and `overlayColor` options to change the look of the overlay.
## Overlay Color
Here are some driver.js examples with different overlay colors.
```js
import { driver } from "driver.js";
import "driver.js/dist/driver.css";
const driverObj = driver({
overlayColor: 'blue'
});
driverObj.highlight({
popover: {
title: 'Pass any RGB Color',
description: 'Here we have set the overlay color to be blue. You can pass any RGB color to overlayColor option.'
}
});
```
<CodeSample
buttonText={"Blue Color"}
config={{
overlayColor: 'blue'
}}
highlight={{
popover: {
title: 'Pass any RGB Color',
description: 'Here we have set the overlay color to be blue. You can pass any RGB color to overlayColor option.',
}
}}
id={"left-start"}
client:load
/> |