Tasarımcılar için Uyumlu Renk Paleti Oluşturma Yöntemleri

0 3.287

Birazdan okuyacağınız bu yazı da renk nedir,renk paleti ne için kullanılır, uyumlu renk paleti nasıl oluşturulur, bunun için hangi araçları ve siteleri kullanırız ve HTML,CSS kodları nasıl oluşturulur sorularına cevap bulacaksınız.

Renk nedir?

Öncelikle renk nedir sorusuna cevap verelim.Renk, ışığın gözün retina bölgesinde bulunan ışık algılayıcısına farklı dalga boyutlarında ulaşmasıyla ortaya çıkan hayali bir algılamadır.Işık kaynağı(güneş- lamba) ortamda bulunan nesnelere çarpıp gözümüze ulaşır.Bu çarpma sırasında nesne bu ışığın bir kısmını kendine hapseder, bir kısmını ise yansıtır.Bu yansıma boyutları farklı renk tonları oluşturur.

Renk paleti ne için kullanılır?

Tasarım,tekstil ve boyacılık sektöründe sıkça karşımıza çıkan renk paletleri (sektöre göre renk kartelaları) yapılacak işe en uygun renkleri oluşturmak için hazırlanır.Renk paleti birbiriyle en uyumlu renkleri veya bir renge ait tonları bir araya getirme işidir.Renk paletleri özellikle farklı renklerin en uyumlu olanlarını bir araya getirilmesiyle oluşur.

Tasarım alanında bir çok tasarımcının belki de en zorlandığı kısım renklerdir.Çünkü projeye uygun ana rengi ve o renkle uyumlu diğer renkleri bulmak oldukça önemli aynı zaman da yorucu bir iştir.Kendi adıma konuşursam her proje için hangi renkleri kullanacağımı,hangi renklerin daha iyi etki yapacağını, belirlediğim renklerin birbirleriyle uyumunu saatlerce düşünür araştırırım.

Çoğu zaman projelerim de kendi renk paletimi kendim oluştururum.Bazen projeye göre tek renk ve onun tonlarını kullanmam yeterli olur.Bazen de kolaya kaçarak daha önce farklı tasarımcılar tarafından oluşturulmuş renk paletlerini de kullanırım.

Daha Fazla Oku:

Bu yazımda da online renk paleti nasıl oluşturulur, daha önce oluşturulmuş en güzel renk paletlerini nasıl bulabilirsiniz bunun için hangi web uygulamaları var onları listeledim.

Renk Paleti Oluşturma Siteleri Nelerdir

1 – Adobe Color

adobe-color-renk-paleti-olusturma

Adobe Color, bir çok kişinin Kuler olarak bildiği Adobe’nin binlerce renk paletini barındıran web uygulamsı.İsterseniz yüzlerce popüler paletler arasından seçim yapabilir,isterseniz de kendi paletinizi kendiniz oluşturabilirsiniz.Ayrıca Adobe Color, bir çok Adobe programı (Photoshop, illustrator) ile uyumlu çalışır.

2 – Coolors

coolors-renk-paleti-olusturma

Coolors, benim de en fazla faydalandığım çok güzel renk paleti oluşturma uygulamasıdır.Siteye girdiğiniz de spacebar tuşuna basarak yüzlerce random renk paletlerini görebilirsiniz.Kendi paletinizi oluşturmak isterseniz karşınıza çıkan paletteki beğendiğiniz bir rengin üstüne tıklayarak ekrana kilitleyebilirsiniz.Bu şekilde diğer paletlerden de renkleri seçip kendi paletinizi oluşturabilirsiniz.Coleure’ı sevmemin nedeni uygulamanın bir çok güzelliğinin olmasıdır.İster mevcut renk paletlerinden biri kullanabilir, isterseniz kendi paletinizi oluşturabilirsiniz.Ayrıca oluşturduğunuz paletin CSS kodları da(HSL,RGB,HEX formatında) indirebilirsiniz.

3 – Coleure

coleure-renk-paleti-olusturma

