Color System

LegalTech renk paleti ve kullanım kılavuzu

Figma Renkleri

Main Color

#064232

Ana Renk

Secondary Color

#DDF4E7

Yardımcı Renk

#88C273

Yardımcı Renk

#DDF6D2

Yardımcı Renk

Kullanım Örnekleri

Buttons

Renk Örnekleri

#064232

Main Color

#DDF4E7

Secondary 1

#88C273

Secondary 2

#DDF6D2

Secondary 3

Kod Örnekleri

TypeScript

import { colors } from '@/lib/colors';

// Main color
const mainColor = colors.main; // #064232

// Secondary colors
const secondary1 = colors.secondary.light1; // #DDF4E7
const secondary2 = colors.secondary.light2; // #88C273
const secondary3 = colors.secondary.light3; // #DDF6D2

// Tailwind CSS classes
<div className="bg-main">...</div>
<div className="text-main">...</div>
<div className="border-main">...</div>
<div className="bg-secondary-light1">...</div>
<div className="bg-secondary-light2">...</div>
<div className="bg-secondary-light3">...</div>

Inline Style

// Tailwind CSS classes
<button className="bg-main text-white">
  Button
</button>

// Border
<div className="border-2 border-main">
  Content
</div>

// Text color
<p className="text-main">Text</p>

// Background
<div className="bg-secondary-light1">
  Content
</div>