Latest Posts

Create smooth looking pulse css animations for your website designs.

CSS pulse animation on hover

Apr 14, 2022

Create smooth looking pulse css animations for your website designs.

In this post, I will go through on how to create gradient animations for your web design using linear-gradient CSS function and keyframes

Creating gradient animation with CSS

Apr 12, 2022

In this post, I will go through on how to create gradient animations for your web design using linear-gradient CSS function and keyframes

The replaceWith function replaces a element with another. This post will go through basic and advanced examples of how to use the replaceWith function.

JavaScript replaceWith examples

Apr 10, 2022

The replaceWith function replaces a element with another. This post will go through basic and advanced examples of how to use the replaceWith function.

Today I learnt that you can specifify case-insensitivity with CSS attribute selectors with the `i` flag.

CSS case insensitive attribute selector

Apr 9, 2022

Today I learnt that you can specifify case-insensitivity with CSS attribute selectors with the `i` flag.

Checklist to fix CSS issues in IE11 (Internet Explorer 11) - using CSS Resets, polyfills, CSS media query hacks

How to fix CSS issues in IE11 (Internet Explorer 11)

Feb 23, 2022

Checklist to fix CSS issues in IE11 (Internet Explorer 11) - using CSS Resets, polyfills, CSS media query hacks

Having a fade in animation on your website seems to be the trendy thing happening around modern web designs. This article I will go through simple ways you can create CSS fade in animations, fade in and out, fade in from bottom, and fade in from top

How to Create CSS Animation Fade In with Examples

Feb 20, 2022

Having a fade in animation on your website seems to be the trendy thing happening around modern web designs. This article I will go through simple ways you can create CSS fade in animations, fade in and out, fade in from bottom, and fade in from top

We go through 5 examples of using flip animations with CSS. Flip animations is great for use on blogs where you want to have a preview card of the blog article. You can also use this for a photo gallery to show some interesting interactions for the user

5 Flip Animation CSS examples

Feb 14, 2022

We go through 5 examples of using flip animations with CSS. Flip animations is great for use on blogs where you want to have a preview card of the blog article. You can also use this for a photo gallery to show some interesting interactions for the user

In this series of blog posts I plan to flesh out a harvest moon game from scratch - using just simple HTML, CSS and some JavaScript. Will not be using any frameworks :)

How to create a Harvest Moon game with HTML - Part 1

Feb 7, 2022

In this series of blog posts I plan to flesh out a harvest moon game from scratch - using just simple HTML, CSS and some JavaScript. Will not be using any frameworks :)

The article will go over a few ways to center a button and common gotchas.

How to Center a Button with CSS

Jan 16, 2022

The article will go over a few ways to center a button and common gotchas.

Today I Learnt (TIL)- HTML mailto URLs can do much more than just adding a 'to' email address. You can link to multiple email addresses, add cc and even body text!

HTML mailto can have multiple addresses, subject and email body

Jan 6, 2022

Today I Learnt (TIL)- HTML mailto URLs can do much more than just adding a 'to' email address. You can link to multiple email addresses, add cc and even body text!

9 Examples of CSS rounded buttons

9 CSS Round Button Examples

Jan 5, 2022

9 Examples of CSS rounded buttons

Go through a few reasons why CSS reverse animations is not working with the animation-direction CSS property

CSS Animation Reverse not working?

Dec 22, 2021

Go through a few reasons why CSS reverse animations is not working with the animation-direction CSS property