The Site Slinger Blog

Web Development, Design, and everything PSD to HTML
By Jeremy H.

30 Brand New PixelsDaily PSD & CSS Design Freebies

 

featured-pixelsdaily-screenshot-image-freebies

Loads of new freebies and open source codes are placed online every day. Web & mobile designers can learn a lot by studying newer interface trends and design layouts. PixelsDaily is one such website which publishes freebies and premium content. This is an excellent resource for designers who want to dig a bit deeper into constructing usable layouts for the web.

In this roundup I have put together 30 of the latest freebies from PixelsDaily. You will find both PSDs and HTML/CSS codes mixed in with each other. Some freebies actually offer both graphics and the code together! But no matter what items you’re looking for, this showcase is bound to have something cool.

 

Google Maps Markers (PSD)

These varied Google Map Makers are a fantastic set of resources to have in your design collection. They represent different things — a restaurant, telephone, gas, airport, rail station, and mechanic. It’s simple to implement these into an embedded Google Map!

photoshop freebie psd download googlemaps

Custom Slideshow (PSD + CSS)

This custom slideshow is provided both as a PSD, or fully coded in CSS and HTML. It’s wrapped up in a delightfully simple design, with subtle shadows, borders, and textures. It’s simple to make a few tweaks to add your own images, captions, and information. Enjoy!

freebie jquery slideshow html css webdesign download

Info Widget (PSD)

This is a tidy little information widget for a blog post, containing the title, author information, comments, and likes. Presented as a well organised PSD file to integrate into your own designs!

psd freebie information widget website

Sticky Note Paper (PSD)

A “Sticky Notepaper” — a piece of paper with lined paper, a download button, and some sticky tape that wraps it all together! Really simple, but a useful starting point for your own note-style interface.

sticky notepad paper designs psd freebie

Windows 8 Metro Buttons (CSS)

A selection of Metro style, Windows 8 buttons and icons. All coded using HTML and CSS, so they’re incredibly easy to drop into your own design, customise colours, and so on. Add a little simplistic metro style to your next interface!

css3 html windows win8 buttons

Notification Centre UI (PSD + CSS)

A versatile PSD of a notification style interface. It includes a drop-down list of recent notifications/messages, a login/connect window, and pop-out messages with more information as well. Packed with potential functionality for your next app, and we’ve also added a fully coded CSS/HTML version. Enjoy!

notification center user interface webdesign psd freebie

Timer Interface (PSD)

A stylish countdown/stopwatch/timer interface, with play/stop/restart buttons, countdown digits, the current time, and some simple OS X chrome.

stopwatch timer psd freebie ui interface

Yellow Subscribe Box (PSD)

A stylish subscription box, giving your readers the information they need to subscribe to your site. It contains two options — one for an email newsletter subscription, and another for RSS. The base colour is yellow, but it’s easy to tweak to fit in with your own design.

yellow email subscription box freebie download

Spotify Mini Player (PSD)

A stylish mini-player interface for Spotify. It contains a track listing, simple play/volume controls, and a full-screen graphic. The perfect way to get started with a media player, whether for Spotify, or any other third party service!

green user interface mini music player freebie

Confirmation Dialog (PSD)

A beautiful confirmation dialog box with a subtle set of gradients and textures, a header, close button, two different button styles, and some explanatory text. A really gorgeous interface on which to build upon!

freebie windows modal box popup psd freebie website

Newsletter Signup Form (PSD)

A detailed newsletter sign-up form PSD, including a description of the mailing list, fields for name and email address, an anti-spam message, and a prominent “Join” button. Enjoy!

signup popover window modal design freebie download

Metro Twitter Feed

Microsoft have been doing a wonderful job with their simplistic “Metro” style, and today we’re presenting a lovely Metro-style twitter feed. Containing various states for different tweets, links, and timing. A really wonderful little widget!

windows metro twitter ui interface design

Pro Admin Interface (PSD + CSS)

There’s something about this one that we really love! It’s the top part of a simple administration interface design, with various navigation options / notifications, and a content box. As well as providing you with the original PSD, we’ve also gone to the trouble of coding it all up in CSS and HTML for you. Enjoy!

freebie html css admin toolbar ui layout template

Blur Login Form (PSD)

Login forms can be tricky. They need to be simple, convey the basic information, and exude a little style. This one presses all the right buttons, with some beautiful interface styling and typography. Enjoy!

blog login psd freebie form download

PixelsDaily iPhone App Interface (PSD + CSS)

We thought it’d be fun to create a funky app interface for PixelsDaily, then give it away free for you to use! Provided both as a fully coded HTML/CSS version, and a PSD. It has some uniquely created iOS interface elements, an author area, and a set of resource thumbnails.

