Hero banner with phone numbers


Research conducted by the Department of Communities and Justice shows users are in immediate need to see the department’s essential phone numbers when they visit the webpage, i.e. Victims Services.

DCJ User Experience Design Team developed a below Hero Banner combining the existing design and phone numbers to answer the need. The greater prominence given to the phone numbers is based on the users’ need to memorise/recognise/read phone numbers more easily in an emergency.

We appreciate your feedback and recommend adding the final design to the NSW Design System for more official use across the network.


Hi @Ashkan.deravi Happy New Year!

Thanks for sharing! These banners are great and really showcase the flexibility we want teams to explore. We’d be keen to add guidance/examples of this into the Design System.

UI wise we would look at keeping the highlight bar as brand accent (red 02 in this case) when on a light background to be consistent with the other uses of the highlight bar. Also the text on the left we would keep as text dark, as brand dark text (blue 01) is used to indicate a link.

We’d be very keen to include your research findings in the guidance if there is anything further you can share with us.

That looks great! I like that it saves space. Currently there are instances where you have a header and then call out box underneath with significant numbers.

Would the numbers be clickable? If yes they might need the underline treatment. Not sure if we have textlinks on brand dark backgrounds too?

Hi @Tee_tee01! Yes we do have link styles for dark backgrounds, they maintain the bold font and underline but would use Text Light (white) for their colour instead of Brand Dark (blue 01 for masterbrand).