Soğutma Renk Paleti Jeneratörüne Kılavuz
Bu yazı, günlük kullanıcılar ve profesyonel tasarımcılar tarafından güçlü bir renk şeması oluşturmak için kullanılan Coolors.co Tools için eksiksiz bir rehberdir. Bu uygulama için potansiyel kullanım durumunu, arkasındaki özellikleri ve bu aracı kullanarak iş akışımızı daha verimli hale getirmeyi öğrendiğimiz ipuçlarını ve püf noktalarını tartışacağız. Bu makalenin tek tek bölümüne atlamak için bu sayfanın üst kısmındaki Tablo İçeriği özelliğini kullanmaktan çekinmeyin. Bu araç yakın zamanda yeniden tasarlandı ve bu kılavuz Jeneratör Coolörler Color Palet sürüm 2021 (şu anda) ile ilgilidir.
Coolors.co nedir? Coolors.co, siz ve şirketiniz için bir renk şeması üretmek için hızlı bir şekilde kullanabileceğiniz çok basit bir web uygulamasıdır. Tek yapmanız gereken boşluk çubuğuna basmak ve iyi bir renk şeması seçimi alacaksınız. Mevcut olanı sevmiyorsanız, SPasi bıçaklarına tekrar basabilirsiniz ve size yeni bir tane verebilirsiniz. Evren patlayana kadar bu süreci tekrarlayabileceksiniz ve aynı renk şemasını iki kez alamayacaksınız.
Yeni bir yeniden tasarımla, görüntüden bir renk şeması yapmak, kolaj yapmak ve degradeler yapmak gibi daha fazla işlev elde edersiniz. Web tasarımcıları için daha fazla işlev de vardır, çünkü artık CSS ve Adobe Palet dosya formatlarında paletleri ve gradyanları dışa aktarabilirsiniz.
Bir ajans olarak bunu markalaşma projeleri ve web siteleri için renk şeması fikirleri üretmek için kullanıyoruz. Bu, kullanım için beş veya altı renk paleti yapmak için iyi bir başlangıç noktasıdır. Son genel özellik, imleci iki renk arasındaki sınıra yönlendirirseniz, başka bir renk eklemenize izin veren bir düğme görünecektir. Bu, ekranınızda aynı anda 8, 9 veya 10 farklı renge sahip olabileceğiniz anlamına gelir. Bir renkten hoşlanıyorsanız, ancak bir başkasını yenilemek istiyorsanız, sevdiğiniz rengi kilitleyebilirsiniz ve jeneratör kilitli yiyeceklere uygun rengi yapacaktır , örneğin, açık maviyi seviyorsanız, ancak diğer renk sizin için değilse, açık maviyi kilitleyebilirsiniz ve renk değiştiğinde standart kalır.
Bir ajans olarak bunu markalaşma projeleri ve web siteleri için renk şeması fikirleri üretmek için kullanıyoruz. Bu, kullanım için beş veya altı renk paleti yapmak için iyi bir başlangıç noktasıdır. Son genel özellik, imleci iki renk arasındaki sınıra yönlendirirseniz, başka bir renk eklemenize izin veren bir düğme görünecektir. Bu, ekranınızda aynı anda 8, 9 veya 10 farklı renge sahip olabileceğiniz anlamına gelir. Bir renkten hoşlanıyorsanız, ancak bir başkasını yenilemek istiyorsanız, sevdiğiniz rengi kilitleyebilirsiniz ve jeneratör kilitli yiyeceklere uygun rengi yapacaktır , örneğin, açık maviyi seviyorsanız, ancak diğer renk sizin için değilse, açık maviyi kilitleyebilirsiniz ve renk değiştiğinde standart kalır.
Kafes simgesine tıklamak birçok temel renk deseni içerir. Bir malzeme çerçevesi (veya bir renge dayalı basit bir ihtiyaç) ile bir kullanıcı arayüzü yaparsanız, bu özelliği kesinlikle seveceksiniz, çünkü renkleri kolayca daha koyu ve daha parlak hale getirebilirsiniz.
Renk gölgesini tıklamak, orijinal rengi bir kamu paletinde yeni bir renkle değiştirecektir. Rengi gerçekten seviyorsanız, favori yapabilir ve daha sonra kaydedebilirsiniz. Bunu sıklıkla yaparız ve bir rengi kilitleyerek ve etrafındaki diğer renkleri ferahlatarak bir şema üretecek 20 ayrı renkten oluşabilecek temel bir setimiz var. Unutmayın, bu işlevi kullanmak ve diğer birkaç işlevi kullanmak için bu platformla ücretsiz bir hesabınız olmalıdır.
Birçoğu bilmiyor, ancak bu uygulamanın Adobe Photoshop için bir eklenti var. Bu, araçları doğrudan çok güçlü bir dijital tasarım platformunda birleştirerek iş akışınızı ciddi şekilde artırabilir. Ayrıca, aynı şeyi son zamanlarda piyasaya sürülen en son sürümünü yapan iOS uygulamasını yaptılar, daha temiz bir pakette daha gelişmiş özelliklerle geldi. Bu blog yayınının geri kalanı, yeniden tasarlanan bu aracın sahip olduğu her özelliği tartışacak ve iş akışınız için ne yapabileceğinizi, ipuçlarını ve püf noktalarını ve pratik olarak günlük durumlara nasıl uygulanacağını söyleyecektir.
İlk düğme, değiştirmek için birçok ayrı ayar sunan gerilme menüsünü etkinleştirir. Birincisi, renk şemanızı üretmek için kullanılan yöntemdir. Varsayılan olarak, bu yöntem otomatiktir, ancak belirli matematiksel denklemlere, stratejilere ve daha fazlasına dayalı renkler üretecek şekilde ayarlayabilirsiniz.
Bu Google ile arkadaşınızdır ve rengin arkasındaki nesil yöntemi hakkında çok şey öğrenebilirsiniz. Bu uygulama, bilgisayardan önce kullanılan ve yalnızca dijitalleştirilen deneme ve doğru yöntemi alır. Örneğin, üretim yönteminiz için tamamlayıcı bir renk seçerseniz, renk tekerlekleri üzerinde tamamlayıcı bir renk alacaksınız. İşte mavi ve turuncu örnekler:
Çekme menüsünde nesil modunuzun altındaki bir sonraki seçenek, beklemenin bir haritasıdır. Temel olarak paletinizin siyah beyaz bir versiyonunu üretecek ve her bir rengi gösterecektir.
Parlaklık, belirli bir yönde yayılan ışık birimi başına ışık yoğunluğunun fotometrik bir ölçüsüdür. Bu, tek tek renklerden yayılan ışık miktarını gösterir. Bir sonraki seçim gradyanınız olarak palete bakın, renk paletinizi gradyan olarak görmektir. Paletimizde altı ayrı rengimiz olduğu bu kullanım durumunda, bu çok yararlı değildir. Ancak iki renkten oluşan bir gradyan üretmek istiyorsanız ve öngörüyü projenize veya web sitenizin tasarımına girmeden önce görmek istiyorsanız, bunu bu araçla yapabilirsiniz. İşte iyi bir örnek. Mor ve pembeden degradeler yapmak ve bunları herhangi bir tasarım konseptinde kullanmadan önce yükseltmek istiyoruz. Tabii ki, bir gradyan hazırlamak için fotoğraf deposuna girebilir ve 30 saniyeye kadar harcayabiliriz veya Coolors uygulamasına dahil olan bu küçük aracı kullanabiliriz.
Triadik üretim yöntemini kullanarak iki renk üretiyoruz. Triadik renk şeması, renk tekerlekleri üzerinde eşit olarak ayrılmış üç renkten yapılmış her renk paletidir. Örneğin kırmızı, sarı ve mavi. Genellikle, bir renk baskın bir renk olarak işlev görürken, diğer ikisi aksan olarak işlev görür.
Bu örnek için, sağda gösterilen mavi moru bulana kadar birçok rengi izledim. Bulduktan sonra kilitledim ve jeneratörü pembe bir cennet üretmek için çalıştırdım. Şimdi, bunun bir gradyan olarak iyi görüneceğini düşünüyorum, ancak birbiriyle gerçekten birlikte görene kadar emin değilim.
Bu, tek bir tıklama ile üretilen renk gradyanıdır ve benim için oldukça iyi görünüyor. Ayrıca, gerilme menümüzde ek ayarların kullanıcı arayüzüdür. Zen modunuz, tüm üstbilgileri ve altbilgileri kaldıran ve yalnızca ürettiğiniz renk paletini görüntüleyen Zen modunu etkinleştirmek için kullanabilir. Önerildiği gibi, bu mod çok Zen’dir ve F-11 düğmesine daha fazla odaklanacak şekilde tarayıcınızla tam ekran modunu bile değiştirebilirsiniz.
Bu, tek bir tıklama ile üretilen renk gradyanıdır ve benim için oldukça iyi görünüyor. Ayrıca, gerilme menümüzde ek ayarların kullanıcı arayüzüdür. Zen modunuz, tüm üstbilgileri ve altbilgileri kaldıran ve yalnızca ürettiğiniz renk paletini görüntüleyen Zen modunu etkinleştirmek için kullanabilir. Önerildiği gibi, bu mod çok Zen’dir ve F-11 düğmesine daha fazla odaklanacak şekilde tarayıcınızla tam ekran modunu bile değiştirebilirsiniz.
Bu modda, göreceğiniz şey budur:
İlk gerilme menüsünde ekranın sağındaki ana menüden, renk paletinin üstünde yönlendirilebilen tüm öğeleri içerir. Bir sonraki görüntüden bir renk şeması oluşturun Her bir fotoğrafın renk şemasını üretmenizi sağlayan çok kullanışlı bir araca sahipsiniz. Fotoğraf koleksiyonunun etrafında web sitenizi oluşturursanız ve yazı tipi renkleri, vurgu renkleri ve daha fazlası üretmeniz gerekiyorsa bu çok yararlıdır.
İlk gerilme menüsünde ekranın sağındaki ana menüden, renk paletinin üstünde yönlendirilebilen tüm öğeleri içerir. Bir sonraki görüntüden bir renk şeması oluşturun Her bir fotoğrafın renk şemasını üretmenizi sağlayan çok kullanışlı bir araca sahipsiniz. Fotoğraf koleksiyonunun etrafında web sitenizi oluşturursanız ve yazı tipi renkleri, vurgu renkleri ve daha fazlası üretmeniz gerekiyorsa bu çok yararlıdır.
Kullanıcı arayüzü, bir koma görüntüsü yüklemenize, URL virgülünden görüntüleri seçmenize olanak tanır, görüntüyü almak için kameranızı kullanın ve hatta arayın. Arama özelliği, resim toplamak için Unllash API’sını kullanır.
Bu örnek için bunu kullanacağımız şey bu. Deniz manzaralı bir tatil kiralama evi için bir web sitesi inşa ettiğinizi varsayalım. Veranda kahramanınız olarak bir deniz görüntüsü kullanmak ve okyanusun etrafında bir renk şeması oluşturmak istiyorsunuz. Select Image Popup’taki işlevi kullanarak deniz ürünleri fotoğraflarını arayabilirsiniz. Daha da iyisi, tüm fıkra fotoğrafları telif hakkı içermez ve ticari uygulamalarda kullanılmaktadır. Web sitenizdeki bir resim olarak renk şemanızı üretmek için doğru görüntüyü kullanmayı seçebilirsiniz (görüntünün çözünürlüğü veya boyutu hakkında endişelenmenize gerek yoktur, çünkü Flash’taki orijinal görüntülerin çoğu en az 6000 pikseldir Geniş.) Görüntünüzü aldıktan sonra, bu aracı fotoğraftaki tek tek renkler için bir pipet olarak hareket etmek için kullanabilirsiniz. Altı rengin her birine göz atabilir ve bu şekilde bir palet üretebilirsiniz. Temel bir paletiniz olduktan sonra, bir sonraki düğmeye basmak seçenek menüsünü getirecektir.
Jeneratörde açabilir, paleti görebilir, paleti bir resim olarak dışa aktarabilir, saklayabilir veya bir kolaj yapabilirsiniz. Her biri ana menüdeki seçenektir ve bu makalede daha sonra tartışılacaktır, ancak tek tek görüntülerden bir renk şeması yapmaya çalışırsanız bir jeneratör açmayı seçmek iyi bir fikirdir.
Jeneratörde açabilir, paleti görebilir, paleti bir resim olarak dışa aktarabilir, saklayabilir veya bir kolaj yapabilirsiniz. Her biri ana menüdeki seçenektir ve bu makalede daha sonra tartışılacaktır, ancak tek tek görüntülerden bir renk şeması yapmaya çalışırsanız bir jeneratör açmayı seçmek iyi bir fikirdir.
Artık jeneratörde açtığımıza göre, devam edip istediğimiz rengi seçebilir ve kilitleyebiliriz. Bu örnekte hem blues hem de Brown’u saklamak istiyorum. Bages ve diğer sarı, gözlere daha çekici görünen bir şeyle değiştirilmelidir. Biraz renkte geçiş yaptıktan sonra, daha sonra deniz temalı web sitemizde kullanılabilecek bu renk şemasını üretiyoruz. Bu, bir görüntünün renk şemasını üretmek için bu aracı kullanmanın birçok yolunun sadece bir örneğidir. Ana menü seçeneğinde bir sonraki görüntüden bir renk kolajı yapmak bir kolaj oluşturmaktır. Bunu tıklamak, resim yükleyebileceğiniz veya unllash aracılığıyla arama yapmak için kullanabileceğiniz görüntü kullanıcı arayüzünü tekrar içerecektir. Kolaj üreticileri, orijinal görüntü kolajlarda dışa aktarılamadıkça, bir görüntünün palet üreticisine benzer hareket eder. Web sitesi tasarımcıları için renk üretmeye çalışırsanız, bu kullanmak iyi bir fikir olabilir, çünkü bu istediğiniz rengi ve seçtiğiniz görüntüyü gösterecektir.
Paletin gerçek stilini ve boyutunu değiştirebilirsiniz, ancak sunulan bir kolaj jeneratörü ile en işlevsel özellik palet özelliğidir. Artı ve kullanıcı arayüzünün sağ tarafındaki eksi düğmeler, tek tek renkleri eklemenize ve silmenize olanak tanır. Paletinizde 10 ve iki renk olabilir. Sürücü tek tek renk kombinasyonundan geçer ve görüntüden seçim yapma seçeneğiniz olmasa da, bu otomatik olarak seçtiğiniz görüntünün bir renk şemasını üretecektir. İhracata basmak, görüntünüzü bilgisayarınızda PNG olarak kaydedecektir.
Bu, Instagram fotoğrafları yaparken de iyi bir şey olabilir. Örneğin, mimari bir stüdyo iseniz ve sosyal medya markanızı ayırt etmeye çalışırsanız, bir renk paleti bireyin işinden yapabilirsiniz. İşte Instagram’da yayınlanabilecek bir mutfak renk paleti örneği, sizi ayırt edecek Rakiplerinizden ve sosyal medyanızı yaratın Perspektif müşterileri tarafından hatırlamak daha kolaydır. Aşağıdaki galeride görüntülenen Coolörler tarafından sunulan birçok stil var.
Bu, Instagram fotoğrafları yaparken de iyi bir şey olabilir. Örneğin, mimari bir stüdyo iseniz ve sosyal medya markanızı ayırt etmeye çalışırsanız, bir renk paleti bireyin işinden yapabilirsiniz. İşte Instagram’da yayınlanabilecek bir mutfak renk paleti örneği, sizi ayırt edecek Rakiplerinizden ve sosyal medyanızı yaratın Perspektif müşterileri tarafından hatırlamak daha kolaydır. Aşağıdaki galeride görüntülenen Coolörler tarafından sunulan birçok stil var.
Bazıları gerçek kullanım için pratik değildir. Bence bu uygulama üreticisi sosyal medyada paylaşılmanızı sağlamayı planlıyor. Yaratıcı bir insansanız, bu fotoğraflarınızı diğer sosyal medya yayınlarından ayırmak için çok ilginç bir strateji olabilir. Sahip olduğunuz sonraki iki seçeneği anlayın/tekrarlayın, rengin yapımını iptal etme ve tekrarlama yeteneğidir. Bir grup renk şeması boyunca çok hızlı geçiş yaparsanız ve sevdiğiniz şemayı görürseniz, alanlara içgüdüsel olarak basabilir ve şemayı kaybedebilirsiniz. Geri Al düğmesini kullanmak önceki şemayı geri yükleyecektir. Oturum sırasında bu işlevle yaptığınız tüm şemalarda geri ve ileri geçebilirsiniz. Aynı şeyi yapmak için ok düğmesini de kullanabilirsiniz. Seçtiğiniz bir sonraki renk körlüğü, ana paletinizden 8 özel renk kör palet üretmenizi sağlayan renk kör bir cihazdır. Web sitenize yapmak isterseniz, renk kör olanlar tarafından erişilebilirse bu yararlı olabilir. Emin değilim, ama aynı zamanda düzenlemeler için kullanılacak harika bir araç olabilir.
Bu çok güçlü bir araçtır ve herkes tarafından kolayca anlaşılmasını sağlamaya çalışırsanız size gerçekten yardımcı olabilecek bir araçtır. Bunu web sitenizdeki renk şemasını kontrol etmek ve büyük değişiklikler yapmanız gerekip gerekmediğini görmek için de kullanabilirsiniz. Unutmayın, renk kör ayarlarının açık kalmasına izin verebileceğinizi unutmayın, bu da ana paletinizde herhangi bir değişiklik yaptığınızda veya herhangi bir değişiklik yaptığınızda her zaman renk körlüğü alt paletini otomatik olarak günceller. Palet Ayarlama Aracı Bir sonraki aracınız bir palet ayar cihazıdır. Bu, şemanızın tonunu, doygunluğunu, parlaklığını ve sıcaklığını değiştirmenizi sağlar. Renk kör cihazı gibi, bu soğutucular da doğrudan ana paletinize dayanan ikincil bir palet açacaktır. Herhangi bir değişiklik yaptığınızda, bu, ikincil bir palette görüntülenir, bu da onu birincisi ile karşılaştırmanızı kolaylaştırır. Birincil renk şemamıza sahip olduğumuzu görebilirsiniz ve sonra ikincil renk şemamız ne olacağını gösterir. 100’ün doygunluğunu artırıyoruz. Araçın sonuna kadar, renk paletinizi tamamen değiştirmenizi ve değiştirmenizi sağlıyor. Sonraki üç araç, paletlerinizi başkalarıyla görüntülemeye ve paylaşmaya adanmıştır. İlk opsiyon paletine bakın, palete bakın, yaptığınız renkler için tüm olasılıkları listeleyen bir açılır ekran oluşturur. Hex ve RGB A virgül gibi temel seçenekleri gösterir, ancak aynı zamanda ürettikleri renklere göre gerçek boyayı satın almaya çalışan iç tasarımcılara ve mimarlara büyük ölçüde yardımcı olabilecek daha az iyi bilinen seçenekler gösterir.
Copic, Prrismacolor, Pantone, Ral ve diğer birçok tanımlamayı alacaksınız, daha sonra renk tanımlaması gerektiren herhangi bir uygulamada kullanabileceğiniz tanımlar.Bir sonraki opsiyon paletinizin dışa aktarılması, renk şemalarını çeşitli formatlarda saklamanızı ve başkalarıyla paylaşmanızı kolaylaştırmanızı sağlayan dışa aktarma seçeneğidir. URL’yi dijital olarak gönderilecek şekilde kopyalayarak iyi olabilecek bir PDF üretebilirsiniz. Yazdırmak için PNG’yi bilgisayarınıza kaydedecek görüntüyü yapın (bu, bu blog yayınında kullanılacak bu araç tarafından üretilen renk paletlerini dışa aktarırken kullandığımız yöntemdir).SCSS seçeneği, CSS stilinde Web uygulamasında kullanılmak üzere stil sayfası üretecektir.
Bu bize gerçekten yardımcı olur (izotropik) çünkü başından beri yapmak yerine sadece kopyalayıp yapışırız. ASC seçeneği, Adobe Illustrator ve Photoshop’ta kullanılmak üzere paleti indirmenizi sağlar. Bu paleti içe aktarabilirsiniz ve ardından iki uygulamanın renk paletinde görüntülenir. Eğer bir grafik tasarımcıysanız, bu size gerçekten yardımcı olabilir. Ayrıca bunu SVG olarak dışa aktarma seçeneğiniz var. Last Coolors hesabına kaydedin, kaydetme seçeneği, bu bireysel renk şemasını Coolors uygulamasıyla oluşturduğunuz hesaba kaydetmenizi sağlayacaktır. Bunu, kullandığımız ancak kullanmadığımız renk şemasını saklamak için kullanıyoruz ve marka projeleri veya başka bir şey için yeni bir renk şeması gerektirdiğinde, hesabımızı açıp geçmişte oluşturduğumuz şemayı seçeceğiz. Renk jeneratörü için ana menünün sağındaki son Hamburger menü simgesi Coolörler, diğer kullanıcıların renk şemasını keşfetmek için kullanabileceğiniz yan bıçakları etkinleştirir veya hizmetle bir hesabınız varsa kendi renk şemanızı gözden geçirir. Kullanıcıların renk şemalarını toplulukla oluşturabilecekleri ve paylaşabilecekleri bu serinçlerin sosyal yönleri vardır. İyi tasarlanmış bir şema bulmak istiyorsanız, ancak kendiniz değiştirmek için zamanınız yoksa bu çok yararlı olabilir. Ve bitirdiğimizi düşündüğünüzde, bu uygulamadaki çubuk menüsündeki diğer menüler hakkında konuşalım. Coolors.co ile gradyanlar oluşturun
Bu, daha önce tartıştığımız üç şey yapmanıza olanak tanır, ancak daha karmaşık gradyan oluşturma araçlarına erişmenizi sağlar. Bir gradyan yapmayı seçerseniz, renk uygulaması, gradyan önizlemesini gerçek zamanlı olarak üretmek ve görmek için kullanabileceğiniz özel bir araç yükler. Bu çok güçlü ve web tasarımcılarında çok yararlı. Geçmişte, gradyanımızı üretmek için Adobe Photoshop’u kullanacağız, ancak bununla ilgili büyük zayıflık, CSS gradyan çıkışlarını çok kolay hale getirebilmenizdir. Bu araçla ana dışa aktarma seçeneğiniz CSS dışa aktarmadır.
Ayrıca, gradyanı Coolors.co platformundan bir resim olarak dışa aktarmayı, tam ekranda görmeyi veya hatta ekibinizdeki diğer kişilerle URL’leri kopyalayıp paylaşmayı seçebilirsiniz. Bu uygulamanın üstün bir özelliği olan bir palet jeneratörü gibi, topluluk tarafından yapılan gradyanı da keşfedebilirsiniz. Bence bu, kendi gradyanınızı yapmaya çalışmaktan daha kolay.
Bireysel gradyan üzerinde yüzmek, bunu yapan belirli renkleri görmenizi sağlar.
Contrast Sınavcı Solörler tarafından sunulan son araca kontrast denetçisi olarak adlandırılır. Bu araç, arka plan rengi ile yazı tipinin rengi arasındaki kontrastı kontrol etmenizi sağlar. Bu, erişilebilirlik kuralları ve düzenlemeleri ile Google erişilebilirliğinin sıralaması ve bu sıralamayı arama motorlarının yerleştirilmesinde kullanması nedeniyle çok önemlidir. Web sitenizin arka plan ve yazı tipi arasında yeterince kontrastı yoksa, ziyaretçilerinizin okuması zor olmayacak, ancak Google aslında web sitenizi cezalandırabilir çünkü bu, arama motorlarına daha düşük yerleştirerek. Bu size izin verecektir. Metnin rengini arka plan rengine eklemek için, iki rengin önizlemesini gerçek kelimelerle gösterir ve size kontrast puanı verir. En yüksek puan 10 civarında olacak ve siyah beyazdan gelecek. İşte arka plan rengi ile yazı tipinin rengi arasında kötü bir kontrast örneği:
Gördüğünüz gibi, bu herhangi bir web sitesinin erişilebilirliğini okumak ve zarar vermek acı vericidir. Bu kötü kontrast renk kombinasyonunu nasıl düzelteceğiniz konusunda otomatik olarak tavsiyelerde bulunmak için bu aracı kullanabilirsiniz. Her iki rengi girip değiştirebilir veya sadece bir rengi değiştirebilirsiniz. Bu örnekte, arka plan rengini ve yazı tipi rengini değiştirmeyi seçiyoruz. Çıktı budur:
