The 1st half 2014 provides come and gone, this simply leaves a few brand-new pattern tendencies that can very likely arrived at define the season overall. Within these 2014 signatures variations, your climb in the so-called ‘Ghost Button’ is one that trapped a lot of eyes.

‘Ghost buttons’ are those transparent and empty buttons that have a basic shape form, such as a rectangular or perhaps squared. They are generally bordered by a very thin line, while the internal section consists of plain text printed in a light, sans-serif font.

These buttons, are also sometimes referred to as “empty” of “hollow” buttons, and tend to be bigger than standard colored buttons.

The attribute ‘ghost’ is due to the fact that, although they’re transparent as phantoms, they immediately grab the users’ gaze — almost in the way a ghost story can transfix your gaze.

Indeed a beautiful hollow button performs the neat magic trick of both merging itself seamlessly within a site, but, if set in a proper background and position, it can very successfully attract the users’ eyes.

Although you may find ghost buttons on a wide variety of websites, they aren’t made for all sites. They are best for websites and applications, that have a minimalist or flat user interface or those which use large-scale photo background.

Bootstrap was another important contributor to the trend. In August 2013, Bootstrap 3 was released and on its homepage a prototype of ghost button was used. Though not strictly transparent, it came with a monochromatic background and with very plain traits.

Since Bootstrap was recognized as an easy and fast way to develop a website, many people started using it and, as a consequence, more and more sites were created with a propensity towards flat design and minimal buttons.

Bootstrap’s naturally simple, one colour backgrounds left plenty of breathing space for the more striking transparency of the now famous ghost buttons.

They’re minimal, stylish, and with the subtle hover animation they’re a delight to use. Look for this trend to continue into 2015; especially considering how well they pair with the large background images.

About WD23

A digital web agency focused on UI/UX and strategic development.

Privacy Settings
We use cookies to enhance your experience while using our website. If you are using our Services via a browser you can restrict, block or remove cookies through your web browser settings. We also use content and scripts from third parties that may use tracking technologies. You can selectively provide your consent below to allow such third party embeds. For complete information about the cookies we use, data we collect and how we process them, please check our Privacy Policy
Consent to display content from - Youtube
Consent to display content from - Vimeo
Google Maps
Consent to display content from - Google
Consent to display content from - Spotify
Sound Cloud
Consent to display content from - Sound