Panduan Cara Membuat Animasi Tulisan Berpuatar Mengelilingi Cursor

Cara Membuat Tulisan Mengikuti Cursor
Gb. Demo Tulisan Berputar

Sudah pernah lihat tulisan yang berputar-putar mengelilingi Cursor dan selalu mengikuti Cursor di blog blogger?

Tadi saya baru saja berkunjung ke salah satu blog teman yang menulis pesan di buku tamu, di sana saya melihat sebuah tulisan yang berputar-putar mengelilingi Cursor dan selalu mengikuti kemanapun arah cursor tersebut.

Setelah melihat itu saya jadi ingin untuk menuliskan caranya, siapa tahu ada yang ingin  menghias blog nya dengan tulisan berputar mengelilingi cursor blognya.

Panduan Cara Membuat Animasi Tulisan Berpuatar Mengelilingi Cursor

  1. Login ke dashboard blogger
  2. Klik Tata Letak
  3. Cara Membuat Tulisan Mengikuti Cursor
  4. Setelah itu klik Tambah Gadget
  5. Gadget Tulisan Mengikuti Cursor
  6. Pilih Gadget / Widget HTML/JavaScript
  7. Script Tulisan Mengikuti Cursor
  8. Klik Edit HTML
  9. Tutorial Panduan Membuat Tulisan Mengikuti Cursor
Kemudian masukkan semua script / kode tulisan mengikuti cursor berikut pada widget tadi.
<style type='text/css'>
/* Circle Text Styles */
#outerCircleText {
/* Optional - DO NOT SET FONT-SIZE HERE, SET IT IN THE SCRIPT */
font-style: italic;
font-weight: bold;
font-family: 'comic sans ms', verdana, arial;
color: #999;

/* End Optional */
/* Start Required - Do Not Edit */
position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
#outerCircleText div {position: relative;}
#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
/* End Required */
/* End Circle Text Styles */
</style>
<script type='text/javascript'>
//<![CDATA[
/* Circling text trail- Tim Tilton
Website: http://www.tempermedia.com/
Visit: http://www.dynamicdrive.com/ for Original Source and tons of scripts
Modified Here for more flexibility and modern browser support
Modifications as first seen in http://www.dynamicdrive.com/forums/
username:jscheuer1 - This notice must remain for legal use
*/
;(function(){
// Your message here (QUOTED STRING)
var msg = "A.R Blog (Blogger Tutorial)";
/* THE REST OF THE EDITABLE VALUES BELOW ARE ALL UNQUOTED NUMBERS */
// Set font's style size for calculating dimensions
// Set to number of desired pixels font size (decimal and negative numbers not allowed)
var size = 24;
// Set both to 1 for plain circle, set one of them to 2 for oval
// Other numbers & decimals can have interesting effects, keep these low (0 to 3)
var circleY = 0.75; var circleX = 2;
// The larger this divisor, the smaller the spaces between letters
// (decimals allowed, not negative numbers)
var letter_spacing = 5;
// The larger this multiplier, the bigger the circle/oval
// (decimals allowed, not negative numbers, some rounding is applied)
var diameter = 10;
// Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)
var rotation = 0.4;
// This is not the rotation speed, its the reaction speed, keep low!
// Set this to 1 or a decimal less than one (decimals allowed, not negative numbers)
var speed = 0.3;
////////////////////// Stop Editing //////////////////////
if (!window.addEventListener && !window.attachEvent || !document.createElement) return;
msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement : document.body,
mouse = function(e){
e = e || window.event;
ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
},
makecircle = function(){ // rotation/positioning
if(init.nopy){
o.style.top = (b || document.body).scrollTop + 'px';
o.style.left = (b || document.body).scrollLeft + 'px';
};
currStep -= rotation;
for (var d, i = n; i > -1; --i){ // makes the circle
d = document.getElementById('iemsg' + i).style;
d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) + 'px';
d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
};
},
drag = function(){ // makes the resistance
y[0] = Y[0] += (ymouse - Y[0]) * speed;
x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
for (var i = n; i > 0; --i){
y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
x[i] = X[i] += (x[i-1] - X[i]) * speed;
};
makecircle();
},
init = function(){ // appends message divs, & sets initial values for positioning arrays
if(!isNaN(window.pageYOffset)){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
} else init.nopy = true;
for (var d, i = n; i > -1; --i){
d = document.createElement('div'); d.id = 'iemsg' + i;
d.style.height = d.style.width = a + 'px';
d.appendChild(document.createTextNode(msg[i]));
oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
};
o.appendChild(oi); document.body.appendChild(o);
setInterval(drag, 25);
},
ascroll = function(){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
window.removeEventListener('scroll', ascroll, false);
};
o.id = 'outerCircleText'; o.style.fontSize = size + 'px';
if (window.addEventListener){
window.addEventListener('load', init, false);
document.addEventListener('mouseover', mouse, false);
document.addEventListener('mousemove', mouse, false);
if (/Apple/.test(navigator.vendor))
window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
window.attachEvent('onload', init);
document.attachEvent('onmousemove', mouse);
};
})();
//]]>
</script>
Keterangan :
// Your message here (QUOTED STRING)
var msg = "A.R Blog (Blogger Tutorial)";

