35 lebih banyak efek teks CSS untuk situs web Anda

Efek meledak

Kami telah menerbitkan beberapa minggu yang lalu serangkaian efek teks CSS untuk meningkatkan penyajian judul H2 dari produk atau tajuk entri layanan yang dijual di situs web pelanggan. Efek teks CSS yang mampu memberikan titik kualitas yang kami cari untuk mengesankan klien dan yang mereka miliki dalam portofolio mereka untuk waktu yang lama.

Kami kembali dengan daftar besar efek teks CSS yang didedikasikan khusus untuk menyajikan situs web dengan cara terbaik. produk, layanan, halaman arahan, atau jenis tema lainnya. 35 efek teks yang tidak boleh Anda lewatkan untuk menunjukkan bahwa desain web saat ini berada pada level terbaik dan kami tidak boleh ketinggalan kereta untuk mengikuti estetika terkini.

Efek teks film senyap

Muda

Efek teks yang sangat khusus yang disajikan sebagai yang sempurna untuk jenis tema tertentu. Dalam tanda kutip mungkin ditampilkan untuk memperjelas bahwa kami memperhatikan desain situs web kami atau desain klien.

Input teks CSS acak

Teks acak

Masukan teks CSS acak ini mencoba untuk mengacak seolah-olah kunci rahasia dari sebuah rantai. Cara yang sangat mencolok dalam menyajikan teks untuk situs web yang didedikasikan untuk topik tertentu.

Cassie

Cassie

sebuah animasi di svg Itu berarti bobot yang sangat kecil untuk penyajian teks yang dibentuk dalam beberapa warna. Sangat mengejutkan dengan adanya teks ini yang juga menggunakan JavaScript untuk memberi tanda secara utuh.

Teks bayangan animasi

Teks bayangan animasi

Teks bayangan animasi ini memiliki sentuhan estetika yang sangat khusus dan berbeda dari entri lain dalam daftar. Sini kami lupa JavaScript untuk disajikan tidak lebih dari kode CSS.

Teks morph

Teks morph

Teks animasi dalam JavaScript dan CSS itu berubah secara siklis dengan beberapa warna neon. Untuk situs web dengan warna latar belakang hitam atau abu-abu. Animasi yang sangat halus untuk efek teks yang sangat berbeda.

Relief teks terpisah

Teks terpisah beranimasi

Teks ini mulai berlaku muncul dalam animasi yang sangat apik. Ini juga memiliki JavaScript. Dengan satu klik Anda dapat melihat animasi yang dihasilkan untuk efek teks yang sangat menarik.

Animasi gelombang

Teks gelombang animasi

Animasi lambaian dalam teks dengan SVG. Salah satu hal yang membuat penasaran tentang ini efek teks ada di gambar latar belakang dan gradien yang mengisi gelombang untuk membuatnya menonjol dengan benar.

Teks warp animasi

Teks melengkung

Sedikit JavaScript mencapai efek teks di mana setiap huruf memiliki nilai ukurannya sendiri sehingga terlihat seperti terdiri dari stiker huruf yang berbeda. Efek yang bagus untuk teks yang sangat kreatif dalam presentasi.

Efek asap

Efek asap

Efek asap yang bagus untuk teks itu secara bertahap menghilang menghilang sama sekali. Ini dapat digunakan untuk menggerakkan atau mengklik dan membuat teks menguap di depan kita. Tanpa JavaScript dan sangat sedikit kode CSS.

Efek gelembung

Efek gelembung

Efek teks jQuery yang menunjukkan cara membuatnya efek gelembung di tajuk di HTML. Efeknya adalah membuat gelembung muncul dari belakang teks seolah-olah itu adalah air yang berkilau. Sangat mencolok.

Isi teks beranimasi

Teks Beranimasi

Efek teks animasi yang mengisi font dengan gambar latar belakang. Tidak membutuhkan JavaScript dan itu hanya berurusan dengan kode CSS. Animasi yang sangat lambat dan halus untuk teks yang akan sempurna pada tema tertentu untuk situs web.

Animasi teks dalam CSS dan HTML

Teks CSS murni

