01 of 10
ຄວາມເຂົ້າໃຈສີແລະ Web Color Schemes
ມີສີ່ລະດັບສີພື້ນຖານທີ່ທ່ານສາມາດນໍາໃຊ້ສໍາລັບເວັບໄຊທ໌. ແຕ່ລະຫນ້າຂອງບົດຄວາມນີ້ສະແດງໃຫ້ເຫັນຮູບພາບຂອງລະບົບສີແລະວິທີທີ່ທ່ານສາມາດສ້າງໂຄງການທີ່ຄ້າຍຄືກັນໃນ Photoshop.
- monochromatic
ການນໍາໃຊ້ສີຂອງສີດຽວກັນ. ພວກເຂົາອາດຈະມີສີຂີ້ເຖົ່າຫຼືບ່ອນທີ່ແຕກຕ່າງກັນຂຶ້ນຢູ່ກັບສີຂາວຫລືສີດໍາທີ່ເພີ່ມຕື່ມ. - ຄ້າຍຄືກັນ
ນີ້ໃຊ້ສີທີ່ໃກ້ຊິດກັບຄົນອື່ນກ່ຽວກັບລໍ້ສີ. - complementary
ນີ້ແມ່ນມັກຈະເຫັນວ່າເປັນ "ກົງກັນຂ້າມ" ເນື່ອງຈາກວ່າທັງສອງສີໃນລະບົບສີເສີມແມ່ນກົງກັນຂ້າມກັບຄົນອື່ນກ່ຽວກັບລໍ້ສີ. - triadic
ສີເຫຼົ່ານີ້ແມ່ນຊ່ອງຫວ່າງດຽວກັນກ່ຽວກັບລໍ້ສີ.
ລະບົບສີທັງຫມົດຈະໃຊ້ສີເຫຼືອງນີ້ເປັນສີຖານ.
02 of 10
Monochromatic Web Color Scheme
ໂຄງການສີນີ້ໃຊ້ສີເຫລືອງທີ່ມີສີມ່ວງຂອງສີຂຽວຂອງຂ້ອຍແລະເພີ່ມສີຂາວແລະສີດໍາໃຫ້ສີມ່ວງແລະຮົ່ມໂຄງການຕາມຄວາມເຫມາະສົມ.
- ດ້ານເທິງຊ້າຍ - ສີພື້ນຖານ # ffe500
- ເທິງຂວາ - ເພີ່ມຕື່ມ 50% ສີຂາວເພື່ອໃຫ້ໄດ້ # fff280
- ດ້ານລຸ່ມເບື້ອງຊ້າຍ - ເພີ່ມຕື່ມຕື່ມ 75% ສີຂາວເພື່ອໃຫ້ໄດ້ # fff8bf
- ຕ່ໍາສິດ - ເພີ່ມຕື່ມ 50% ສີດໍາເພື່ອໃຫ້ໄດ້ # 7f7200
ລະບົບສີ Monochromatic ມັກຈະງ່າຍທີ່ສຸດໃນສາຍຕາຂອງໂຄງການສີທັງຫມົດ. ການປ່ຽນແປງທີ່ອ່ອນໂຍນໃນສີຂີ້ເຖົ່າແລະຮົ່ມເຮັດໃຫ້ສີໄຫຼເຂົ້າໄປໃນກັນແລະກັນ. ໃຊ້ລະບົບສີນີ້ເພື່ອເຮັດໃຫ້ເວັບໄຊທ໌ຂອງທ່ານປາກົດຂຶ້ນຫຼາຍແລະເກັບກໍາຂໍ້ມູນ.
03 of 10
More Monochromatic Web Color Scheme
ເພີ່ມຮຽບຮ້ອຍ 20% ສີດໍາເພື່ອໃຫ້ໄດ້ສີຫຼາຍໃນໂຄງການ. ການເພີ່ມສີດໍາຫຼືສີຂາວໃຫ້ສີຂອງທ່ານສາມາດສ້າງສີໃຫມ່ໃຫ້ກັບສີກະດານຂອງທ່ານໂດຍບໍ່ມີຄວາມສັບສົນກັບຫນ້າຂອງທ່ານ.
04 of 10
Analogous Web Color Scheme
ໂຄງການສີນີ້ໃຊ້ສີພື້ນຖານສີເຫຼືອງແລະເພີ່ມແລະລົບ 30 ອົງສາໃຫ້ສີໃນສີ palette ສີ Photoshop.
- ດ້ານເທິງຊ້າຍ - ສີພື້ນຖານ # ffe500
- ດ້ານເທິງຂວາ - + 30 ອົງສາເພື່ອໃຫ້ໄດ້ຮັບ # 99ff00
- ຕ່ໍາຊ້າຍ - - 30 ອົງສາເພື່ອໃຫ້ໄດ້ # ff6600
- ຮ່າງຂວາ - 100% ສີຂາວ #ffffff
ສີທີ່ຄ້າຍຄືກັນສາມາດເຮັດວຽກຮ່ວມກັນໄດ້ດີ, ແຕ່ບາງຄັ້ງມັນກໍ່ສາມາດຕໍ່ສູ້ຢ່າງຮຸນແຮງ. ໃຫ້ແນ່ໃຈວ່າການທົດສອບໂຄງການເຫຼົ່ານີ້ມີຫຼາຍກວ່າຄົນອື່ນ, ຄອບຄົວແລະຫມູ່ເພື່ອນຂອງທ່ານ. ໃນເວລາທີ່ພວກເຂົາເຮັດວຽກ, ພວກເຂົາສ້າງເວັບໄຊທີ່ມີສີສັນຫຼາຍກວ່າໂຄງການ monochromatic, ແຕ່ເກືອບເປັນນ້ໍາ.
05 of 10
More Color Analogous Web Color Scheme
ເພີ່ມຮຽບຮ້ອຍ 20% ສີດໍາເພື່ອໃຫ້ໄດ້ສີຫຼາຍໃນໂຄງການ.
06 of 10
Complementary Web Color Scheme
ລະບົບສີທີ່ສົມບູນແບບ, ຕ່າງຈາກລະບົບສີອື່ນໆໂດຍປົກກະຕິມີພຽງແຕ່ສອງສີ. ສີພື້ນຖານແລະມັນກົງກັນຂ້າມກັບລໍ້ສີ. Photoshop ເຮັດໃຫ້ມັນງ່າຍທີ່ຈະໄດ້ຮັບສີທີ່ສົມບູນແບບ - ພຽງແຕ່ເລືອກເອົາພື້ນທີ່ຂອງສີທີ່ທ່ານຕ້ອງການປະກອບແລະກົດ Ctrl-I. Photoshop ຈະ invert ມັນສໍາລັບທ່ານ. ໃຫ້ແນ່ໃຈວ່າເຮັດແບບນີ້ໃນຊັ້ນດຽວກັນ, ດັ່ງນັ້ນທ່ານຈຶ່ງບໍ່ສູນເສຍສີພື້ນຖານຂອງທ່ານ.
- ຊ້າຍ - ສີພື້ນຖານ # ffe500
- ຂວາ - ສົມບູນ # 001aff
ລະບົບສີປະສົມປະສານມັກຈະມີປະໂຫຍດຫຼາຍກວ່າລະບົບສີອື່ນໆ, ດັ່ງນັ້ນຈິ່ງໃຊ້ໃຫ້ພວກເຂົາດູແລ. ພວກມັນມັກຖືກໃຊ້ຢູ່ໃນຊິ້ນສ່ວນທີ່ຈໍາເປັນຕ້ອງຢືນຢູ່.
07 of 10
ເພີ່ມເຕີມໂຄງການສີທີ່ສົມບູນແບບ
ເພື່ອໃຫ້ໄດ້ຮັບການສະບັບນີ້, ຂ້າພະເຈົ້າໄດ້ເພີ່ມ 50% ສີຂາວໄປຫາເຄິ່ງດ້ານລຸ່ມຂອງສີແລະ 30% ສີດໍາໄປຫາສູນກາງ. ໃນຂະນະທີ່ທ່ານສາມາດເຫັນໄດ້, ມັນເຮັດໃຫ້ທ່ານມີທາງເລືອກຫລາຍຂື້ນແຕ່ວ່າມັນຍັງເປັນໂຄງການສີທີ່ສົມບູນແບບ.
08 of 10
Triadic Web Color Scheme
ລະບົບສີ Triadic ແມ່ນມີ 3 ສີຫຼາຍກວ່າຫລືນ້ອຍກວ່າເທົ່າກັບແຜ່ນສີ. ເນື່ອງຈາກລໍ້ສີແມ່ນ 360 ອົງສາ, ຂ້ອຍໃຊ້ກ່ອງສີມ່ວງອີກເທື່ອຫນຶ່ງໃນຕົວເກັບສີເພື່ອເພີ່ມແລະລຶບ 120 ອົງສາຈາກສີພື້ນຖານ.
- ດ້ານເທິງຊ້າຍ - ສີພື້ນຖານ # ffe500
- ດ້ານເທິງຂວາ - +120 ອົງສາເພື່ອໃຫ້ໄດ້ # e500ff
- ດ້ານລຸ່ມເບື້ອງຊ້າຍ - -120 ອົງສາເພື່ອໄດ້ຮັບ # 00ffe6
- ຮ່າງຂວາ - 100% ສີຂາວ #ffffff
ລະບົບສີ Triadic ມັກຈະຜະລິດຫນ້າເວັບທີ່ມີຊີວິດຊີວາທີ່ສຸດ. ແຕ່ຄືກັບລະບົບສີທີ່ສົມບູນແບບ, ພວກມັນສາມາດມີຜົນກະທົບຕໍ່ຄົນອື່ນ. ໃຫ້ແນ່ໃຈວ່າຈະທົດສອບ.
ນອກນັ້ນທ່ານຍັງສາມາດສ້າງໂຄງການສີ tetradic ຫຼື 4 ສີ, ບ່ອນທີ່ສີແມ່ນ spaced ເທົ່າທຽມກັນປະມານລໍ້ສີ.
09 of 10
More Triadic Web Color Scheme
ເຊັ່ນດຽວກັນກັບຕົວຢ່າງອື່ນໆ, ຂ້າພະເຈົ້າໄດ້ເພີ່ມ 30% ສີດໍາຮຽບຮ້ອຍກັບສີເພື່ອໃຫ້ໄດ້ຮັບຮົ່ມເພີ່ມເຕີມ.
10 ຈາກ 10
Discordant Web Color Schemes
ຄວາມງາມແມ່ນຢູ່ໃນສາຍຕາຂອງຜູ້ເບິ່ງແຍງ, ແຕ່ມັນເປັນຄວາມຈິງທີ່ຫນ້າເສຍດາຍທີ່ບໍ່ແມ່ນສີທັງຫມົດໄປນໍາກັນ. ສີ discordant ແມ່ນສີທີ່ມີຫຼາຍກ່ວາປະມານ 30 ອົງສາແຍກຢູ່ໃນລໍ້ສີແລະບໍ່ສົມບູນຫຼືສ່ວນຫນຶ່ງຂອງ triad.
ລະບົບສີ discordant ສາມາດຕົກຕະລຶງຫຼາຍແລະຄວນໃຊ້ພຽງແຕ່ສ້າງຄວາມສົນໃຈ. ຈົ່ງຈື່ໄວ້ວ່າເນື່ອງຈາກສີເຫຼົ່ານີ້ມັກຈະຂັດຂວາງ, ຄວາມສົນໃຈທີ່ທ່ານໄດ້ຮັບອາດບໍ່ແມ່ນສິ່ງທີ່ທ່ານກໍາລັງຊອກຫາ.