RealMe page elements

The RealMe elements are intended to be flexible enough to be consistent with your website look and feel, but also identifiable to users as a common means of logging in and proving identity information online.

The standard light blue colour is recommended, but if this does not suit the webpage design, there are  alternative dark or light designs. 

This is the preferred design, as it answers customers' commonly asked questions about the use of the RealMe login service.

Primary login button element - standard colour

The login box is designed to be 250px to 350px wide. It is fluid, so more or less text can be added to the <p> tag if the text needs to be changed.

The What's RealMe? hover element is available in four width options: 420px, 550px, 300px, 200px, depending on the orientation (top left, top right, left and right) with height scaling to match.

 


Login component for header - standard colour

When the RealMe login function is available on multiple webpages, this webpage header design can also be used.

This component has the same functionality as the primary design, with the question mark triggering the What's RealMe hover text.


Login secondary component - standard colour

 Under special circumstances, the use this smaller secondary design may be acceptable. It is designed to be 125px to 250px wide.


 

 

Download this bundle [ZIP, 54 KB] that contains html, css and images and choose the standard or alternative colours. 

 

The standard light blue colour is recommended, but if this does not suit the webpage design, this is the alternative dark design

This is the preferred design, as it answers customers' commonly asked questions about the use of the RealMe login service.

Primary login button element - dark colour

The login box is designed to be 250px to 350px wide. It is fluid, so more or less text can be added to the <p> tag if the text needs to be changed.

The What's RealMe? hover element is available in four width options: 420px, 550px, 300px, 200px, depending on the orientation (top left, top right, left and right) with height scaling to match.

 


Login component for header - darkcolour

When the RealMe login function is available on multiple webpages, this webpage header design can also be used.

This component has the same functionality as the primary design, with the question mark triggering the What's RealMe hover text.


Login secondary component - dark colour

 Under special circumstances, the use this smaller secondary design may be acceptable. It is designed to be 125px to 250px wide.


 

The standard light blue colour is recommended, but if this does not suit the webpage design, this is the alternative light design. 

This is the preferred design, as it answers customers' commonly asked questions about the use of the RealMe login service.

Primary login button element - light colour

The login box is designed to be 250px to 350px wide. It is fluid, so more or less text can be added to the <p> tag if the text needs to be changed.

The What's RealMe? hover element is available in four width options: 420px, 550px, 300px, 200px, depending on the orientation (top left, top right, left and right) with height scaling to match.

 


Login component for header - light colour

When the RealMe login function is available on multiple webpages, this webpage header design can also be used.

This component has the same functionality as the primary design, with the question mark triggering the What's RealMe hover text.


Login secondary component - light colour

 Under special circumstances, the use this smaller secondary design may be acceptable. It is designed to be 125px to 250px wide.


 

 

The standard light blue colour is recommended, but if this does not suit the webpage design, there are alternative dark or light designs.

Primary assert button element - standard colour

This example illustrates wording that applies to the assertion of verified identity. The wording can be modified for other attributes such as verified address.

 

 

 

 Download this bundle [ZIP, 56 KB] that contains html, css and images and choose the standard or alternative colours. 

The standard light blue colour is recommended, but if this does not suit the webpage design, this is the alternative dark design.

Primary assert button element - dark colour

This example illustrates wording that applies to the assertion of verified identity. The wording can be modified for other attributes such as verified address.

 

 

The standard light blue colour is recommended, but if this does not suit the webpage design, this is the alternative light design.

Primary assert button element - light colour

This example illustrates wording that applies to the assertion of verified identity. The wording can be modified for other attributes such as verified address.

 

 

Subscribe