Giriş yapmadınız.

Sıradan Saatlerden Sıkılanlar İçin: Başka Yerde Yok! Özel Tasarım Metalik Gold Saat

Seyyah20

Orta Düzey

  • "Seyyah20" bir erkek
  • Konuyu başlatan "Seyyah20"

Mesajlar: 321

Kayıt tarihi: Jan 26th 2014

Konum: DENİZLİ/Gönlünüze ektiğiniz her güzellik, bir gün size bereketli bir hasat olarak dönecektir.

  • 1023
  • Özel mesaj gönder

1

Wednesday, 14.01.2026, 15:43

Sıradan Saatlerden Sıkılanlar İçin: Başka Yerde Yok! Özel Tasarım Metalik Gold Saat

Merhaba Allaturkaa Üyeleri ve Ziyaretçiler,

Bugün sizlerle, özel bir saat modelini paylaşmak istiyorum. Standart basit modellerin aksine, bu tasarımı hem ağır hem de lüks bir görünüm kazandırmak için metalik altın (gold) efektleri ve derinlikli bir kadranla süsledim.

Bu saat tamamen ücretsiz ve reklamsızdır. Hiçbir dış görsele veya linke bağlı olmadığı için sayfanızın açılış hızını etkilemez. Şık ve profesyonel yapısı sayesinde ister kişisel sayfalarınızda, ister yarı resmi veya kurumsal sitelerinizde gönül rahatlığıyla kullanabilirsiniz.

Saatin Öne Çıkan Özellikleri ve Özelleştirme
Saatin her detayını kodlar üzerinden dilediğiniz gibi değiştirebilirsiniz. İşte yapabileceğiniz bazı düzenlemeler:

Boyut Ayarı: Saati büyütmek veya küçültmek isterseniz, CSS kısmındaki .premium-clock-gold sınıfındaki width: 300px; ve height: 300px; değerlerini değiştirmeniz yeterlidir.

İsim Değiştirme: Saatin içindeki yazıyı değiştirmek için kodun ortalarındaki <div class="clock-brand-gold">ALLATURKAA FORUM</div> kısmına kendi site adınızı yazabilirsiniz.


Renk Paleti: Mevcut model Altın Kaplama üzerinedir. Eğer gümüş bir görünüm isterseniz renk kodlarını gri tonlarıyla güncelleyebilirsiniz.

Sistem Uyumu: Saf HTML/CSS/JS ile yazılmıştır. Blogger, WordPress veya özel yazılım fark etmeksizin tüm sistemlere %100 uyumludur.


ALTIN RENKLİ SAAT KODLARI

HTML

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141

<style>
/* ================== GOLD PREMIUM ANALOG SAAT ================== */
.premium-clock-gold {
  position: relative;
  width: 300px;
  height: 300px;
  margin: 30px auto;
  background: radial-gradient(circle, #2c3e50, #000); /* Derinlik veren kadran */
  border-radius: 50%;
  /* Gerçek altın çerçeve efekti */
  border: 10px solid #d4af37;
  outline: 2px solid #f9d976;
  box-shadow: 
    0 15px 35px rgba(0,0,0,0.5), 
    inset 0 0 15px rgba(0,0,0,0.8),
    0 0 10px rgba(212, 175, 55, 0.3);
}

/* Orta Göbek - Altın Varaklı */
.premium-clock-gold::after {
  content: '';
  position: absolute;
  width: 14px;
  height: 14px;
  background: linear-gradient(135deg, #f9d976 0%, #d4af37 50%, #b8860b 100%);
  border-radius: 50%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 100;
  box-shadow: 0 2px 5px rgba(0,0,0,0.8);
}

/* Forum Yazısı - Altın Rengi */
.clock-brand-gold {
  position: absolute;
  width: 100%;
  top: 65%;
  text-align: center;
  font-family: 'Georgia', serif;
  font-size: 13px;
  color: #d4af37;
  letter-spacing: 2px;
  opacity: 0.8;
  text-shadow: 1px 1px 2px #000;
}

/* Rakamlar - Parlak Altın */
.clock-num-gold {
  position: absolute;
  width: 100%;
  height: 100%;
  text-align: center;
  font-family: 'Arial', sans-serif;
  font-size: 22px;
  font-weight: bold;
  color: #f9d976; /* Parlak altın rengi */
  padding: 15px;
  box-sizing: border-box;
  transform: rotate(calc(var(--i) * 30deg));
  text-shadow: 1px 1px 2px #000;
}
.clock-num-gold span {
  display: inline-block;
  transform: rotate(calc(var(--i) * -30deg));
}

/* Altın İbreler */
.g-hand {
  position: absolute;
  bottom: 50%;
  left: 50%;
  transform-origin: bottom;
  border-radius: 4px;
  /* İbrelere metalik geçiş efekti */
  background: linear-gradient(to top, #b8860b, #f9d976);
  box-shadow: 1px 1px 3px rgba(0,0,0,0.5);
}

#g-hour {
  width: 7px;
  height: 70px;
  margin-left: -3.5px;
  z-index: 5;
}

#g-min {
  width: 4px;
  height: 105px;
  margin-left: -2px;
  z-index: 6;
}

#g-sec {
  width: 2px;
  height: 125px;
  background: #ff4d4d; /* Saniye yine netlik için kırmızı kalsın */
  margin-left: -1px;
  z-index: 7;
}
</style>

