This feature or setting is available to all customers on any Recurly Engage subscription plan.
Prerequisites & limitations
You must have Company , App Administrator , or App Member permissions in Recurly Engage.
Familiarity with CSS and your site’s stylesheet.
Custom styles are loaded after default Recurly Engage CSS. Please ensure your styles are specific enough to override the default style.
Prompt Styling refers to the customization of prompt elements—layout containers, text areas, buttons, and form controls—via CSS selectors.
Full branding control : Match prompts to your application’s design system.
Responsive tweaks : Adjust styles for desktop, mobile, and TV viewports.
Targeted overrides : Fine-tune individual prompt types without affecting others.
Use these core selectors to modify the default styling of any Redfast prompt.
Selector Description .rfmodal-content-wrapper
prompt area .rfmodal-inner-wrapper
prompt text content area .rfmodal-backgroundimage
prompt background image .rfmodal-header
prompt title .rfmodal-header-mobileweb
prompt title (mobile) .rfmodal-message
prompt message body .rfmodal-message-mobileweb
prompt message body (mobile) .rfmodal-button-yes
primary accept button .rfmodal-button-no
secondary button .rfmodal-footer
button area .rfmodal-close
dismiss button .rfmodal-close-icon
dismiss button icon .rf-radio-group
survey form options .rf-radio-item
survey form line item
Selector Description .rfmodal-content.outer-modal
modal .rfmodal-backgroundimage
background image or video for modal .rfmodal-wrapper.inner-modal
layout container
See Desktop Retention Message
Selector Description .mobileFrameDisplay
modal .mobileFrameInner
inner frame See close button interstitial only .rfmodal-backgroundimage
background image for modal .mobileWebModalWrapper
modal wrapper .mobilewebModalContentWrapper
content wrapper See close button everything, except interstitial .rfmodal-backgroundimage
background video for modal .videoPosterImgDefault
video poster See TOS terms of service link See Mobile header and body header and body containers See Input input fields container See Survey input survey options container See Mobile footer buttons and countdown wrapper
Selector Description .mweb-widget-container
modal .mweb-phone-kit-bg
inner frame .mweb-canvas-bound
inner frame .mweb-widget-wrapper
layout wrapper .rfmodal-backgroundimage
background image for modal .mobilewebModalContentWrapper
content wrapper See close button close button .mweb-widget-msg-container
message wrapper .mweb-widget-spacer
message spacer .mweb-widget-content-colm
message content .rfmodal-footer-mobileweb
buttons and countdown wrapper See Mobile footer buttons and countdown wrapper
Selector Description .modal-overlay-style.widget-rf-promo
modal .rf-widgetpromo-wrapper
inner frame .rfmodal-backgroundimage
background image for modal .rfmodal-wrapper
content wrapper See Desktop Retention Message
Selector Description .promo-text-wrapper
prompt text See close button .promo-text-wrapper-container
text container .promo-text-title
text title .promo-text-message
text message
Selector Description .promo-text-wrapper-mobile
prompt text See close button .promo-text-wrapper-container
text container .promo-text-title
text title .promo-text-message
text message
Selector Description .promo-tile-wrapper
prompt tile See close button .promo-tile-backgroundimage
background image .promo-tile-wrapper-container
alignment class .tile-header-msg-wrp
message wrapper Promo Content
Selector Description .rtile-mweb-content-wrapper
prompt tile .rtile-mweb-content
content wrapper .rfmodal-backgroundimage
background image .rtile-mweb-content-msg
message wrapper Promo Content
Selector Description .pr-email-logo
Logo .pr-email-wrapper
email content wrapper .pr-email-container
email content container .pr-email-image
email image .pr-email-msg
email message container .pr-email-msg-title
email message title .pr-email-msg-body
email message body .pr-email-btn
email buttons wrapper See Input See Buttons promo .pr-email-footer
email footer (links)
Selector Description .modal-overlay-style.banner-rf-promo
banner .rfmodal-content.rf-bannerpromo-wrapper
layout wrapper .rfmodal-backgroundimage
background image .rfmodal-wrapper
content wrapper See Desktop Retention Message
Selector Description .rfmodal-button-yes.primary-btn-p
primary confirm button .rfmodal-button-yes.secondary-btn-p
secondary confirm button .rfmodal-button-no
no button
Selector Description .promo-tile-wrapper-btn-accept
primary tile button .promo-tile-wrapper-btn-accept.btn-ac-2
secondary tile button .promo-tile-wrapper-btn-no
no button
Selector Description .survey-wrapper(.center-align-mode)
survey wrapper (alignment).survey-wrapper(.right-align-mode)
survey wrapper (alignment).rf-radio-group
radio buttons wrapper .rf-radio-item
radio item wrapper
Selector Description .rfmodal-input-wrapper
input container .rfmodal-input-label
label for input .rfmodal-input-inputfield
input field
Selector Description .rfmodal-close
modal close button #rfmodal-close-icon
modal close icon
Selector Description .modal-privacy-tos
TOS
Selector Description .rfmodal-header-mobileweb
content header .rfmodal-body-mobileweb
content body .rfmodal-message-mobileweb
content
Selector Description .rfmodal-footer-mobileweb
buttons and countdown wrapper .rfmodal-countdown
countdown label
Selector Description See close button .video-volume-control
volume button (video only) .rfmodal-inner-wrapper
content container .rfmodal-content-wrapper(.b-left-align)
alignment class (left) .rfmodal-content-wrapper(.b-right-align)
alignment class (right) .rfmodal-text-container
content container See TOS .rfmodal-header
content header .rfmodal-body
content body .rfmodal-message
content See Input See Survey input .rfmodal-footer
footer container .rf-button-wrapper
buttons and countdown wrapper .rf-buttons-inner
button wrapper .rfmodal-countdown
countdown label (desktop/mobile)
Selector Description .promo-tile-wrapper-header
message header .promo-tile-wrapper-body
message body .promo-tile-wrapper-footer
message footer .promo-tile-wrapper-btn
buttons wrapper See Input See Buttons promo
While Redfast works out of the box, your customer experience can be further improved. See the Fine Tuning guide for advanced positioning and performance optimizations.
Recurly Engage provides:
Live Tool and Live Preview for style testing.
Custom CSS overrides and HTML enhancements.
Direct support from the Recurly technical team.