Hello @Touseef Ahmed ,

Unfortunately, expressions don't support direct in-line styling. You'll need to use a separate expression widget for each part that requires different styling. 

For your case:

Expression 1: Your time starts from now :

Expression 2: 03-03-2025 01:04:200 

Expression 3: and time ends here.

Apply the styles you want for each.

Hello, You can modify the text you have in expression is such a way that your time will be bind in a separate expression and rest of the sentence in other expressions.
you can now apply the desired css to your expression.

Thanks
Tousif Khan

you can divide text and expression and then implement css.

https://personal-u1aragiz.outsystemscloud.com/ExpressionDemo/Demo?_ts=638766085415955670

Hello.

CSS:

Pure CSS cannot directly target and style specific words inside a text node without wrapping them in an element.

You can do sequential elements (<span> for instance) and with a class paint some of them. Or even use nth-child to simplify the code visually.

The closest solution to what you are asking, is if that expressions goes into HTML Element widget. But the solutions provided above by others are quite standard.

JS:

This will work if you know the position. For your example, it is word 6 and 7, so positions 5 and 6 of the array:

document.addEventListener("DOMContentLoaded", function () {
    let paragraph = document.getElementById("someText");
    let words = paragraph.innerHTML.split(" "); // Split text into words

    if (words.length > 7) {
        words[5] = `<span class="highlight">${words[5]}</span>`; // Wrap the second word
        words[6] = `<span class="highlight">${words[6]}</span>`; // Wrap the second word
        paragraph.innerHTML = words.join(" "); // Rejoin the text with the span
    }
});

But if you are translating, the number of words may vary. So, we  should go with RegEx:

document.addEventListener("DOMContentLoaded", function () {
    let paragraph = document.getElementById("someText");
    let text = paragraph.innerHTML;

    // Regular expression to match date and time
    let dateTimeRegex = /\b\d{1,2}[-\/]\d{1,2}[-\/]\d{2,4}\s\d{1,2}[:]\d{1,2}[:]\d{1,3}\b/g;
    // Replace the patterns with highlighted span
    paragraph.innerHTML = text.replace(dateTimeRegex, match => `<span class="highlight">${match}</span>`);
});

Notice that for some reason you have 3 digits for seconds so I changed the regex to {1,3} when it should be again [1,2}.

Hi @Touseef Ahmed ,

can you pls refer the below attached oml, If it helps.

hi Touseef,

you can use the label and inside it you can use different text or expression and design them as per your needs by giving the style classes.

hope it helps.

Hi @Touseef Ahmed ,

Thanks,
Sahana