<div class="premium-clock-gold">
  <div class="clock-brand-gold">ALLATURKAA FORUM</div>
  
  <div class="clock-num-gold" style="--i:1"><span>1</span></div>
  <div class="clock-num-gold" style="--i:2"><span>2</span></div>
  <div class="clock-num-gold" style="--i:3"><span>3</span></div>
  <div class="clock-num-gold" style="--i:4"><span>4</span></div>
  <div class="clock-num-gold" style="--i:5"><span>5</span></div>
  <div class="clock-num-gold" style="--i:6"><span>6</span></div>
  <div class="clock-num-gold" style="--i:7"><span>7</span></div>
  <div class="clock-num-gold" style="--i:8"><span>8</span></div>
  <div class="clock-num-gold" style="--i:9"><span>9</span></div>
  <div class="clock-num-gold" style="--i:10"><span>10</span></div>
  <div class="clock-num-gold" style="--i:11"><span>11</span></div>
  <div class="clock-num-gold" style="--i:12"><span>12</span></div>

  <div class="g-hand" id="g-hour"></div>
  <div class="g-hand" id="g-min"></div>
  <div class="g-hand" id="g-sec"></div>
</div>

<script>
function runGoldClock() {
  const now = new Date();
  const h = now.getHours() % 12;
  const m = now.getMinutes();
  const s = now.getSeconds();

  const hDeg = (h * 30) + (m / 2);
  const mDeg = (m * 6) + (s / 10);
  const sDeg = s * 6;

  document.getElementById('g-hour').style.transform = `rotate(${hDeg}deg)`;
  document.getElementById('g-min').style.transform = `rotate(${mDeg}deg)`;
  document.getElementById('g-sec').style.transform = `rotate(${sDeg}deg)`;
}
setInterval(runGoldClock, 1000);
runGoldClock();
</script>

----------------------------------------------

GÜMÜŞ RENKLİ SAAT KODLARI

HTML

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147

<style>
/* ================== PREMIUM ANALOG SAAT ================== */
.premium-clock {
  position: relative;
  width: 300px;
  height: 300px;
  margin: 30px auto;
  background: #2c3e50; /* Koyu füme kadran - her zeminde görünür */
  border-radius: 50%;
  border: 10px solid #bdc3c7; /* Gümüş çerçeve */
  box-shadow: 0 10px 25px rgba(0,0,0,0.3), inset 0 0 20px rgba(0,0,0,0.5);
}

/* Orta Göbek */
.premium-clock::after {
  content: '';
  position: absolute;
  width: 14px;
  height: 14px;
  background: #ecf0f1;
  border-radius: 50%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 100;
  box-shadow: 0 2px 5px rgba(0,0,0,0.5);
}