custom iphone ios ui interface design freebie download

Trendy Nav Bar

A stylish navigation bar, provided as a PSD. It comes in four different colours, and might just be the perfect addition to the top of your next web design project!

trendy navigation bar interface psd freebie

Settings Panel (PSD + CSS)

We’re really pleased with this one. It’s a settings panel with brushed metal interface elements / toggle switches. Not only is this provided in the usual PSD format, but we’ve gone ahead and coded it up as a fully functional HTML/CSS version for you!

freebie download psd website ui interface html

Tiny Note (PSD)

Just a quick note about this one. It’s a note. A beautiful, pixel-perfect note. On a subtle background, it’s a paper “stack” with close/minimize icons, a link to read more, and some lovely typography. Hope you find it useful!

tiny note freebie psd download pixelsdaily

vCard Minisite (PSD + CSS)

This is a beautiful minisite vCard in PSD format. It contains elements for your social media profiles, an avatar, a small bio, and a “folded corner” for someone to download a copy of your vCard. If you want to put up a vCard website, this is the perfect way to do so! We have also included a fully coded CSS and HTML version, complete with an animated corner roll-over. Enjoy!

vcard freebie website ui layout download css html psd

Design Agency Layout (PSD)

A fully-loaded PSD file, this graphic contains a sleek and professional layout for a design agency or portfolio. It has plenty of room for your logo, navigation, an introductory text area / video, and a set of different “services” that you might offer. It’s really simple to customise for your own needs!

freebie download psd pixels website agency layout

PHP Metro Generator Webapp (CSS/PHP)

Something a little different today, this is a PHP application that helps you generate unique metro-style interfaces with ease. Just drop it onto your server and experiment away! You’ll need to upload this to a web server to run the script and see how it works.

metro user interface layout webapp php testing

Stylish Ribbon (PSD)

Four(4) colourful ribbons with a 3D look and feel, stiched outer pattern, and a top shadow to create the effect of the ribbon dropping over its’ container. Have fun integrating it into your own design!

psd freebie download pixelsdaily website

Credit Card Form (PSD + CSS)

This is an incredibly handy credit card information form, containing fields for your card number, type, expiry date, and CVV number. It’s simple enough to incorporate into any design, and is provided both as a PSD and fully coded as a CSS/HTML design. Enjoy!

credit card ui interface form website freebie download

Various Alert Boxes (PSD + CSS)

Three different alert box styles are included in this PSD — A green “success” alert, a yellow “alert” … alert, and a red “error” alert! We’ve also built one of these into CSS and HTML for you, just to save you a little time!

alert boxes website interface css freebie download

Delicious Notepad & Ribbon (PSD)

A simple notepad freebie with a classic striped/leather look-and-feel, and a red ribbon flourish of detail. Provided as a well-organized PSD file for you to incorporate into your own designs!

notepad psd freebie download website graphics

Notepad Interface (PSD)

We’ve created a pixel-perfect notepad interface, straight out of a cutting-edge Mac app! A wonderful basis on which to build your own application interface.

freebie website notepad interface psd download

Animated Buttons (CSS)

This one is just beautiful. Two examples of a gorgeous animated button — both have subtle animations in the background, and plenty of excitement when you hover over them! The “Favorite” icon takes on the form of a beating heart, with the the download flying out, then back again. You’ll have to download the freebie to see them for yourself – don’t just take our word for it!

pure css animated buttons website freebie download

Ripped Tasks List (PSD)

A “ripped” skeumorphic to-do list with a paper effect, check-boxes for completed tasks, delete icons, and a button to add a new task. Take it, build upon it, and enjoy! Provided as a simple layered PSD file.

todo list website interface papers freebie psd download

Clock iOS App Icon (PSD)

A delightful wrist watch/clock icon, designed for an iOS app. It is provided in a range of different sizes suitable for each different iOS device, and we’d love for you to use the end result however you’d like!

freebie psd wristwatch app icon mobile retina display

Paper Stack (PSD)

A beautiful paper stack, complete with a quotation, avatar, stylish pin, and a subtle textured background. It’s a delightful piece of interface design work, and we hope you enjoy it!

pinned paper stack pin icons design

Conclusion

Many of these elements are great for building complex layouts and applications. Mobile designers will especially enjoy some of the aesthetic pieces such as buttons and notepads. But in my opinion this set of freebies offers a powerful start to the new year. Be sure and keep updated for new releases over the course of 2013.

All you need is design to get started! get a free quote Check out our pricing