10 проектов на CodePen для вашего вдохновения

В списке ниже вы найдете 10 потрясающих проектов на CodePen, которые написаны на HTML, CSS, JavaScript и различных фреймворках для вашего вдохновения.

Alex the CSS Husky

HTML + SCSS | Автор: David

See the Pen <a href="https://codepen.io/davidkpiano/pen/wMqXea/">Alex the CSS Husky</a> by David Khourshid (<a href="https://codepen.io/davidkpiano">@davidkpiano</a>) on <a href="https://codepen.io">CodePen</a>.

Interactive SVG Info Graph

HTML + CSS + JavaScript | Автор: Chris Gannon

See the Pen <a href="https://codepen.io/chrisgannon/pen/pbzEYr/">Interactive SVG Info Graph</a> by Chris Gannon (<a href="https://codepen.io/chrisgannon">@chrisgannon</a>) on <a href="https://codepen.io">CodePen</a>.

CSS 3D Solar System

HTML + CSS + jQuery | Автор: renatorib

See the Pen <a href="https://codepen.io/juliangarnier/pen/idhuG/">CSS 3D Solar System</a> by Julian Garnier (<a href="https://codepen.io/juliangarnier">@juliangarnier</a>) on <a href="https://codepen.io">CodePen</a>.

Text Particle

HTML + CSS + JavaScript | Автор: Gthibaud

See the Pen <a href="https://codepen.io/Gthibaud/pen/pyeNKj/">Text particle</a> by gtibo (<a href="https://codepen.io/Gthibaud">@Gthibaud</a>) on <a href="https://codepen.io">CodePen</a>.

Day Night Simulation

HTML + CSS + jQuery | Автор: catagen

See the Pen <a href="https://codepen.io/Catagen/pen/PqYdXR/">Day Night simulation</a> by Szymon Stypa (<a href="https://codepen.io/Catagen">@Catagen</a>) on <a href="https://codepen.io">CodePen</a>.

Mouse Balls Animation

SCSS + jQuery | Автор: renatorib

See the Pen <a href="https://codepen.io/renatorib/pen/gBLDA/">Mouse balls animation</a> by Renato Ribeiro (<a href="https://codepen.io/renatorib">@renatorib</a>) on <a href="https://codepen.io">CodePen</a>.

Love is Love

Pug + CSS |Автор: yumeeeei

See the Pen <a href="https://codepen.io/Denart22/pen/mwYebm/">Love is Love ?</a> by Denia Zarytskyi (<a href="https://codepen.io/Denart22">@Denart22</a>) on <a href="https://codepen.io">CodePen</a>.

Timeline Style Navigation

HTML + SCSS + jQuery | Автор: nailaahmad

See the Pen <a href="https://codepen.io/nailaahmad/pen/MyZXVE/">Timeline Style Navigation</a> by Naila Ahmad (<a href="https://codepen.io/nailaahmad">@nailaahmad</a>) on <a href="https://codepen.io">CodePen</a>.

React Animated Page Transitions

React + SCSS | Автор: sdras

See the Pen <a href="https://codepen.io/sdras/pen/gWWQgb/">React Animated Page Transitions</a> by Sarah Drasner (<a href="https://codepen.io/sdras">@sdras</a>) on <a href="https://codepen.io">CodePen</a>.

Animated Weather Cards

HTML + SCSS + jQuery | Автор: steve3003

See the Pen <a href="https://codepen.io/steveg3003/pen/Gqakbo/">Animated Weather Cards</a> by Steve Gardner (<a href="https://codepen.io/steveg3003">@steveg3003</a>) on <a href="https://codepen.io">CodePen</a>.

Надеемся вам понравилась подборка проектов на CodePen. Также возможно вам будет интересно оценить бесплатные адаптивные HTML5 и CSS3 шаблоны и 10 новых инструментов разработки за июнь 2017-го.

Изучайте веб разработку, с помощью онлайн уроков, каждый понедельник и среду в 20:00, на канале: Быстрый старт в веб-разработке (на странице проекта доступный записи всех уроков).

Education Ecosystem Blog

Featured in

10 потрясающих проектов на CodePen для вашего вдохновения