Search
Instant colour fill with HTML Canvas
Nice site with coloring images art and no ad's. Nice to just draw and color. https://www.kidzfun.art/ Demo is at https://shaneosullivan.github.io/example-canvas-fill/ , code is at..
Fancy Border Radius CSS Generator Tool - spin animation keyframes
Tool to generate custom border radius. you too can create blob like objects. How to use Just generate your border radius, and then copy the following code into a new or existing element. ..
Make your site look like windows 7
How can i make my website look like Windows 7? You can just add the Windows 7 CSS Framework to your site, and it will look like windows 7. Well almost like it, you will also have to add some custom c..
CSS Shake - Shake up your elements
CSS Shake is a CSS library that allows you to shake your elements using css classes. Install <link rel="stylesheet" type="text/css" href="https://csshake.surge.sh/csshake.min.css"> El..
NES-style(8bit-like) CSS Framework
Make your site look retro and 8 bit like an old NEW console with NES.css Installation Add the following script to your webpage to include the nes style sheet. <link href="https://unpkg.com..
Why to use a CSS Reset?
What is a CSS Reset? A CSS reset is a statements usually at the top of your style sheet, to reset all the browser defaults so that you can start with a fresh style sheet. Why do i need a CSS R..
Front-End Checklist
The Front-End Checklist is an exhaustive list of all elements you need to have / to test before launching your website / HTML page to production. If you want to check your project for the best practi..
WCAG Responsive Accessible Menu Dropdown Library
What is WCAG Responsive Accessible Menu? Here we have a javascript library with css and html that produces a responsive and mobile compatible dropdown navigation system. When the screen size goes int..
The New CSS Reset
What is The New CSS Reset? I remeber the time when i used to use something like this to reset the browser CSS to nothing and then start building my styles. CSS *,html,body { margin:0; padding:0; bo..
Add hovering text to your href links
What is it? Here we have a script that adds a Click Me Text above your links when they are hovered over or active. What can i use this for? Showing some additional information when your links..
Annotorious - JavaScript image annotation library
Have you ever wanted to add some comments on an image but dont want to have those comments or text items actually added to the image? Well this is where the library Annotorious comes in. What does An..
Lightbox for Bootstrap 5
A pure JavaScript Bootstrap 5 lightbox that supports images, galleries, YouTube, Vimeo, and Instagram—built around Bootstrap's Modal and Carousel plugins. Have you been using Lightbox for ..
Card Form Design, Very Slick and Rounded
A very cool looking form design here also using vue.js. As you type in the details the animated card fills in. Also as you select each element it will show you on the demo card which one is sel..
animated social links on mouse over
some nice looking pop over social links for the corner of your site
Animated Parallax 404 Error Page
Found this awesome animated 404 error page on codepen the other day, crazily awesome animations on this one, just reload the demo page and you can see the animation as it loads in as well.
Vanilla JS Center Mode Carousel
Here we have a sliding center mode carousel gallery made with css & vanilla js. This carousel is good if you need to keep your content up front and in the middle of the display. It can handle ima..