paulirish/sample-devtools-theme-extension

Stars
113
Rank 310,115 (Top 7 %)
Language
CSS
Created almost 11 years ago
Updated over 10 years ago

paulirish/sample-devtools-theme-extension

paulirish

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

A sample devtools theme extension using the new API

sample-devtools-theme-extension

A sample devtools theme extension using the new API

Enable DevTools experiments at chrome://flags/#enable-devtools-experiments, relaunch Chrome, then open DevTools, open Settings > Experiments, and toggle Allow UI themes experiment.

Read this: https://code.google.com/p/chromium/issues/detail?id=318566#c33

Make your own theme!!

Use the format of this repo to make your own devtools theme, just make a styles.css that is actually awesome. You can also port any of the righteous themes at devthemez.com to this new format. Or ask their maintainers to.

You can also use Yeoman to easily create new themes: https://github.com/zenorocha/generator-devtools-theme

Then publish to the web store. Please add "devtools theme" to the name so people can easily find them!

Additionally, I would recommend looking at what's happening at zero-base-themes, which is creating a platform for DevTools theming. Looks great!

![image](https://f.cloud.github.com/assets/39191/1788824/351e1230-693f-11e3-80fe-39535b7abaef.png)

lite-youtube-embed

A faster youtube embed.

dotfiles

paul's fish, bash, git, etc config files. good stuff.

git-open

Type `git open` to open the GitHub page or website for a repository in your browser.

matchMedia.js

matchMedia polyfill for testing media queries in JS

memory-stats.js

minimal monitor for JS Heap Size via performance.memory

pwmetrics

Progressive web metrics at your fingertipz

break-on-access

break on access to a property

github-email

Get a GitHub user's email. 😎 Use this responsibly.

git-recent

See your latest local git branches, formatted real fancy

automated-chrome-profiling

Node.js recipes for automating javascript profiling in Chrome

speedline

Calculate the speed index from devtools performance trace

headless-cat-n-mouse

Is headless chrome currently detectable? Let's pit the detections and detection evasions against eachother.

css3please

use Autoprefixer instead. <3

frontend-feeds

OPML of the frontend development rss feeds

devtools-addons

devtools-timeline-model

w3fools

harmony

Procedural Drawing Tool - my fork reduces it down to be integrated elsewhere

es-modules-todomvc

ES modules demo app

web-feature-availability

estimating the % of web users that have certain web features natively supported

adb_trace

Android Debug Bridge + Chrome Tracing

trace.cafe

easy webperf trace sharing

lh-scorecalc

Lighthouse perf score calculator - explaining how the perf score is composed

emulation-popup-ext

chrome extension for devtools device emulation of your current page

covfefe-coverage

Node API for DevTools JS Coverage data

mojibar-web

chrome-side-tabs-extension

Restored source of Adrian Lungu's awesome Chrome Side Tabs extension

html5readiness.com

visualization of html5 and css3 features and when they are implemented

font-face-detect

Detect if @font-face support is present in the browser.

commitlintbot

third-party-decode

Decode URLs into 3rd party companies & products.

caltrainschedule.io

🚄 caltrain schedules - offline first 🐬

39ridiculousboxshadows

39 totally ridiculous box shadows

jQuery-miniplugins

assorted snippets and plugins

google-hangouts-grid-view

chrome extension to get a basic grid view in Google Hangouts

request-capture-har

Wrapper for request module that saves all traffic as a HAR file.

mothereffingtextshadow

CUZ WE NEED SOME MOTHER EFFING TEXT SHADOW

statikk

A simple and secure server for static files.

viewport-width-visualization

what do the widths and devices of responsive design look like?

c-cli

Give your `cat` command some color

jQuery-plus

A collection of addons/plugins for jQuery - mostly overloaded jQuery methods...

pidgey-grinding

pokemon go max XP calculator thang thang

mothereffinghsl

we 'bout to get HSLazy up in this!!

demo

i have a /demo/ URL on my domain. this is it.

gmail-popup-extension

opens gmail in a popup window. Nice if you open a lot of new tabs from it. chrome extension. it's dirty.

email2feed

a google app engine service that takes email at [email protected] and serves a feed at domain.com/foobar

tiny-demos-on-https

can't do a jsbin on HTTPS but sometimes you need it. gh-pages to the rescue.

Chrome-LikeBlock

A Chrome extension (and greasemonkey script) to block the Facebook Like buttons

fusejs

Alpha version of FuseJS

lite-googlemaps-embed

npm-publish-devtools-frontend

timeline-totals

summarize cost of all operations recorded by the devtools timeline

source-map-js

fork of 7rulnik/source-map-js (which is ultimately a fork of mozilla/[email protected] (pre-wasm))

Gmail-mailing-list-permalink-chromeext

Get a permalink of the mailing list message you're looking at in gmail

gf3hairday

ITS FUCKING GLAMOUROUS FEBRUARY 3rd!

CopyLink-extension

Copy link to current page into the clipboard

mydevice

what are my device specs ?

package-underscore

server-trace-injector-extension

trace-stuff

package-backbone

netlogbytes

lh-build-tracker

build size history for Lighthouse

bot-t-factoids

factoids from temp01's bot-t. RIP bot-t. <3

badge-gdrive-favicons-extension

dadi

Automatically exported from code.google.com/p/dadi

node-imageview

preview images in a browser and set their data uri in an input field

sourcesnapper

exploring an idea

aoe-tech-tree-widget

chromedot

Some notes on chrome subsystems

filesystem-api-explorer

Filesystem API explorer - chrome extension

cri-request-interception