iphone-X-app-psd-and-sketch-mockups

20+ iPhone Mockups For All iPhone Models Till Date

For the past few years, the iPhone design remains the same. Last year we got the new all edge to edge screen design with a notch. Now we have the plus size phones as well, so technically there are four types of iPhone designs. In this list of iPhone mockups, we have managed to collect the mockup of all the designs.

With the introduction of cheaper iPhone XR, it is clear that the notch screen design is going to be the design standard for the next few years. But still, there are millions of customers who are comfortable in owning the big chin previous generation phones. If you are an app developer, you have to consider both types of audience. In this list, we have included iPhone mockups for all the famous sizes so that you can showcase your designs elegantly.

Read More

iMac-pro-iMac-stylized-iMac-mockup

21 Must-Have iMac Mockups For Designers 2019

There is nothing like having a 5k iMac screen on your desk. The all in one design makes your desk clutter free from the wires and gives you plenty of desk space. Engineers at Apple has made the machine minimal and it gives an artistic touch to your workspace. In this list, we have collected some of the best iMac Mockups to reduce your presentation and design showcase work.

As of now, in every Apple product lineup, consumers most favorite color is the space grey. With the iMac Pro, we get the space grey color, but the regular iMacs still have the aluminum look. In this list, we have also included the iMac Pro mockup for those who love the space grey color. The razor-sharp edges with the wedge-shaped design give a powerful machine in an elegant form factor. When it comes to the screen, there is nothing like the iMac’s 5K retina display. Colors and the details can be seen clearly on the screen. The iMac mockups on this list show the screen clearly and your content can also be seen neatly. All you have to do is to add your contents and showcase your inspiring designs with your audience.

Read More

Line Drawing Animejs

20 Amazing Ways You Can Implement Anime.JS Animations On Your Website

Anime.js is a lightweight JavaScript animation library which features multi-target, simple and powerful API. It works with almost anything including CSS properties, SVG or DOM properties and even other JS objects. It is similar to jQuery or any other familiar JS library that you might have worked with previously. In simple terms, it makes complex follow through and animations extremely easy to come up with. If you are looking for a library small in size yet works with even the simplest timeline sequences, and other web elements, then this is surely the ideal place to get started. Thus, the implementation of anime.JS has surged over the past years. And since, its first release on June 27, 2016, it sure has made a huge impact on designers and developers all over.

So today at uiCookies, we wanted to take a look into the anime.JS and their usage even further. From simple animated texts to sliders, loaders, spinners, and even design element, we have made a list of the best anime.js examples that you can get a closer look at. Each of these examples includes a preview and a link to their coding snippet. So why start from scratch when you can get a head start with all of these fantastic options online? And if you still decide to get started on a blank slate, these can provide you some ideas and structures that might come in handy.

Read More

macbook-pro-isometric-mockup

20 MacBook Mockups To Elegantly Present Your Designs In 2019

Apple has a wide range of MacBooks that fit the needs and budgets of all people. Currently, we have the new MacBook Air with retina display, old MacBook Air, MacBook, and MacBook Pros with touch bar and without touch bar. If you are looking for high-quality mockups for all these MacBook models, this MacBook mockups list will help you.

The design engineers in Apple always give an artistic touch to their products. This artistic touch gives a fresh look to our digital products, websites, and applications. Even if you are a case or accessory manufacturer for MacBooks, these mockups will help you give a natural look to your product.

In this MacBook mockups list, you will not only find the device mockups but you will also see the workspace mockup to give a realistic view. As these are all premium mockups you needn’t worry about the quality and the ease of use. All you have to is to replace the layers with your objects and elements. In order to give you more options and also to save your time, we have collected mockups for the most used 13-inch, 15-inch, and 12-inch screen sizes.

Read More

v03-free-countdown-timers

28 Easy To Use Free Countdown Timers With Cool Effects 2019

Visual effects and animation effects have become a part of the web design. Developers use these animation effects to create engaging contents. Marketers are very keen in using these effects to get a better product reach and good conversion rate. Countdown timers are one such element which is used to create a sense of urgency when the users land on the page. In this list, we have collected the best free countdown timers with cool effects.

You might have seen countdown timers mostly used in e-commerce websites and event websites. In e-commerce websites, the countdown timers are used just near the special offers to make the user feel the scarcity of the product. This marketing trick mostly works on the customers with a dilemma, whether or not to buy a product. Product launch and events are the second most common places where the countdown timers used the most. Many creative startups have used inspiring coming soon page design to get leads even before they start.

Read More

Liquid-Button

20 Stylish CSS Buttons For Fashionable Websites 2019

In the earlier web design, call to action buttons are bold and big with sharp boxy designs. The modern HTML5 and CSS3 have given us innumerable possibilities to create any shapes and designs. Your creative design can no longer sit on the PSD files alone they can be given life with the modern web development frameworks. In this list, we have collected some of the best and practically applicable CSS button designs that you can use for both website design and application design.

Call to action buttons on the landing page must get user attention. As we the generation humans have attention span less than a Gold Fish, animated elements will help you draw user attention on the required spots. These CSS buttons not only have creative shapes and design but also have a creative animation effect. Some of the buttons even have interactive animation effects, so make sure you check all the button designs in this list.

Read More

CSS-Ribbon-With-Inner-Border

20 CSS Ribbons To Make Your Websites Look Swanky In 2019

Ribbon designs are there in the web design from very earlier days. Whether you are using CSS ribbons to tag your products are using it as one of the web elements to show the options, there is a design for you in this list. Some creative developers have used the ribbons in the navigation and menu options as well. When it comes to creativity, the sky is the limit. The design inspirations in this list will help you find the right element for your design. Most of the ribbon elements in this list are static and simple designs, but we have also collected animated ribbons. With interactive hover effects and cool animation effects, you can spice your CSS ribbon design. Without further due, let us get into the list of CSS ribbon designs.

Read More

hospice-free-bootstrap-hospital-templates

27 Free Bootstrap Hospital Templates With Patient-Centric Design 2019

There are many free Bootstrap hospital templates out there in the market. All have a full-width layout, big images and web elements spread all over the pages. But if you are looking to make a hospital website with patient-centric design, where all the elements are placed in the most appropriate position. These handpicked free Bootstrap hospital templates will help you.

In most templates, you get a beautiful web design but not a properly designed template for that particular niche. Most top brands not simply design their website, they incorporate a strategy along with the design; the strategy that will lead to their goal. For example, Ann & Robert H.Lurie Children’s hospital in Chicago, not only provide health care service to the children but also collect donations to help them.

Read More

Horizontal Timeline Horizontal Timeline

23 Engaging Horizontal Timeline Examples To Copy This 2019

Typically, you can find timelines on various history books and lessons most of the time when explaining any specific events and why and when it happened. Based on similar strategies, various sectors and niches of business and professionals use it to keep things organized and sequential. This not only provides a better understanding of the content but also helps stay on track. The best and the most popular use of timelines can be seen on social media like Facebook and Twitter. All of your posts, tweets, images you upload and every data shared or saved is presented in a timeline right from when you were born and when you joined. Simply put, timelines provide the users with a useful framework that are a great way to make what can often be a huge range of data much more accessible and approachable.

Today we have for you a list of amazing timeline examples that you can use on your site. Since there are so many types of timelines to choose from whether it is animated, sliders, cards, progress bars and more, we decided to make it more interesting! We have divided the timelines into two categories, vertical and horizontal. Thus, here is a list of all the creative horizontal timelines and you can find the list of all the vertical timelines on our other post! All of these examples also include the link to the code snippets and the image to showcase the demo. Enjoy!

Read More