アニメーションするSVGアイコンもそれを実装するJavaScriptも、ゼロから作成すると時間がかかります。 Webページやスマホアプリでよく使用するさまざまなアイテムが用意された、アニメーションに対応したSVGアイコンと埋め込みコードがセットになったJavaScriptのライブラリを紹介します。 実装は非常に簡単で、SVGやJavaScriptが苦手な人でも問題無しです。
実装が非常に簡単！アニメーションに対応したSVGアイコンと埋め込みコードがセットになったライブラリ -Titanic
アニメーションするSVGアイコンもそれを実装するJavaScriptも、ゼロから作成すると時間がかかります。 Webページやスマホアプリでよく使用するさまざまなアイテムが用意された、アニメーションに対応したSVGアイコンと埋め込みコードがセットになったJavaScriptのライブラリを紹介します。 実装は非常に簡単で、SVGやJavaScriptが苦手な人でも問題無しです。
How to work with SVG icons
There are many ways to use SVG icons in HTML and CSS, and I haven’t tried them all. This is how we do it in our small front-end team at Kaliop. It works well for our needs, which include: Content and communication websites, often based on big CMSes, rather than full-JS web apps. Icons which are often simple, single-color icons (each potentially used in several different colors depending on context
50 Tasteful Barista And Coffee Lovers Icons - Freebie — Smashing Magazine
Creative folks like yourself know how important our daily dose of hot and steaming coffee is. Many of us even choose to work from a coffee house because the cozy atmosphere, the smell of freshly ground coffee beans and the carefully created art on the glossy foam fuels our creativity. Designed by Oliver Pitsch, Barista is an icon set dedicated to all baristas and coffee lovers. It consists of 50 c
Freebie: Astronomy & Space Icons (AI, Sketch, SVG, PNG) | Codrops
Freebie: Astronomy & Space Icons (AI, Sketch, SVG, PNG) A set of 30 free vector icons with an astronomy and space related theme and a duo colored fine line style. Today we’d like to share a beautifully designed space icon set with you. The set was designed by Dale Humphries and it contains various astronomy and space related icons in a delicate two-colored line style. About the icon set Containing
Glyphs Company
Find, use, and optimize Glyphs is the easiest way to find, customize, and deliver graphics. Sign up below to start using and customizing any of our thousands of SVG graphics or stock photos in less than five minutes: New from Glyphs: SmartCTR 5-15% more conversions, near-zero effort. SmartCTR is fully-automatic A/B/n optimization designed for sitewide eCommerce testing. Boost multiple elements acr
SVG と背景色を使ってサイズやカラーが自在な汎用性のあるアイコンボタンを作る
SVG によるアイコンデータと CSS による背景色の指定を組み合わせてサイズやカラーを自在に変更可能なアイコンボタンを作るお話。あわせて主要 Web サービスのロゴデータを SVG で用意する方法や注意点なども。 透過 GIF や PNG 画像に背景色を組み合わせることでアイコンボタンのカラーバリエーションを簡単に作るっていうやり方は昔からありますが、これを SVG （Scalable Vector Graphics） でやることでサイズ変更にも対応しやすいやつを作るっていうお話。 手法的には目新しいことは何もありませんが、この前この Blog のデザインをリニューアルしたときに視覚的に左側サイドメニュー上部 （スマートフォン表示だと隠れてると思いますが） にある 「Follow」 メニュー部分で使ったので紹介。 やってることは簡単です。白抜きにしたい部分をそのまま白色、背景は透過するよ
SVG Icons Animated with CSS
<div class="wrapper"> <svg version="1.1" id="sun" class="climacon climacon_sun" viewBox="15 15 70 70"> <clipPath id="sunFillClip"> <path d="M0,0v100h100V0H0z M50.001,57.999c-4.417,0-8-3.582-8-7.999c0-4.418,3.582-7.999,8-7.999s7.998,3.581,7.998,7.999C57.999,54.417,54.418,57.999,50.001,57.999z"/> </clipPath> <g class="climacon_iconWrap climacon_iconWrap-sun"> <g class="climacon_componentWrap climaco
954 free SVG and PNG icons easily customizable for games or apps | Game-icons.net
Already 4149 free icons for your games Last Update Apr 7, 2024 | Popular ones with random colors About the projectAn ever growing collection of free game iconsDozen new symbols are added weekly and organized in intuitive categories to offer both a comfy browsing and let room for serendipity. Stay up to date by following the project on twitter or just fetching the RSS feed. Easy styling thanks to S
Animated SVG Icons with Snap.svg | Codrops
Using SVGs on websites is becoming more and more easy with great libraries like Snap.svg. Today we want to explore what we can do with it and animate some SVG icons as a practical example. SVG has been one of the most underused technologies when it comes to web development. Despite it’s usefulness and powerful possibilities it’s still a mystery to many and when it comes to integrating it and using
Drawic
フッターのアイコンをSVGにした。GitHubにリポジトリも作っておいた。ぴくせる・ぱーふぇくとってなんでしたっけ……。 暗い背景向けの白いアイコンのみだけど、まぁそこは普通のSVGなのでエディターで開いてfillプロパティーの値を変えれば好きな色に変更できる。二種類ある矢印系には全方位を用意しなかったけど、transform属性でrotate()関数を利用して方向を調節できるのでそれで(若干中心をずらしてあるのでtranslate()も併用した方が良い)。 shape-rendering: crispEdges with crispEdges (Left) vs. w/o crispEdges (Right) Deliciousのアイコンはrect要素を組み合わせたものなので、そのままでは拡大・縮小すると端がぼやけることがある。そういう時はみんなが独自実装したCSSのimage-rend
An Intro to Raphaël - Raphaël
The most popular coding language for the web is javascript; so much so that since the advent of HTML5, it has now been officially accepted as the default standard. Javascript has moved beyond a smaller client-side browser-based language to become integrated not just for front-end design, but also for back-end server-side development. As a result there are has been a huge growth of Javascript libra
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - danklammer/bytesize-icons: Tiny style-controlled SVG iconset (101 icons, 12kb)
SVG Burger Menu
Novedades sobre Diseño Web - Drool
GitHub - google/material-design-icons: Material Design icons by Google (Material Symbols)
Iconic
Loading...
Iconmelon.com
Tehk Seven