Animasi teks sederhana dalam CSS dan HTML yang membuat ekstensi kata-kata jatuh secara vertikal dari atas. Kami melupakan JavaScript di sini untuk menyelesaikan animasi yang lugas dan sederhana tanpa banyak pembungkus.

Gambar Teks Berwarna

Teks berwarna

Di sini teks digambar dengan efek warna yang sangat mencolok dan yang bisa memberi catatan untuk isu-isu yang berkaitan dengan remaja atau remaja. Akhirnya kosong, sementara font dilintasi oleh serangkaian nada cerah.

Teks animasi dalam SVG

Animasi dalam SVG

Animasi adil satu detik melewati keseluruhan gambar dari huruf teks animasi di SVG. Ini memiliki sedikit kode JavaScript untuk digunakan bersama dengan CSS dan HTML.

Teks bayangan

Teks bayangan

Bayangan teks ini menghasilkan efek kedalaman dalam warna-warna cerah yang hampir terlihat seperti toko kue. Satu-satunya kekurangan adalah tidak dioptimalkan untuk perangkat seluler.

montserrat

montserrat

Animasi dalam CSS dan HTML yang menampilkan kreativitasnya dan beberapa warna mulai dari kuning dan merah. Untuk penggunaan yang ditentukan oleh kekhususan animasinya dari warna-warna yang dijalankan melalui gambar teks.

Efek ledakan

Efek meledak

Efek teks dari Meledak menjadi banyak bagian bahwa kita dapat memperlambat dengan membiarkan penunjuk mouse melewati setiap huruf yang membentuk kata. Efek teks berkualitas tinggi dan menarik yang menggunakan HTML, CSS, dan JavaScript.

Efek teks gelombang

Svg teks melambai

Tanpa JavaScript, efek teks gelombang ini berhasil menempatkan animasi itu benar-benar menggerakkan gambar latar belakang melalui gambar kata. Menyerang tanpa keraguan dan efek yang bagus.

Animasi GSAP

Animasi GSAP

Seperti di banyak film, semua huruf yang membentuk paragraf akan muncul dari mana-mana hingga akhirnya menyusun kalimat dengan efek yang bagus pada animasi. Sangat halus untuk salah satu efek teks yang lebih menarik dan berkualitas lebih tinggi di seluruh daftar. Penting untuk diingat untuk jenis pekerjaan tertentu untuk klien.

Animasi teks berwarna

Penuh warna

sebuah animasi lambat dan lancar warna dalam teks yang berhasil membuat gradien. Meskipun memiliki sedikit JavaScript, ini terutama didasarkan pada SCSS. Ini adalah salah satu efek halus tersebut, tetapi itu menunjukkan keanggunan karena mengetahui cara memilihnya untuk web. Itu tidak akan luput dari perhatian.

Efek teks yang tidak mungkin

Teks yang tidak mungkin

El kotak merah yang mengelilingi teks itu menyala sendiri dengan efek bayangan yang menutupi kata atau frase. Sangat mencolok dan menarik untuk menutupi pintu masuk atau header situs web dengan elegan.

Isi teks warna-warni dengan SVG

Teks SVG

Animasi isian banyak warna yang ditampilkan sebagai salah satunya efek teks yang menonjol diri. Ini unik dalam daftar dan memiliki sentuhan bombastis yang akan memancing sensasi bagi pengunjung web. Jika dia tahu bagaimana menempatkan, dia akan memberikan catatan itu.

Teks animasi dalam SVG

Jalur SVG

Seolah-olah jalan menuju dia sedang berputar gambar teks SVG beranimasi cerah. Salah satu yang paling penasaran dalam daftar dan ditempatkan di tempatnya sendiri untuk mengidentifikasi dirinya dengan sempurna.

Teks kesalahan

Glitch

Teks dalam JavaScript, CSS, dan HTML ini bisa menjadi file sentuhan khusus dari sebuah biro iklan untuk memberi catatan dalam satu kata dalam kalimat. Efeknya menginspirasi dan menarik perhatian pengunjung.

Teks kesalahan

Teks kesalahan