silakah ganti tulisan A.R Blog (Blogger Tutorial) dengan tulisan yang anda inginkan, karena tulisan itulah yang nantinya akan berputar-putar mengeliligi cursor.

Bagaimana cara merubah warna tulisan yang mengikuti cursor tersebut ?

Karena ada beberapa teman kita yang menanyakan hal tersebut maka akan saya tuliskan caranya.

Silakan lihat pada bagian atas kode script tulisan mengikuti cursor tersebut, maka kamu akan menemukan kode
color: #999;
Silakan ganti #999 dengan kode warna lainnya yang kamu suka (ingat hanya kode #999  yang diganti). silakan temukan kode warna yang kamu suka di Daftar Kode Warna

Panduan Tutorial Cara Membuat Text Animasi atau Animasi Tulisan Berwarna

Pada artikel kali ini saya akan menuliskan panduan cara bikin teks flash (teks animasi flash / tulisan berwarna bergaya flash) yang nantinya bisa teman-teman pasang pada postingan blog (untuk mempercantik tulisan) atau di widget/sidebar (sebagai widget selamat datang yang keren).

Tutorial blog ini berbeda dengan Tutorial Cara Bikin Tulisan Kelap Kelip (Blink) yang sudah saya tuliskan dulu, karena tutorial cara membuat text animasi flash atau animasi tulisan berwarna ini menggunakan script sedangkan untuk membuat tulisan kelap kelip (Blink) tidak memerlukan script, hanya kode html saja.

Sebelum saya menuliskan panduan membuat text animasi flash atau animasi tulisan berwarna, saya akan memperlihatkan demonya dulu, agar teman-teman bisa melihat langsung bagaimana hasilnya nanti.


Demo Text Flash Animasi Berwarna / Tulisan Flash Animasi Berwarna
Selamat Datang Di Blog Ahmad Rifai Net
Nah itulah seperti itulah nanti penampakannya di blog teman. Next ...

Panduan Tutorial Cara Membuat Text Animasi atau Animasi Tulisan Berwarna

Untuk Di Pasang Pada Postingan Bagi teman-teman yang ingin memasukkan text flash animasi ini pada postingan silakan ikuti langkah berikut:
  1. Buat posting baru / Edit postingan yang sudah ada.
  2. Masukkan kode script Text / Tulisan Flash Animasi Berwarna di sana (kode ada di bawah). Sebelum memasukkan kode script pastikan teman memasukkannya di bagian Edit HTML bukan di Compose (lihat di sebelah kanan atas forum isian posting)
  3. Terbitkan Entri (boleh juga dipratinjau dulu)
Untuk Di Pasang Pada Widget Bagi teman-teman yang ingin memasukkan text flash animasi ini pada widget/sidebar silakan ikuti langkah berikut:
  1. Pergi ke Rancangan / Design
  2. Klik Tambah Gadget / Add Gadget
  3. Masukkan kode script Text / Tulisan Flash Animasi Berwarna di sana (kode ada di bawah)
  4. Simpan
Nah itulah langkah yang harus di lakukan.

