---
title: Renkler
description: Temanız için CSS değişkeni olarak kullanılabilen, özelleştirilebilir global renkler tanımlayın.
---

<Callout type="warn" title="Eski altyapı">
Bu sayfa, ikas Studio öncesindeki headless tema altyapısını anlatır. Yeni temalar için [ikas Studio](https://builders.ikas.com/docs/ikas-studio) dokümantasyonunu kullanın.
</Callout>

Renkler bölümü, temanız için global renkler tanımlamanızı sağlar. Bu renklerle temanız için özelleştirilebilir bir renk şeması oluşturabilirsiniz. Renkler otomatik olarak birer [CSS değişkeni](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties) olarak tanımlanır, böylece stillerinizde kolayca kullanabilirsiniz.

Renk koduna TypeScript tarafında erişmeniz gerekirse, değer component'lerinize `settings` prop'u içinde iletilir. `settings` nesnesi, [IkasThemeJsonSettings](https://builders.ikas.com/docs/headless-theme/api/theme-and-common#ikas-theme-json-settings) sınıfının bir örneğidir. İhtiyacınız olan rengi, verdiğiniz CSS anahtarıyla bu sınıfın `colors` dizisinde bulabilirsiniz.

<iframe src="https://demo.arcade.software/8LrNhciUM3T161h4mXCj?embed" title="Global renk tanımlama" loading="lazy" allowFullScreen style={{ width: '100%', aspectRatio: '16 / 9', border: 0, borderRadius: 12 }} />