1.GRADIENTS COLLECTION PREVIEW
Used CSS variables and flexbox.
Made with
1 | HTML (Pug) / CSS (SCSS) |
Author
1 | MenSeb |
Demo
2.COLOR PALETTES
Color palettes with Flexbox.
Made with
1 | HTML / CSS |
Author
1 | Linda Labancz |
Demo
3.CSS GRID: COLOR PALETTE
Color palette that can be used in a real use case.
Made with
1 | HTML (Pug) / CSS (SCSS) |
Author
1 | Olivia Ng |
Demo
4.GRADIENT COLLECTION
A small collection of gradients.
Made with
1 | HTML (Pug) / CSS (PostCSS) |
Author
1 | Tamino Martinius |
Demo
5.DUOTONE FILTERING WITH CSS VARIABLES
Was playing with mix-blend-mode to create different duotone filters. Then I thought it might be cool to have a handy selector wheel to try out different filters. So here it is! A duotone filtering tester using CSS variables. The inner ring is the lightening color whilst the outer is the darkening color. To change the colors, adjust the colors variable in the Pug code.
Made with
1 | HTML (Pug) / CSS (Stylus) / JavaScript |
Author
1 | Jhey |
Demo
6.COLOR PALETTE
Color palette using CSS Grid.
Made with
1 | HTML / CSS (SCSS) |
Author
1 | Joshua Ward |
Demo
7.AUTO COLOR PALETTE FORMATTING
Add/Edit/Remove Hex Colors from the array to update the palette.
Made with
1 | CSS (SCSS) / JavaScript |
Author
1 | Tony Banik |
Demo
8.BOOTSTRAP 4 COLOR PALETTE GENERATOR. INCLUDING COLOR VARIANTS
Bootstrap 4 color palette generator. Generates color variants from Bootstrap $colors i.e: .text-indigo-600 .bg-indigo-600 .border-indigo-600.
Made with
1 2 | HTML/Haml CSS/SCSS |
Author
1 | Gilles Migliori |
Demo
9.COLOR PALETTE
Pure CSS color palette.
Made with
1 2 | HTML CSS/SCSS |
Author
1 | Joshua Ward |
Demo
10.COLOR PALETTE
Color palette with CSS flexbox.
Made with
1 2 | HTML CSS |
Author
1 | Diana Choi |
Demo
11.Color Wheel
Color wheel with HTML, CSS and JavaScript.
Made with
1 2 3 | Html Css/SCSS Javascript |
Author
1 | thepheer |
Demo
12.Color Palette Circles
Circles are nested SVG circles. They are generated by Jade loops (for easy tweaking). Flexbox lays them out in an even row. They are colorized via palettes from the COLOURlovers API.
Made with
1 2 3 | Html Css/SCSS Javascript |
Author
1 | Chris Coyier |
Demo
13.Color Palettes With Shades
Color palettes with shades in HTML, CSS and JavaScript. Palettes: Windows Phone, Tango Desktop Project, Fedora, Open Suse, Jack Production, iOs 7, Pantone Spring 2016.
Made with
1 2 3 | Html Css/SCSS Javascript |
Author
1 | Alessandro |
Demo
14.Pantone Color Search + Clipboard
Pantone color search with clipboard in HTML, CSS and JavaScript.
Made with
1 2 3 | Html Css/SCSS Javascript |
Author
1 | Mike Weaver |
Demo
15.Random Color Palette Generator
Added ability to toggle between light and dark background colors.
Made with
1 2 3 | Html Css/SCSS Javascript |
Author
1 | Giana |
Demo
16.Color Palettes
Click on the button to view a random color palette.
Made with
1 2 3 | Html Css/SCSS Javascript |
Author
1 | Screeny |
Demo
17.Color Palette
Click the color code to change the color!
Made with
1 2 3 | Html Css/SCSS Javascript |
Author
1 | Philipp |
Demo
18.Generate Palettes From An Image
This tool will let you drop an image and generate palettes from its top 100 colors (by surface area), and output it for use in CSS, iOS (Objective-C & Swift), Android (Java), etc.
Made with
1 2 3 | Html Css/SCSS Javascript |
Author
1 | Blixt |
Demo
19.Flattastic Pro Color Palette
This pen is an HTML/CSS version of the dribbble Flattastic Pro Color Palette by Erigon.
Made with
1 2 | Html Css |
Author
1 | Marcos Rodrigues |
Demo
20.Color Palette
Color swatches with hex values on click, actively selected and available to copy.
Made with
1 2 3 | Html Css/SCSS Javascript |
Author
1 | Louis Coyle |
Demo