Jump to content

Newsletter/Contact Form/Lock Screen CSS

Recommended Posts

Good afternoon from Australia everyone! 

Lovely to meet you all 🙂 I am building my website and everything is branded quite well except the newsletter, contact forms and lock screen. I have two main colors for the website (#003B6F for the background and #FFD046 for the text). I have attached some screenshots to show my issues.

With the newsletter block I just wanted to see if the placeholder text could be changed to #FFD046 if possible? 

With the contact form block I wanted to get rid of the white box and change the text font and then change the colour to #FFD046 is possible?

With the lock screen when I type the colour is correct (#FFD046), I was just wondering if I could change the placeholder 'password' to #FFD046 also?


Really appreciate your time, I've been playing around with some CSS from the forums but I cannot seem to get my head around the issues mentioned. Any help would be greatly appreciate, take care and all the best!



Contact Form Block.PNG

Newsletter Block.PNG

Lock Screen.PNG

Link to comment
  • Replies 1
  • Created
  • Last Reply

Difficult to help without link to newsletter, contact form block.


For other members

Add to Page Settings > Advanced > Header

HomePage Header

/* Subscribe */
/* Placeholder text */
.newsletter-form-field-element::placeholder {
    color: #FFD046 !important;


Contact Page Header

/* Contact Us */
.field-element:focus {
    background: transparent !important;
    color: #FFD046 !important;
.field-element {
    color: #ffd046 !important;

Add to Code Injection > Lock Screen

/* Lock Screen */
input::placeholder {
    color: #FFD046 !important;


Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment


This topic is now archived and is closed to further replies.

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.