/* Forum Yazısı */
.clock-brand {
  position: absolute;
  width: 100%;
  top: 65%;
  text-align: center;
  font-family: 'Georgia', serif;
  font-size: 14px;
  color: #bdc3c7;
  letter-spacing: 1px;
  opacity: 0.7;
}

/* Seyyah Yazısı */
.clock-brands {
  position: absolute;
  width: 100%;
  top: 75%;
  text-align: center;
  font-family: 'Georgia', serif;
  font-size: 14px;
  color: #bdc3c7;
  letter-spacing: 1px;
  opacity: 0.7;
}

/* Rakamlar - Her zeminde okunması için beyaz/gümüş */
.clock-num {
  position: absolute;
  width: 100%;
  height: 100%;
  text-align: center;
  font-family: 'Arial', sans-serif;
  font-size: 22px;
  font-weight: bold;
  color: #ecf0f1;
  padding: 15px;
  box-sizing: border-box;
  transform: rotate(calc(var(--i) * 30deg));
}
.clock-num span {
  display: inline-block;
  transform: rotate(calc(var(--i) * -30deg));
}

/* İbreler */
.p-hand {
  position: absolute;
  bottom: 50%;
  left: 50%;
  transform-origin: bottom;
  border-radius: 4px;
}

#p-hour {
  width: 6px;
  height: 70px;
  background: #ecf0f1;
  margin-left: -3px;
  z-index: 5;
}

#p-min {
  width: 4px;
  height: 100px;
  background: #bdc3c7;
  margin-left: -2px;
  z-index: 6;
}

#p-sec {
  width: 2px;
  height: 120px;
  background: #e74c3c; /* Saniye ibresi dikkat çekici kırmızı */
  margin-left: -1px;
  z-index: 7;
}
</style>

<div class="premium-clock">
  <div class="clock-brand">ALLATURKAA</div>
  <div class="clock-brands">Seyyah</div>
  
  <div class="clock-num" style="--i:1"><span>1</span></div>
  <div class="clock-num" style="--i:2"><span>2</span></div>
  <div class="clock-num" style="--i:3"><span>3</span></div>
  <div class="clock-num" style="--i:4"><span>4</span></div>
  <div class="clock-num" style="--i:5"><span>5</span></div>
  <div class="clock-num" style="--i:6"><span>6</span></div>
  <div class="clock-num" style="--i:7"><span>7</span></div>
  <div class="clock-num" style="--i:8"><span>8</span></div>
  <div class="clock-num" style="--i:9"><span>9</span></div>
  <div class="clock-num" style="--i:10"><span>10</span></div>
  <div class="clock-num" style="--i:11"><span>11</span></div>
  <div class="clock-num" style="--i:12"><span>12</span></div>

  <div class="p-hand" id="p-hour"></div>
  <div class="p-hand" id="p-min"></div>
  <div class="p-hand" id="p-sec"></div>
</div>

<script>
function runPremiumClock() {
  const now = new Date();
  const h = now.getHours() % 12;
  const m = now.getMinutes();
  const s = now.getSeconds();

  const hDeg = (h * 30) + (m / 2);
  const mDeg = (m * 6) + (s / 10);
  const sDeg = s * 6;

  document.getElementById('p-hour').style.transform = `rotate(${hDeg}deg)`;
  document.getElementById('p-min').style.transform = `rotate(${mDeg}deg)`;
  document.getElementById('p-sec').style.transform = `rotate(${sDeg}deg)`;
}
setInterval(runPremiumClock, 1000);
runPremiumClock();
</script>



Zaman, paha biçilemez bir hazinedir; onu kiminle ve nerede tükettiğiniz ise hayatınızın kalitesini belirler.

Umarım bu küçük hediye, sayfalarınıza şıklık ve değer katar. Keyifli paylaşımlar dilerim!
Seyyah20 belirtilen resmi ekledi:
  • Altın-Saat.png
  • Gümüş-Saat.png

Bu mesaj 1 defa düzenlendi, son düzenlemeyi yapan "Seyyah20" (14.01.2026, 15:49)

Benzer konular