# Put dark blur or outline behind hero text? **URL:** \ **Category:** Beginners\ **Created:** [February 20, 2022, 2:25pm UTC](https://forum.pinegrow.com/t/put-dark-blur-or-outline-behind-hero-text/6302 "2022-02-20T14:25:38Z")\ **Posts on this page:** 10\ **Page:** 1
**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\ **Post date:** [February 20, 2022, 2:25pm UTC](https://forum.pinegrow.com/t/put-dark-blur-or-outline-behind-hero-text/6302/1 "2022-02-20T14:25:38Z")
1. Anyway to put a small dark blur behind BBQ SMOKES? 2. Anyway do a black outline around BBQ SMOKES? 3. How to get PG to see VSC changes when they are connected? Now I have to close PG then reopen. Hitting refresh doesn’t work. ```auto

BBQ

Smokes

``` ```auto .sub-headline { font-size: 10.5rem; font-family: var(--secondary-font); color: gold; font-weight: 100; line-height: .4; letter-spacing: 2px; ``` ```auto .headline { color: #fff; font-size: 4.7rem; font-family: var(--main-font); text-transform: uppercase; font-weight: 900; letter-spacing: .5rem; margin-right: -.5rem; } ``` ![Screen Shot 2022-02-20 at 6.13.53 AM](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/9/98affd36f36fdb5ed8117bf8760ab6368f790524.png) ---
**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\ **Post date:** [February 20, 2022, 2:46pm UTC](https://forum.pinegrow.com/t/put-dark-blur-or-outline-behind-hero-text/6302/2 "2022-02-20T14:46:15Z")
Hi @kat, When you open your project in VSC, does it pop-up a message that it is connected to Pinegrow? Cheers, Bob ---
**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\ **Post date:** [February 20, 2022, 5:16pm UTC](https://forum.pinegrow.com/t/put-dark-blur-or-outline-behind-hero-text/6302/3 "2022-02-20T17:16:39Z")
Yes I get the VSC pop-up when connected or disconnected to PG. ---
**Author:** ![RobM](https://avatars.discourse-cdn.com/v4/letter/r/278dde/32.png) [@RobM](https://forum.pinegrow.com/u/RobM)\ **Post date:** [February 20, 2022, 7:12pm UTC](https://forum.pinegrow.com/t/put-dark-blur-or-outline-behind-hero-text/6302/4 "2022-02-20T19:12:56Z")
Hmmm… not sure what to think. If they are connected, you shouldn’t need a refresh. I just checked out a project of my own and changes in either are updated. Anything else running that might be blocking the port? ---
**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\ **Post date:** [February 20, 2022, 7:19pm UTC](https://forum.pinegrow.com/t/put-dark-blur-or-outline-behind-hero-text/6302/5 "2022-02-20T19:19:44Z")
I’ve learned out of work around PG quirks. Just thought I might have missed something. Thanks > [@kat](#): > > - Anyway to put a small dark blur behind BBQ SMOKES? > - Anyway do a black outline around BBQ SMOKES? ---
**Author:** ![Piro](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/piro/32/39_2.png) [@Piro](https://forum.pinegrow.com/u/Piro)\ **Post date:** [February 22, 2022, 7:18pm UTC](https://forum.pinegrow.com/t/put-dark-blur-or-outline-behind-hero-text/6302/6 "2022-02-22T19:18:00Z")
/\* Add the blur effect \*/ filter: blur(8px); -webkit-filter: blur(8px); /\* Add the outline effect \*/ -webkit-text-stroke: 1px black; Pieter (Golive) 😉 ---
**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\ **Post date:** [February 22, 2022, 10:53pm UTC](https://forum.pinegrow.com/t/put-dark-blur-or-outline-behind-hero-text/6302/7 "2022-02-22T22:53:10Z")
This really helps, Pieter, my Golive buddy. You’re the one who referred me to Pinegrow 🙂 Outline and shadow work. Unfortunately blur effect blurs the text. ![Screen Shot 2022-02-22 at 2.40.35 PM](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/3/3c040716d5750028d4b7cbf594cd926154b255f7.png) image is your 1 px outline with `text-shadow: 4px 4px 2px rgba(0,0,0,0.6);` How do I get a shadow all the way around the text? > [@Piro](#): > > /\* Add the blur effect \*/ > filter: blur(8px); > -webkit-filter: blur(8px); > > /\* Add the outline effect \*/ > -webkit-text-stroke: 1px black; ---
**Author:** ![fakesamgregory](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/fakesamgregory/32/3903_2.png) [@fakesamgregory](https://forum.pinegrow.com/u/fakesamgregory)\ **Post date:** [February 23, 2022, 10:56am UTC](https://forum.pinegrow.com/t/put-dark-blur-or-outline-behind-hero-text/6302/8 "2022-02-23T10:56:59Z")
@kat use `backdrop-filter: blur(5px)` > **[backdrop-filter - CSS: Cascading Style Sheets | MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter)** > > The backdrop-filter CSS property lets you apply graphical effects such as blurring or color shifting to the area behind an element. Because it applies to everything behind the element, to see the effect you must make the element or its background at... ---
**Author:** ![Piro](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/piro/32/39_2.png) [@Piro](https://forum.pinegrow.com/u/Piro)\ **Post date:** [February 23, 2022, 5:06pm UTC](https://forum.pinegrow.com/t/put-dark-blur-or-outline-behind-hero-text/6302/9 "2022-02-23T17:06:37Z")
You can combine multiple text shadows in PG like this: h1 { text-shadow: 1px 1px 5px black , -1px -1px 5px black; } ---
**Author:** ![kat](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/kat/32/2221_2.png) [@kat](https://forum.pinegrow.com/u/kat)\ **Post date:** [February 24, 2022, 1:42am UTC](https://forum.pinegrow.com/t/put-dark-blur-or-outline-behind-hero-text/6302/10 "2022-02-24T01:42:26Z")
`text-shadow: 1px 1px 5px black , -1px -1px 5px black;` Lovely @Piro !!! Not sure why but I couldn’t make the backdrop-filter work. More reading required; thanks @fakesamgregory