Gradient text under text shadow

  • burnuser

    (@burnuser)


    1 month ago

    New “Gradient text” is a nice addition, but I found 2 problems in “Text (Adv)” block in it’s first release in Kadence Blocks 3.3.2:

    • If used in combination with text shadow, the shadow seems to be positioned above the gradient text (for example a black shadow makes the whole text black). Maybe a missing/wrong z-index?
    • After activation of gradient, the whole “Text (Adv)” block – respectively the text within – becomes invisible (maybe because of undefined text color). Only after changing the color of at least 1 control point, the gradient starts to work and the text becomes visible again.
Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Support karlalevelup

    (@karlalevelup)

    Hi there!

    Apologies for the delay in getting back to you.

    If you apply both a text gradient background and a text shadow, the text shadow will appear on top of the gradient.

    The gradient is applied as a background. It will show through the text itself (which is set as transparent); creating a visually appealing effect where the text color is filled with the gradient.

    I wouldn’t recommend using the 2 options simultaneously, but I’ll make sure to raise this use case to our team so we can check better. Please send me a screenshot of the layout you want to achieve.

    Regarding the text becoming invisible after turning the option on for the first time – I can confirm that it happened for me too. Let me check this further and I’ll let you know more details as soon as I can.

    Thread Starter burnuser

    (@burnuser)

    About layout with gradient and shadow:

    I have no screenshot, but imagine the effect of a (bright) yellow-green gradient with a contrasting black shadow (only blur) on a large Text.

    But anyway, I suggest I’m not the only one who tries sooner or later a combination of gradient and shadow to pep up a special word/text …

    Thread Starter burnuser

    (@burnuser)

    I found a solution for the Kadence Text Gradient – Shadow bug: Replacing Kadence blocks with other plugins like Spectra or Greenshift, I get a working combination of text gradient AND shadow!
    (Placing shadow above text gradient seems to be an exclusive Kadence bug.)

    So, if Kadence does not resolve this bug, I have a working solution for me and also all my clients.

    Plugin Support karlalevelup

    (@karlalevelup)

    Hi there!

    I want to send an update that the issue with text colors after turning the text gradient option on was fixed on Kadence Blocks 3.3.3.

    Also, the text gradient with shadow should now work. Here’s a screenshot of my implementation: https://share.zight.com/qGunQn9Q

    Let me know if I can help you further with this.

    Thread Starter burnuser

    (@burnuser)

    Thank You for the response.

    I made a new test with Kadence Blocks 3.3.6 (+ Theme “Twenty Twenty-Four” on WP 6.7)

    Result: Both problems unchangend and unresolved.

    Steps to reproduce:

    A) Initial colors / disappearing block on activation of Text Gradient:

    1. Add Text (Adv) block and some text within
    2. Change HTML-Tag (maybe from H2 to Paragraph) … seems to be a trigger
    3. Activate Text Gradient => block visually disappears until first color is manually set
      (Also changing the HTML-Tag after activation but before manual color setting makes the block disappear.)

    B) Shadow is displayed above Text Gradient

    1. Add Text Gradient
    2. Set colors manually (maybe bright red and blue)
    3. Activate Text Shadow
    4. Set Text Shadow to black (or any other very dark color) with no transparency
    5. Set X, Y, Blur to 0 => Only dark shadow is visible
Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.