Skip to content

ElenaGorbatkova/frontend-resources

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

31 Commits
 
 
 
 
 
 

Repository files navigation

Frontend-resources

resources

Resources for front-end Developers

Topics

Colors

Name Explaination
ColorHunt Get a list of colors for your needed.
ColorMind Colormind is a color scheme generator that uses deep learning. It can learn color styles from photographs, movies, and popular art.
ColorsWall Most popular Palettes color Collections.
Coolors The super fast color palettes generator
BrandColors The biggest collection of official brand color codes around.

Images

Name Explaination
Pexels The best free stock photos, royalty free images & videos shared by creators.
SkitterPhoto A place to find, show and share public domain photos.
Unsplash The internet’s source of freely usable images.
Pixabay Over 2.6 million+ high quality stock images, videos and music shared by our talented community.
Picspree Discover and download beautiful royalty free images, stock photos, illustrations, and vectors.
FindAphoto Browse through over 1 million high-quality stock photos across multiple free and paid stock photo sites - from one tab.
FreeImages Free Stock Photos & Royalty-Free Images.

Fonts

Name Explaination
GoogleFonts Library of around 1000 free licensed font families.
1001 FreeFonts The Ultimate Font Download. Download 10,000 fonts for just $19.95. Licensed for personal and commercial use.
Fontget Free Stock Photos & Royalty-Free Images.Has a variety of fonts available to download and sorted neatly with tags.

Icons

Name Explaination
Flaticon 3700+ Programing languages icon and logos.
Bootstrap Icons Free, high quality, open source icon library with over 1,600 icons. Include them anyway you like—SVGs, SVG sprite, or web fonts. Use them with or without Bootstrap in any project.
Material Design Icons Material Design Icons' growing icon collection allows designers and developers targeting various platforms to download icons in the format, color and size they need for any project.
Css Icons Icon set made with pure css code, no dependencies, "grab and go" icons.
Free Icons Best icons for personal and commercial use SVG - PNG.

Logos and SVG Backgrounds

👉 Logos

Name Explaination
Svgporn 1000+ high-quality SVG logos.
Logosearch Search engine with over 200,000 SVG logos.
Flaticon 3700+ Programing languages icons and logos.

👉 SVG Backgrounds

Name Explaination
Getwaves Customizable backgrounds images
Illustrationkit Free vector illustrations for personal & commercial projects designe.
Freepik Find and download the best high-quality photos, designs and mockups.
Drawkit Hand-drawn vector illustration and icon resources, perfect for your next project.
Blobmaker Blobmaker is a free generative design tool. Create random, unique, and organic-looking SVG shapes.

Alerts

Name Explaination
Sweetalert SweetAlert makes popup messages easy and pretty.
Sweetalert 2 A beautiful, responsive, customizable, accessible (wai-aria) replacement for javascript's popup boxes replacement.

Animations

👉 CSS

Name Explaination
Animista CSS animation. Smooth Text, Box-modal, hover animation.
Loaders This is a library having a collection of different types of CSS loaders, spinners.
CSSloaders Awesome collection of beautiful loading spinners.
Animate Animate.css is a library of ready-to-use, cross-browser animations for use in your web projects. Great for emphasis, home pages, sliders, and attention-guiding hints.
Hover.css A collection of CSS3 powered hover effects to be applied to links, buttons, logos, SVG, featured images and so on.
Tholman Animations for the strong of heart, and weak of mind.
Motion UI A Sass library for creating flexible CSS transitions and animations.
Tholman Animations for the strong of heart, and weak of mind.

👉 Javascript

Name Explaination
Animation on Scroll Animate on scroll library to reveal animations when You scroll.
Wow.js Reveal Animations When You Scroll.
Greensock Reveal Animations When You Scroll.
ParticlesJS A lightweight JavaScript library for creating particles.
SimplePARALLAX The easiest way to get a parallax effect with javascript. (Scroll effect)

Image Sliders

Name Explaination
SwiperJs The Most Modern Website and Mobile Touch Slider.
SplideJs Splide is a lightweight, flexible and accessible slider/carousel written in TypeScript. No dependencies, no Lighthouse errors.
SequenceJs The responsive CSS animation framework for creating sliders, presentations, banners, and other step-based applications.

Videos and Sounds

Name Explaination
Pexels The best free stock videos shared by the Pexels community.
Pixabay Stunning free stock video footage & clips.
Videvo Free and premium awesome stock videos
Free-Stock-Music Royalty free stock music for attractive videos, YouTube videos, podcasts, etc.
Bensound Royalty Free Music for Creators.

React UI Tools & Packages

Name Explaination
Smooth Scroll React Provider Component to add a smooth scroll effect
React Gsap React Gsap lets you use the GreenSock Animation Platform (GSAP) in React in a fully declarative way.
REACT SPINNERS Some awosome loading effects.
React Preloaders Package for adding preloaders to your react app.
React Type Animation A customizable React typing animation component.
React Animated Text AA component to animate your text in React! Use predefined animation type or compose your own one.
Custom Cursor React Animated, customizable and interactive cursor for React
AtroposJs Javascript library to create stunning touch-friendly 3D parallax hover effects.
Mouse Image Move React.js package for smooth moving image with mouse move.

Design Templates

Name Explaination
Ohio-Clbthemes A website With best in class features and design templates.
Envato Elements Unlimited downloads of 60+ million creative assets and Templates.
Templatemonster The collection of items includes a wide choice of website templates suitable for all kinds of niche-specific projects.
Siteinspire Siteinspire is a showcase of the finest web and interactive design.
Webdesign-inspiration This is a web design inspiration gallery and the best website design ideas .
Awwwards The awards of design, creativity and innovation on the internet.
Screenlane The latest mobile UI design inspiration in your inbox every week, for free.
Dribbble Explore the world’s leading design portfolios.
Free Design resources Crafted with love from amazing artists and professional designers around the world, ranging from fonts, mockups, graphics, templates & more.

Tools

Name Explaination
TinyPng Smart WebP, PNG and JPEG compression.
I love Pdf Every tool you need to work with PDFs in one place.
Box-Shadows Beautiful CSS box-shadow examples.
Colors From Image Get color codes by uploading file from your computer or insert link.
Figma All the elements you need to create amazing logos, social media graphics, presentations and more, for free.
Canva Online design tools
Removebg Remove and change the background of image on online.
Unscreen Remove Video Background 100% Automatically and Free.
Glass UI Glass UI is a free and open-source CSS library based on the glassmorphism design specifications.
Mobile-friendly Test Test how easily a visitor can use your page on a mobile device.

About

Resources for front-end web developers.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published