Coleure, sağ tarafta ayrılmış özel alana seçtiğiniz renkleri sürükleyerek kolayca kendi paletinizi oluşturmanız sağlayan güzel bir palet oluşturma uygulamasıdır.Oluşturduğunuz paleti bilgisayarınıza indirebilirsiniz.

4 – 0to255

0-to-255-renk-paleti-olusturma

0to255, web tasarımcıları için her hangi bir rengin açık ve kapalı tonlarını bulabileceği basit bir araç.Tasarımınız da bir rengin bir kaç farklı tonunu kullanmanız gerekiyorsa bu araç sizin için biçilmiş kaftan.Kullanımı oldukça basit.

5 – HEX to RGB

hex-to-rgb-renk-paleti-olusturma

Hex to RGB, isminde de belirttiği gibi HEX renk kodlarını RGB’e renk kodlarına çeviriyor.Tabi bunun tam tersi RGB kodlarını da HEX’e çevirebiliyor.Çizim aracında HEX renk kodlarını kullandınız ama kodlama yaparken rgb’ye ihtiyacınız varsa yada RGB kodlarını bilginiz bir rengin HEX kodlarına ihtiyaç duyarsanız HEX to RGB tam size göre bir uygulama.

6 – Color Thief

color-thief-renk-paleti-olusturma

Color Thief yani Türkçe karşılığı “renk hırsızı” bir fotoğraftaki baskın rengi ve fotoğraftaki diğer renkleri yakalayan bir script.Javascript ile geliştirilen bu uygulamayı projelerinize dahil edebilirsiniz.

Renkler HTML ve CSS de nasıl kullanılır

Bir web sayfasına renk vermek yani stil atamak esas olarak CSS’in görevidir.Bu yüzden renkler CSS kodlarına göre yazılır.CSS de renkleri kullanabileceğiniz 3 farklı yöntem vardır.Bunlar HEX, RGB ve HSL türleridir.Ayrıca bazı renkler ingilizce isimlerine göre de CSS kodlarına eklenebilir.CSS renk kodları hakkında detaylı anlatıma bakabilirsiniz.

HEX yöntemi hexadecimal(onaltılık sayı sistemi) sistemine göre yazılır.Bu onaltılık sayısı sistemi 0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F şeklindedir.Dokuzdan sonra A 10 sayısını temsil ederken,F 15 sayısını temsil eder.Bu yöntem de ikili sayılar bir renk temsil eder.Bütün ikililer f olursa -ffffff şeklinde- beyaz, 0 olursa siyah renk ortaya çıkar.HEX ile kırmızı renk oluşturalım.

 

RGB yöntemi Red(Kırmızı),Green(Yeşil) ve Blue(Mavi) renklerini temsil eder ve her renk 3 basamaklı ile gösterilir.000 düzeyinden başlayıp 255 ile biter.

Kırmzı renk RGB yöntemine göre:

 

Bir de opacity(şeffaflık) eklemek için sonuna 0-1 arası rakam eklenebilir.O yöntem de rgba(255,000,000,.5) şeklinde olur.

HSL Hue,Saturation ve lightness kelimelerinin kısaltmasıdır.Bu yöntem de Hue renk, saturation doygunluk ve lightness parlaklık vermek için kullanılır.Kırmızı renk HSL yöntemine göre

 

Ayrıca RGB gibi opacity vermek için sonuna alpha(a) getirilir.

Yazı Hakkında

Bu yazının amacı, görselliği artırmanın en temel yolu olan renkler konusunda yeterli kaynak oluşturmak için yazılmıştır.Projelerinizde ya da tasarımlarınıza renkler konusunda sıkıntı yaşıyorsanız yazımı okuyabilirsiniz.Bu yazıda renk nedir, nasıl oluşur, en uyumlu renkler hangisidir, renk paletleri nasıl oluşturulur, en iyi renk paletlerini nasıl bulurum, renk kodları nasıl eklenir gibi soruların cevapları verilmektedir.Keyifli okumalar.

Bunları da beğenebilirsin