Kode Script Text / Tulisan Flash Animasi Berwarna

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
<div style="-moz-box-shadow: inset 0 1px 5px 0 #fff; background: #990099; border: 1px solid #ECEDE8; box-shadow: inset 0 1px 5px 0 #555; font-family: Cataneo BT; font-size: 21px; font-weight: bolder; padding: 5px 20px; text-align: center;">
<script type="text/javascript">
var message="WELCOME TO AHMAD'S BLOG"
var bgsGR1color="#FFFFFF" /* Warna utama teks */
var bgsGR2color="#FFFF00" /* Warna teks flash pertama */
var bgsGR3color="#00FF66" /* Warna teks flash ke dua */
var flashspeed=100 // kec. ganti warna (1/1000 dt)
var flashingletters=15 // jumlah teks pertama (tips / hiting jumlah text, kemudian bagi 2)
var flashingletters2=18 // jumlah berwarna teks ke dua (tips / hiting jumlah text, kemudian bagi 2)
var flashpause=1 // waktu jeda pergantian warna (1/1000 dtk)
var n=0
if (document.all||document.getElementById){document.write('<font color="'+bgsGR1color+'">')
for (m=0;m<message.length;m++)
document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'</span>')
document.write('</font>')}else
document.write(message)
function crossref(number){var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)
return crossobj}function neon(){if (n==0){for (m=0;m<message.length;m++)
crossref(m).style.color=bgsGR1color}
crossref(n).style.color=bgsGR2color
if (n>flashingletters-1) crossref(n-flashingletters).style.color=bgsGR3color
if (n>(flashingletters+flashingletters2)-1) crossref(n-flashingletters-flashingletters2).style.color=bgsGR1color
if (n<message.length-1)
n++
else{n=0
clearInterval(flashing)
setTimeout("beginneon()",flashpause)
return}}
function beginneon(){if (document.all||document.getElementById)
flashing=setInterval("neon()",flashspeed)}
beginneon()
</script>
</div>
Catatan :
Ganti tulisan Selamat Datang Di Blog Ahmad Rifai Net yang ada di line 3 dengan tulisan yang teman mau. var flashingletters=19 - var flashingletters2=19 : pada link 8 & 9 . Ganti angka 19 dengan angka yang teman mau (Tips* hitung seluruh tulisan dan spasi yang teman masukkan pada line 3 (kode 1) atau line 5 (kode 2), kemudian bagi 2, setelah itu ganti angka 19 dengan hasil pembagian tadi.

〇 Membuat Efek Api Pada Text

Bismillahirrohmanirrohiim
Apa kabarnya sobat? Sebelumnya terimakasih mau mampir diblog sunyi ini,pada kesempatan ini saya mencoba mengingatkan kembali apakah pernah melihat gambar,logo atau nama yang mengeluarkan api? Pasti pernah atau sering melihatnya jika belum contoh DEMONYA (itu adalah site pertamaku mengenal dumay lewat xtgem) coba perhatikan dengan seksama dan dalam tempoh yang agak lama "wink gambar online tersebut mirip text shadow bukan? Cuma diberi efek bergerak pada api(shadownya) dan ketebalan pada textnya,sekarang gimana jika logo tersebut kita ubah menjadi javascript dan kita beri efek bergerak (query) jika ada yang mau mencoba ini scriptnya
<script src="http://ykubnay.googlecode.com/files/jquery.min.js" type="text/javascript"></script><script type="text/javascript">(function ($){$.fn.ignite = function (burn){$(this).each(function (){var letters = $(this).text().split('' );$(this).html('<span>' + letters.join('</span><span>' ) +'</span>' );$spans = $(this).find('span' );setInterval(function () {$spans.each(burn);}, 100);});}})(jQuery);function gasFlame(){var colors = ['#FFF', '#99f', '#CC0066', '#CC0033'];if (Math.random() > 0.90){colors.push('#3333CC' );}var hv = 0.04;var textShadows = [];var c = 0;var h = 0;var s = 0;while (c < colors.length){s = 2 + Math.round(Math.random() * 2);while (s--){shadow = '0 ' + h + 'em ' + -h + 'em ' + colors[c];textShadows.push(shadow);h -= hv;}c++;}$(this).css({color: colors[0], textShadow: textShadows.join(', ' )});}$(begin);function begin(){$('#mandra' ).ignite(gasFlame);}</script><style type="text/css">#mandra{font-size: 2em;line-height:2.50em;text-shadow:4px 2px 6px blue;color:#000;}
</style><div id="mandra">
text disini sunyinya malam lebih sunyi blog ini
</div>

Selamat mencoba ^_^

Cara Melihat Jumlah Pengunjung Yang Pernah Mengunjungi Blog Anda

           Salah satu pemberi semangat blogging adalah ketika melihat jumlah visitor yang online di blog saya seperti blog di hadapan anda ini. Alhamdulillah jumlah visitor terus bertambah seiring semakin banyak artikel yang saya tulis. Bukan GR. Tapi sebagai rasa syukur karena Allah telah memberikan kemampuan pada saya untuk menulis apa yang saya tahu dan saya alami.
Untuk mengetahui jumlah visitor atau pengunjung yang sedang online saat ini di blog anda, bisa memakai widget yang disediakan oleh web http://whos.amung.us Contohnya bisa dilihat di bagian bawah kanan blog ini. Widget berwarna merah dengan jumlah angka visitor yang sedang online.  Seperti ini nich

Untuk menampilkan widget jumlah visitor silahkan baca tutorialnya sebagai berikut :
1. Kunjungi web http://whos.amung.us
2. Memilih atau mengatur tata letak widget.
Di Sini anda bisa atur letak tampilannya. Mau diletakkan di side bar kanan, kanan tengah atau kanan bawah. Atau di kiri, kiri tengah, atau di kiri bawah. Silahkan pilih sesuai selera anda. Cara mengatur letaknya adalah tinggal arahkan pointer ke kolom bundar kecil yang ada di bawah pengaturan widget. Maka otomatis preview akan ditayangkan di sebelah kirinya.
4. Copy paste kode html yang telah tersedia ke blog anda. Caranya :
Untuk Blogspot
1. Login ke blogger.com
2. Tuju ke blog yang akan anda tambahkan lalu klik Rancangan/Tata Letak/Design
3. Klik Tambahkan Widget
4. Lalu klik HTML/JavaScript.
5. Masukkan/paste kode html yang telah anda copy tadi di area HTML lalu klik Save/Simpan.

Membuat Kotak Pencarian {SEARCH BOX} Di Blog

Seperti kita ketahui untuk mencari dokumen atau postingan yang ada di blog, kita bisa mengunakan kotak pencarian yang ada di Navbar, kotak navbar ini terletak di kiri atas.
ScreenHunter_03 Jan. 11 09.04

Sekarang ini lebih mudah lagi karena beberapa template sudah menyediakan kotak pencarian pada template tersebut. Misal pada template blog http://wawasan-blogging.blogspot.com/ ini, kalau kalian ingin mencari postingan, kalian bisa menggunkan kotak pencarian yang ada di sebelah kanan atas.
ScreenHunter_04 Jan. 11 09.04

Kalau di blog kita nggak ada, gimana dunk?Jangan takut karena kalau template kalian belum memiliki kotak pencarian atau ingin memasang kota pencariam, kalian bisa membuatnya sendiri, caranya, ikuti saja tips dibawah ini ok.
1. Log in ke blogger
2. Klik Layouts pada menu dashboard
3. Klik Add a gadget
4. Klik HTML/Javascript

5. Masukan kode dibawah ini
<form id="searchthis" action="http://namablogAnda.blogspot.com/search" style="display:inline;" method="get"> <input id="b-query" maxlength="255" name="q" size="20" type="text"/> <input id="b-searchbtn" value="Search" type="submit"/>
6. Ganti kode yang merah dengan nama blog kalian sendiri. Jangan lupa beri judul.
7. Kalian juga bisa mengubah ukuran kotak pencarian itu nya dengan mengedit size nya

8. Klik Save dan letakan di sidebar. 
9. Hasilnya akan seperti dibawah ini. 
ScreenHunter_05 Jan. 11 09.10 

Cara Membuat Energy Saving Mode Di Blog Dengan CSS3

      assalamualaikum sobat,

apa kabar kalian semua..mohon maaf kalo blog ini jarang di update.. :D
insya allah sekarang saya akan mengupdate nya terus, kali ini postingan saya membahas tentang blog lagi ni, yaitu Cara membuat energy saving Mode pada blog,
yang seperti tergambar pada blog saya,
energy saving mode ini di buat dengan CSS jadi tidak akan memberatkan blog sobat..


pingin blog sobat ada energy saving mode nya ??
ikutin aja langkah saya dibawah ini.. :D

nih screenshotnya :

jika mousenya bergerak ke halaman sobat :


  • 1. Login ke Blog sobat.
  • 2. Pilih menu design/Rancangan
  • 3. lalu klik Add gadget
  • 4. trus pilih HTML/javascript
5. Sekarang tinggal copy code dibawah ini:

<style type="text/css">body .saving{position: fixed;width: 100%;top: 0;left:0;height: 100%;opacity: 0.80;filter: alpha(opacity=80);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";background: #000;border-bottom: 3px solid transparent;z-index: 999999;-o-transition: all 3s ease-in-out 10s;-moz-transition: all 3s ease-in-out 10s;-webkit-transition: all 3s ease-in-out 10s;}body:hover .saving {opacity: 0.0;height:0.001%;filter: alpha(opacity=0);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";background:url(http://i1231.photobucket.com/albums/ee519/noochii/matrixt.gif);border-bottom: 5px solid #333;-o-transition: opacity 2s ease-in-out 2.5s, background-color 3s linear 0.5s, height 1s ease-in 1.8s;-moz-transition: opacity 2s ease-in-out 2.5s, background 3s linear 0.5s, height 1s ease-in 1.8s;-webkit-transition: opacity 2s ease-in-out 2.5s, background 3s linear 0.5s, height 1s ease-in 1.8s;}body .saving p.esm1{margin: 0;padding: 0;width: 92%;background: transparent;font-size: 100px;font-family: "Serif", Chiller;color: #FF0000;text-shadow: 0 0 2px #ccc, 0 -5px 4px #ff3, 2px -6px 6px #fd3, -2px -8px 9px #f40,   2px -10px 10px #f10;position: relative;margin-top: 200px;line-height: 20px;font-weight: bold;text-align: center;border: 30px solid transparent;border-radius: 20px;-moz-border-radius: 20px;-webkit-border-radius: 20px;-o-transition: -o-transform 5s ease-out 8s, background-color 4s ease-out 12s;-moz-transition: -moz-transform 5s ease-out 8s, background 4s ease-out 12s;-webkit-transition: -webkit-transform 5s ease-out 8s, background 4s ease-out 12s;}body:hover .saving p.esm1{font-size: 10px;color: red;width: 25%;margin: 340px 0 0 300px;padding: 25px;background: #aaa;border: 20px solid #888;border-radius: 170px;-moz-border-radius: 170px;-webkit-border-radius: 170px;-o-transform:translate(600px,-500px) rotate(360deg) scale(0.2);-moz-transform:translate(600px,-500px) rotate(360deg) scale(0.2);-webkit-transform:translate(600px,-500px) rotate(360deg) scale(0.2);-o-transition: font 1.1s 0.1s, width 1.3s 0.4s, margin-left 0.8s 1.2s, -o-transform 1.2s linear 1.5s, background-color 0.6s ease-in 0.6s, margin-top 1.2s ease-in 0.5s, border 3s ease-in;-moz-transition: font 1.1s 0.1s, width 1.3s 0.4s, margin-left 0.8s 1.2s, -moz-transform 1.2s linear 1.5s, background 0.6s ease-in 0.6s, margin-top 1.2s ease-in 0.5s, border 3s ease-in;-webkit-transition: font 1.1s 0.1s, width 1.7s 0s, margin-left 0.8s 1.2s, -webkit-transform 1.2s linear 1.5s, background 0.6s ease-in 0.6s, margin-top 1s ease-in 0.5s, border 3s ease-in, -webkit-border-radius 3s ease-in;}.saving p span.esm2{font-size: 18px;opacity: 0.5;filter: alpha(opacity=50);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";display: block;text-align: center;width: 300px;margin: -10px auto; font-weight: normal;padding: 2px 8px;background:url(http://i1231.photobucket.com/albums/ee519/noochii/matrixt.gif);border: 1px solid #333;border-radius: 0;-moz-border-radius: 0;-webkit-border-radius: 0;color: #0000FF;text-shadow: none;font-family: Chiller, Chiller, sans-serif;-o-transition: 1s ease-out;-moz-transition: 1s ease-out;-webkit-transition: 1s ease-out;}.saving:hover p span.esm2{font-size: 10px;width: 200px;padding: 0;}.saving p span.esm3{color: #ccc;font-family: "Tahoma", Arial, Helvetica;display: block;margin:10px auto;background:url(http://i1231.photobucket.com/albums/ee519/noochii/matrixt.gif) left center repeat-x;background: -moz-linear-gradient(top,#666,#111);background: -webkit-gradient(linear,0% top,0% bottom,from(#111),to(#666));opacity: 0.6;filter: alpha(opacity=60);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";width: 250px;text-shadow: 1px 1px 1px #000;border: 1px solid #333;border-radius: 4px;padding:2px 10px;-moz-border-radius: 4px;-webkit-border-radius: 4px;font-size: 12px;font-weight: normal;line-height: 16px;}.saving .by_Tejahtc {margin-left: 30px;text-align: center;color: #015828;font-size: 12px;font-weight: normal;position: absolute;bottom: 30px;width: 100%;height: 20px;left: 0;}.saving .by_Tejahtc span.esm4 {color: #aaa;font-style:italic;font-size:14px;font-weight:bold;text-transform:uppercase;}#recpost {width:210px;overflow: hidden;height: 327px;float: right;margin-top: 10px;padding: 4px 2px;background: transparent;border: 1px solid transparent;border-radius: 10px;-moz-border-radius: 10px;-webkit-border-radius: 10px;-o-transition: all 1.5s ease-out;-moz-transition: all 1.5s ease-out;-webkit-transition: all 1.5s ease-out;}</style>

<div class='saving'>
<p class='esm1'>AHMAD'S BLOG<br/>
<br/><br/>
<span class='esm3'>.:ENERGY SAVING MODE:.<br/>http://wawasan-blogging.blogspot.com/</span></p>
<div class='noochii'>
</div></div>


Keterangan : Tulisan yang berwarna Hijau ganti dengan kata" sobat.. dan tulisan yang berwarna Merah adalah URL gambar nya. sobat ganti dengan gambar sobat sendiri.

  • Lalu di save dan lihat hasil nya di blog sobat.. :D
Terima kasih.. :D

Sumber : http://www.cah-indramayu.com/

AKATSUKI TEAM'S

Akatsuki

Akatsuki

Akatsuki (暁 , “Fajar”) beranggotakan 10 orang kriminal kelas S yang ditakuti karena kekuatan dan tabiat mereka yang buruk. Syarat keanggotaan mereka masih belum diketahui secara jelas. Tapi yang pasti, mereka semua mempunyai Kekkei genkai atau setara dengan Kekkei genkai yang unik dan mengerikan dan menakutkan.
Tujuan dan visi Akatsuki juga masih belum jelas. Tetapi mereka punya ketertarikan besar terhadap Bijuu —hewan legendaris yang mempunyai chakra yang amat besar yang tidak seorang pun dapat mengendalikannya.

Madara Uchiha (Tobi)

Tobi (トビ?) merupakan Madara Uchiha, salah satu pendiri Konoha. Banyak yang mengira bahwa dia telah dibunuh oleh Hokage Pertama di Lembah Akhir, tapi ia hanya luka parah dan menggunakan Ninjutsu ruang dan waktu untuk melarikan diri. Dalam pertarungan Deidara melawan Sasuke, Tobi terperangkap dalam ledakan bunuh diri Deidara. Kemudian Zetsu menduga bahwa Tobi telah mati dalam ledakan tersebut. Tidak seperti kebanyakan ninja pada umumnya, Tobi tidak menggunakan pelindung kepala sehingga desa asalnya masih belum diketahui, sampai Ia mengungkap identitasnya sendiri setelah kematian Deidara, bahwa ia adalah ninja pelarian Konohagakure. Ia memakai topeng aneh yang menutupi seluruh wajahnya, sehingga hanya mata kanannya saja yang terlihat, yang kemudian diketahui adalah Sharingan. Anggota Akatsuki yang lain sangat berdedikasi dan serius, sedangkan Tobi lebih santai dan agak konyol.

Zetsu

Zetsu (ゼツ?) adalah seorang ninja pelarian misterius. Tidak banyak yang diketahui tentang dia, selain kesetiaannya kepada Akatsuki dan fungsinya sebagai seorang mata-mata. Kepalanya diselubungi oleh semacam tudung seperti tanaman Venus penangkap lalat yang besar, yang juga membungkus tubuhnya. Bagian kanan dari wajah dan tubuhnya berwarna hitam, sedangkan di bagian kiri berwarna putih. Kedua bagian tersebut juga sering berbicara satu sama lain, dan kadang-kadang juga memiliki pendapat yang berbeda. Zetsu sering kali menggunakan 蛭万象・防火の術 (Hiru Banshō: Bōka no Jutsu?), yang membuatnya bisa bersatu dengan tanah, pohon, dan tumbuhan yang lain untuk perjalanan jarak jauh dengan cepat.

 

Pain

Pain (ペイン?) adalah Ketua Akatsuki dan merupakan seorang ninja pelarian yang berasal dari Amegakure. Tak ada satupun anggota Akatsuki, selain Konan yang memanggilnya dengan namanya tetapi hanya menggunakan kata “pemimpin” saja, dan wajahnya sangatlah jarang diperlihatkan. Dia memiliki kehormatan paling besar di antara rekan-rekannya (pengecualian untuk Hidan yang termasuk anggota baru) dan dialah yang mengarahkan aksi-aksi mereka. Dia jugalah yang menciptakan jutsu untuk mengeluarkan monster berekor (Bijuu) dari Jinchuuriki. Dia juga bisa menggunakan “teknik pengubah bentuk” (象転の術 Shōten no Jutsu?) yang dapat menduplikasikan rekan-rekannya dengan menggunakan korban manusia, menjadikan mereka dapat melawan musuh tanpa melukai dirinya. Hasil duplikasi ini sangatlah mirip dengan aslinya, bahkan bisa memiliki kekkei genkai dan senjata khusus seperti yang asli. Kemampuannya seimbang dengan jumlah chakra yang diberikan kepada masing-masing hasil duplikasi ini. Ketika tiba saatnya berkumpul, Pain dapat memanggil rekan-rekannya bahkan dari tempat yang sangat jauh dengan menggunakan telepati.
Kematiannya Pain karena menggunakan jurus terlarang yaitu menghidupkan orang-orang konoha yang sudah ia bunuh.

Konan

Konan (小南?) merupakan satu-satunya anggota perempuan dalam organisasi Akatsuki. Ia memiliki rambut berwarna biru dengan tambahan aksesoris bunga kertas, tetapi dari semua itu, anggota ini masih menyisahkan banyak misteri. Namun, di ketahui bahwa sewaktu kecil, Konan mempunyai hobi membuat origami dan di kenal sebagai gadis yang peramah. Konan memiliki kemampuan untuk memisahkan dirinya menjadi berlembar-lembar kertas yang dapat berubah bentuk menjadi origami kupu-kupu. Namun ninjutsu itu tidak berhasil jika tubuh Konan dibasahi dengan zat cair. Baru diketahui bahwa Konan adalah bekas anak didik Jiraiya saat dia dan kedua sannin yang lain menghadapi perang dengan Amegakure. Disebutkan di komik naruto vol.48 Konan merupakan teman Nagato dan Yahiko yang merupakan korban perang dari 3 desa shinobi yang sudah besar(Iwa,Konoha dan Suna) Konan menolong Nagato,saat Nagato hampir mati kelaparan,kemudian Konan menjadi anggota organisasi Amegakure yang diketuai oleh Yahiko.
Konan mati dibunuh oleh Tobi.

Kisame Hoshigaki

Kisame Hoshigaki (干柿鬼鮫 Hoshigaki Kisame?) adalah seorang ninja pelarian dari Kirigakure dan partnernya Itachi Uchiha Kisame memiliki penampilan khusus yang menyerupai ikan hiu, lengkap dengan kulit berwarna biru pucat dengan mata yang kecil, serta memiliki struktur muka yang menyerupai insang dan gigi berbentuk segitiga tajam. Sama seperti namanya, Kisame (鬼鮫), yang berarti “ikan hiu iblis”. Meskipun penampilannya yang agak kasar dan kecintaannya dalam bertarung, gaya bicara Kisame tenang dan memiliki sopan santun jika dibandingkan dengan kebanyakan anggota Akatsuki yang lain. Kisame merupakan salah satu dari Seven Swordsmen of the Mist (霧の忍刀七人衆 Kiri no Shinobigatana Shichinin Shū?) dan juga dikenal sebagai kaijin (怪人?) dari Kirigakure.
Kisame mati bunuh diri ketika informasi tentang Mizukage yang (diduga) ada hubungannya dengan Tobi nyaris bocor.

Deidara

Deidara (デイダラ?) adalah seorang ninja pelarian dari Iwagakure. Deidara menghubungkan ninjutsunya sebagai seni dan meyakini bahwa setiap bom yang dibuatnya merupakan suatu hasil karya seni. Motonya ialah Seni adalah sebuah ledakan yang merupakan ungkapan asli dari seniman abstrak terkenal Jepang. Deidara sangat bangga dengan seninya dan secara langsung dengan segan menerima bahwa apapun tidak dapat menghancurkan seninya, mengakibatkan ia seringkali menjadi terlalu percaya diri dalam pertarungan. Deidara juga mempunyai kebiasaan untuk mengakhiri kalimatnya dengan bergumam un atau hmm, seperti Naruto yang hampir selalu mengakhiri kalimatnya dengan -ttebayo. Dalam pertarungan, Deidara menggunakan mulut khusus di kedua telapak tangannya untuk menciptakan “bahan peledak tanah liat”.
Deidara mati bunuh diri dengan meledakkan tubuhnya dalam pertarungan melawan sasuke.

Hidan

Hidan (飛段?) adalah anggota kedua terbaru yang suka bicara kotor dan partnernya Kakuzu. Ia adalah seorang penganut agama bernama ‘Jashin’, sebuah kepercayaan yang menyembah Dewa Jashin dan apapun yang tidak meghasilkan pengrusakan dianggap sebagai dosa. Sebagai bagian dari agamanya, Hidan memiliki sebuah jimat berbentuk segitiga terbalik di dalam lingkaran. Sebelum pertarungan dimulai, ia berdoa pada jimat ini, meminta pengampunan dan juga agar targetnya harus ditangkap hidup-hidup. Setelah pertarungan dimulai, Hidan sangat tidak suka jika pertarungannya di interupsi atau dipaksa untuk berhenti. Setelah bertarung, ia melakukan ritual 30 menit sesuai dengan kepercayaannya, yang memuncak dengan menikam dirinya sendiri di dada dan berbaring di atas tanah.
Hidan rupanya tidak bisa mati. Ia masih memiliki kemampuan untuk berbicara serta dapat bertahan hidup walaupun berada dalam kondisi sekarat dengan dipenuhi banyak luka, serta lehernya terpenggal. Meskipun ia dapat hidup dalam bagian yang terpotong, Hidan harus terhubung dengan tubuhnya agar bisa dikendalikan. Walaupun kenyataannya ia tidak bisa mati, Hidan menyatakan secara terbuka sebelum pertarungan bahwa ia mengharapkan dapat dibunuh oleh lawannya. Dalam pertarungan, Hidan memegang sabit besar bermata tiga yang digunakan sebagai sebuah proyektil yang dikendalikan dengan sebuah tali yang membungkus pergelangan tangannya. Walaupun ia mampu untuk menyerang ninja paling berbakat dengan senjatanya, Hidan mengklaim bahwa sabitnya membuat dia menjadi penyerang terlambat dalam Akatsuki. Tiga mata sabit besarnya tidak dimaksudkan untuk meningkatkan kerusakan dari serangannya, melainkan untuk meningkatkan kesempatannya untuk mengambil darah musuhnya.
Hidan mati karena Shikamaru telah meledakannya di sebuah lubang yang telah dibuat oleh Shikamaru di The Will of Fire, sebuah Hutan. Sehingga, kepala nya putus. Sebenarnya, Hidan belum mati, ia hanya terkubur saja di dalam lubang itu. Hidan kan tidak bisa mati. Namun, Akatsuki telah melupakan Hidan dan menganggap Hidan bukan lagi anggota Akatsuki.

Kakuzu

Kakuzu (角都?) adalah seorang ninja pelarian dari Takigakure dan partnernya Hidan. Kakuzu adalah seorang individu yang rakus, mengutamakan seberapa berharga suatu benda, dan selalu hanya bergantung untuk mencari uang. Penghasilan favorit Kakuzu ialah mengumpulkan hadiah selama menjalankan misinya., bahkan bersama-sama dengan agama Hidan membuatnya lebih cepat untuk mengoleksi hadiah-hadiah tersebut. Sejarahnya sebagai pemburu hadiah telah berjalan lama, dan ia sudah terbiasa dengan syarat-syarat sebagai pengoleksi bahkan telah menghafal informasi serta hadiah yang akan diberikan setelah menangkap target tersebut. Pandangan tentang uang ini mengakibatkan Kakuzu menjuluki dirinya sebagai “Bendahara Akatsuki”, meskipun tidak diketahui apakah ini merupakan posisi yang sebenarnya.
Kakuzu memiliki struktur tubuh khusus yang terdiri dari banyak benang hitam tajam yang melalui seluruh tubuhnya, yang dapat digunakan untuk memisahkan bagian tubuhnya untuk serangan jarak jauh. Benang-benang ini dapat digunakan juga untuk menyerang dan menusuk tubuh lawannya. Benang-benang ini rupanya terbatas dan digunakan Kakuzu untuk mengubah penampilannya dan secara visual dapat meningkatkan ukuran tubuhnya. Benang-benang Kakuzu juga memungkinkan ia untuk memasukan organ asing yang lain ke dalam tubuhnya, serta dapat memperpanjang hidupnya selamanya dengan mengambil organ sehat orang lain.
Kakuzu dikalah atau mati oleh Naruto dengan cara meRasengan Kakuzu. Setelah itu ia berakhir ditangan Kakashi.

Sasori

Sasori (サソリ?), juga dikenal sebagai Sasori si pasir merah (赤砂のサソリ Akasuna no Sasori?), adalah seorang ninja pelarian yang berasal dari Sunagakure. Setelah kematian kedua orangtuanya, Sasori dibesarkan oleh neneknya, Chiyo, yang mengajarnya segala sesuatu tentang boneka. Setelah teruji mahir dengan kemampuannya, Sasori menggunakan pengtahuan barunya itu untuk mengubah tubuh kedua orangtuanya menjadi boneka dengan usaha agar bisa dicintai. Karena mereka hanyalah boneka tanpa emosi, karya ini menjadi gagal, dan ia meninggalkan Sunagakure selama dua puluh tahun sampai ia diperkenalkan. Suatu waktu setelah meninggalkan desanya, Sasori bergabung dengan Akatsuki dan akhirnya berpasangan dengan Orochomaru. Setelah Orochimaru meninggalkan Akatsuki, Sasori berpasangan dengan Deidara, meskipun dendamnya terhadap Orochimaru selalu dibawanya.
Dalam kemitraannya dengan Deidara, keduanya sering berdebat, khususnya tentang pertentangan pandangan mereka dalam seni. Deidara beranggapan bahwa seni itu adalah sesuatu yang cepat hilang, sementara Sasori meyakini bahwa seni yang bagus adalah sesuatu yang indah yang bisa bertahan lama sampai ke masa depan. Ini mencerminkan sifat dasar individu mereka (Deidara membuat pahatan tanah liat yang bisa meledak, Sasori membuat boneka-boneka manusia yang bisa bertahan lama).
Sasori mati oleh Sakura dan Chiyo dengan cara menusuk jantung Sasori dengan boneka kedua orangtuanya.

Orochimaru

Orochimaru (大蛇丸?) adalah seorang mantan anggota Akatsuki, yang sebelumnya berpasangan dengan Sasori. Ia menggunakan teknik Fushi Tensei (大蛇丸?) berusaha untuk mencuri tubuh dari Itachi Uchiha, tetapi berhasil digagalkan Itachi dengan melumpuhkannya dan memotong tangan kirinya. Setelah kejadian ini, Orochimaru meninggalkan Akatsuki, dengan tetap membawa cincin Akatsuki yang masih tertinggal di tangan dari tubuh aslinya. Orochimaru berniat untuk mengeliminasi Akatsuki, walaupun ia dianggap telah mati. Apapun hubungan yang tersisa antara Orochimaru dan Akatsuki, kelihatan mirip dalam waktu bekerja, di mana Orochimaru mempersiapkan waktu selama tiga tahun untuk mengambil tubuh Sasuke dan Akatsuki dalam mengangkap semua siluman berekor. Tapi pada akhirnya sasuke membunuh orochimaru, dan jasad orochimaru yang telah mati diambil kabuto yakushi dan di transplantasikan ketubuhnya sendiri, sehingga dia memiliki kemampuan seperti orochimaru.
Orochimaru yang dianggap semua orang telah mati ditangan sasuke, sebenarnya dia bersembunyi di dalam tubuh sasuke, dan dia keluar ketika pertarungan hebat antara itachi dan sasuke, lalu itachi membunuhnya, dengan jurus susanoo.

Itachi Uchiha

Itachi Uchiha (うちは イタチ Uchiha Itachi?) adalah seorang ninja pelarian yang berasal dari Konohagakure, partnernya adalah Kisame Hoshigaki, dan merupakan anggota Akatsuki pertama yang diperkenalkan. Itachi adalah salah satu dari Klan Uchiha yang tersisa, yang lainnya adalah adiknya Sasuke Uchiha dan Madara Uchiha (yang dikenal juga Sebagai Tobi). Ia bertanggungjawab atas beberapa peristiwa dalam serial ini, seperti pembantaian Klan Uchiha dan keluarnya Orochimaru dari Akatsuki. Itachi telah membuka serta menguasai misteri dari Sharingan dan Mangekyou Sharingan. Ia juga adalah seorang ahli yang luar biasa dalam ninjutsu dan genjutsu. Sasaran bijuu Itachi adalah Siluman rubah berekor sembilan. Sedangkan Itachi Uchiha mati bukan karena dibunuh oleh Sasuke.
Melainkan mati karena sudah kehabisan tenaga dan sudah menderita penyakit parah karena terlalu banyak melatih jurus-jurusnya sejak menjadi ninja saat dikonoha hingga menjadi anggota akatsuki.