Еженедельная подборка красивых эффектов на CSS/SVG/JS #37

Подборка свежих эффектов, интересных идей и полезных наработок.

Шахматная партия

Анимированная сцена с борьбой в шахматах Каспарова с Deep Blue, на JS.
Автор: Вичио Бонура (@V17h3m)

Шахматная партияПосмотреть живой пример


Скалы

Интерактивная сцена с пирамидами, на JS.
Автор: Крис Ганнон (@chrisgannon)

СкалыПосмотреть живой пример


Легионы

Интерактивная сцена с прилипающими друг к другу точками, в canvas.
Автор: Тиффани Рейсайд (@tmrDevelops)

ЛегионыПосмотреть живой пример


Звуковой эффект

Звуковой эффект, на CSS.
Автор: Томас Подгродзкий (@Podgro)

Звуковой эффектПосмотреть живой пример


Размытый лес

Интерактивная сцена с линзой для разблюривания фона, в SVG.
Автор: Руслан (@mrspok407)

Размытый лесПосмотреть живой пример


Человечки

Интерактивная сцена с человечками. Можно хватать.
Автор: Йохан Карлссон (@DonKarlssonSan)

ЧеловечкиПосмотреть живой пример


Спираль

Интерактивная сцена со спиралью. Измените размер окна.
Автор: Джеми Култер (@jamiecoulter89)

СпиральПосмотреть живой пример


Текст

Анимированный текст, на CSS.
Автор: Cm0nsters (@Cm0nsters)

ТекстПосмотреть живой пример


Пузырьки

Анимированная сцена с пузырьками на фоне, в canvas.
Автор: Джулиен Эмблард (@capse)

ПузырькиПосмотреть живой пример


Миссия на Марс

Анимированная сцена, в SVП.
Автор: Син (@nevernotsean)

Миссия на МарсПосмотреть живой пример


P.S. Это тоже может быть интересно:

6 Комментарии

  1. Denai

    Шахматы, видимо, работают только в хроме. Лиса показывает какую-то дичь с ныряющими в стол фигурами

    1. Алексей

      Да всё равно надписи место фигур — это шляпа

      1. SelenIT

        Это да. Есть же юникодные символы для них (как в этой старенькой 1-килобайтной демке:)

        1. Алексей

          Вот, да. И уже совершенно по-другому воспринимается, можно сосредоточится на шахматной игре, а не на названиях…

        2. Denai

          А вот эта демка хороша, хоть и о другом

  2. Алексей

    Линза для осмотра леса понравилась.
    А шахматы разочаровали — по ним понять ничего не возможно…

Оставить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Получать новые комментарии по электронной почте. Вы можете подписаться без комментирования.