Skip to main content

Menyimpan Material Design Color Palette Di Blog

Menyimpan Material Design Color Palette Di Blog - Dengan color palette ini kita bisa dengan mudah mencari warna yang sesuai dengan selera kita yang cocok untuk blog kita. Dengan palet warna ini kita bisa memilih warna untuk elemen utama dan elemen lainnya sehingga perpaduannya menjadi pas. Di sini kita bisa menentukan warna dominan dan warna turunan untuk blog kita sehingga warna-warnanya tidak saling tabrakan.

Namun jangan lupa dalam menentukan warna background harus kontras dengan warna teks sehingga perpaduan warnanya tetap user friendly dan nyaman di baca.

Sebenarnya color palette ini dari Material Design yang kemudian saya buat agar bisa dipasang dengan mudah di blog.

Di sini saya menambahkan copy clipboard.js agar menjadi mudah dalam mengambil atau mengcopy kode hex dari warna yang kita pilih.

Kita tinggal klik pada warna yang kita inginkan kemudian paste di style yang sedang kita buat atau edit.

Sebagai live demonya, siahkan coba di halaman color palette ini.


Jika Anda ingin menyimpannya di blog Anda, silahkan simpan kode berikut di halaman postingan atau halaman static pada mode HTML.

1. Untuk blog AMP


<amp-iframe noloading title="Color Palette"
              src="https://cdn.rawgit.com/KompiAjaib/kompi-html/master/color-palettes2.html"
              height="575"
              layout="fixed-height"
              frameborder="0"
              sandbox="allow-forms allow-scripts allow-same-origin allow-modals allow-popups">
    <amp-img noloading src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj6z4YyO1yU6cG07brIFK0pU0Vv8cHUxIdfbF8zq92WEakUCXKJJFbFax6rJRoKJlapKqLOjdcYzdUuvldsDIELcf2Fia0BgPcoZTRila-GojNLfemVfFehAYN4qvkPK_6UgcmSn1P_aFM/s1600/placeholder.png"
             layout="fixed-height"
             height="575"
             width="auto"
             placeholder>
    </amp-img>
  </amp-iframe>

Dan pastikan di halamannya sudah ada amp-iframe.js

2. Untuk blog Non AMP


<iframe title="Color Palette" src="https://cdn.rawgit.com/KompiAjaib/kompi-html/master/color-palettes2.html" frameborder="0" style="height:575px;width:100%"></iframe>

Semoga bermanfaat.

Berbagi itu peduli:

Comment Policy:

Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui. Untuk komentar out of topics silahkan masuk ke Forum Kompi Ajaib
Buka Komentar
Buka Komentar
Jangan Diklik!

Menarik Untuk Dibaca Juga:


PrivacySitemap
©2021 KOMPI AJAIB