Seolah-olah ada gangguan pada sinyal itu menggambar teks atau menganimasikannya, efek teks ini adalah hasil akhir yang bagus. Singular tanpa keraguan dan menampilkan dirinya sendiri. Dibuat di HTML (pug) dan CSS (SCSS).

Teks kesalahan SCSS

Ilmu kesalahan

Teks kesalahan lain dengan gangguan yang akan ditemukan situs Anda di situs web yang sangat tertentu karena temanya, tentunya terkait dengan fiksi ilmiah.

Arahkan teks 

Arahkan teks

Saat kami mengarahkan penunjuk ke teks, ini akan menjadi semacam garis bidik yang akan memungkinkan kita untuk memindahkannya melalui setiap huruf untuk memfokuskannya, karena sisanya akan berada di luar fokus. HTML, CSS dan JavaScript untuk efek teks yang sangat unik.

Arahkan teks dalam perspektif

Arahkan teks

Saat kami meletakkan file penunjuk mouse di atas teks ini, itu akan bergerak dalam perspektif yang sangat aneh yang memancarkan efek 3D.

Teks sorotan beranimasi

Teks unggulan

Dengan pointer mouse kita akan menyorot teks sebagai jika akan disalin atau dipotong. Efek teks yang jatuh dari atas untuk menutupi semua kata dalam paragraf. Tanpa JavaScript dan dengan CSS.

Teks bahagia

Senang

Efek teks senang itu akan berdenyut sampai kita meletakkan penunjuk mouse di atas beberapa hurufnya. Efek yang ditimbulkan akan menjadi lompatan beberapa yang disebut itu. Tanpa JavaScript dan dengan CSS.

Teks 3D dalam komposisi

Teks 3D

Efek teks 3D lainnya untuk membentuk kata-kata yang berbeda dari semua huruf yang akan muncul bersamaan diperbesar dari luar ke dalam. Hasil yang bagus dan sangat visual dan sinematik. Yang lainnya direkomendasikan dalam daftar.

Teks CSS murni dalam bayangan

Teks bayangan

Efek teks ini dalam p CSS murnirovoke bayangan hasil yang bagus dan gaya yang bagus. Tidak salah lagi dan sorotan lain dalam daftar. Tidak ada animasi, tapi brilian.

Bayangan cantik

Bayangan cantik

Efek bayangan yang sangat bagus. Sempurna untuk halaman arahan atau situs penitipan anak. CSS murni untuk menonjol dengan sendirinya.

Bayangan kedua

Svg bayangan kedua

Efek bayangan hebat lainnya dalam HTML dan CSS yang menonjol dengan sendirinya. Bayangan dalam garis menciptakan keanggunan yang luar biasa untuk situs web bertema tertentu.

Parallax Shadow

Parallax Shadow

Kami mengakhiri daftar dengan satu dari efek paling elegan di paralaks untuk bayangan yang ditimbulkan oleh teks. Kami melewati penunjuk mouse dan semakin jauh ke kanan, semakin jauh bayangan akan dipantulkan. Ditulis oleh Ract, ES6 dan Babel.

Anda memiliki daftar lain efek teks di sini.


tinggalkan Komentar Anda

Alamat email Anda tidak akan dipublikasikan. Bidang yang harus diisi ditandai dengan *

*

*

  1. Penanggung jawab data: Miguel Ángel Gatón
  2. Tujuan data: Mengontrol SPAM, manajemen komentar.
  3. Legitimasi: Persetujuan Anda
  4. Komunikasi data: Data tidak akan dikomunikasikan kepada pihak ketiga kecuali dengan kewajiban hukum.
  5. Penyimpanan data: Basis data dihosting oleh Occentus Networks (UE)
  6. Hak: Anda dapat membatasi, memulihkan, dan menghapus informasi Anda kapan saja.

  1.   Tony dijo

    Halo, efeknya bagus, tetapi saya tidak tahu cara menggunakannya di situs web saya, mereka ada di scss dan saya tidak tahu cara menggunakannya, saya hanya tahu cara menggunakan css, saya tidak tahu apakah Saya harus mengubahnya menjadi css atau jika saya harus menginstal sesuatu di server wordpress saya, atau apa yang harus saya lakukan, terima kasih