Free Color Palette for Your Spring Projects

Got the winter blues? Feeling uninspired? Or just looking for a fun, bright color palette to add some life to your projects? We’ve put together a free, trendy color scheme for you to use in any of your upcoming projects. Check it out below:

springcolors

Featuring a subdued pink, a neutral creme, a bright green, a soft lilac, and an electric yellow/green, this palette has something for every kind of project. Working on something fun and exciting? Try mixing the green, creme, and yellow. If your current project requires a palette that’s a little more subtle, the pink and creme, pink and purple, or some combo of the three will work for you.

However you mix and match them, all combos of these colors look great together and will add a fresh, springy look to any of your sites. If you want to use them in any upcoming projects, see below for the hex and RGB codes.

  • Pink: #ffc0cb // rgb(255, 192, 203);
  • Creme: #fff4e6 // rgb(255, 244, 230);
  • Green: #30f2c6 // rgb(48, 242, 198);
  • Lilac: #ebd8f9 // rgb(235, 216, 249);
  • Yellow: eff066 // rgb(230, 240, 102);

Remember, to use rgba instead of rgb, just add a fourth value within the parentheses at the end of the rgb numbers, and remember to write rgba instead of rgb. The value should be between 0 and 1 depending on how opaque you want the color to be — 1 for completely opaque, 0 for completely transparent.

6 Cool Ways to Use Shadows in CSS

Screen Shot 2017-02-21 at 10.56.31 AM

CSS’s box-shadow and text-shadow properties are incredibly versatile, allowing you not just to add shadows to various elements and text, but also making it possible to create cool, multi-dimensional effects for your projects. If you’re looking for inspiration on new ways to use shadows in your sites, check out this list of some of the […]

Read on...

CSS Snippets: Retro Text Effect

Screen Shot 2017-02-14 at 12.02.06 PM

One of our favorite ways to play around with CSS is to apply cool effects to text. Text-shadows are a great, versatile tool to employ if you’re looking to apply cool effects to text, as you’ll see in the following snippet. Using CSS text-shadows, it’s easy to create a retro text effect that’s reminiscent of […]

Read on...

CSS Shapes: How to Make a Heart

Screen Shot 2017-02-14 at 11.22.31 AM

With Valentine’s Day season upon us, you might find yourself wanting to add some seasonal flair to your websites or projects. An easy way to do this is by adding heart shapes to your pages. You can do this by using a heart graphic or by using CSS to style a div element to look […]

Read on...

6 Coolest CSS Snippets for Valentine’s Day

Screen Shot 2017-02-08 at 11.07.09 AM

Whether you love it or you hate it, it can’t be denied that Valentine’s Day is fast approaching. If you’re feeling festive, you might be thinking about adding some Valentine’s-inspired flair to your websites or projects. Take a look at the following list of our favorite Valentine’s Day code snippets to gather inspiration for your own creations […]

Read on...

How to Style Links According to Link Type

Using CSS, it’s pretty easy to style a whole bunch of different elements of the same element type in different ways by assigning them different classes. However, if you want to get technical, this can also be achieved by using attribute selectors. Attribute selectors are used in CSS to select different HTML elements to style based […]

Read on...

The 4 Best Responsive HTML5 Frameworks

Screen Shot 2017-01-29 at 9.41.11 AM

Don’t feel like creating a website from scratch for your next project? Check out any of these responsive HTML5 frameworks that’ll help you get going quickly and easily. 1. Bootstrap Bootstrap is a really popular framework brought to us by the people over at Twitter. It’s fully responsive and mobile friendly, uses two CSS preprocessors […]

Read on...

CSS Burning Text Effect

Here’s a fun little CSS snippet that allows you to create text that looks like it’s on FIRE. It’s achieved using text-shadow and is a super easy effect to add to any of your projects. First you’ll need some HTML: <div id=“fire”>FIRE</div> That’s the easy part. Now for the CSS. Here’s what your styling should […]

Read on...

6 Cool CSS Button Snippets

Screen Shot 2017-01-23 at 11.27.20 AM

When it comes to styling buttons, the possibilities are endless. Check out some of these snippets and tutorials to get some ideas for your next button creations! 1. Flat UI Buttons  These colorful buttons have a flat design, hover effects, and push transitions. 2. Minimalist Hover Effect Buttons The button designs from this tutorial are […]

Read on...

CSS’s Word-Wrap Property

Screen Shot 2017-01-23 at 11.23.49 AM

CSS’s word-wrap property can be used to break a really long word so that it continues on the next line rather than having the word extend beyond its potential boundaries so that it all stays on one line. Let’s say you had a really long word that was taking up way too much space, like […]

Read on...