rssed

a collection of dev rss feeds - blogroll

Add a new feed

+

200 feeds


Una Kravets Online

Posts

What is popover=hint? πŸ”—

Learn about what exactly this new popover feature does and how it relates to interest invokers. [...]

New capabilities for attr() πŸ”—

Advanced attr() is landing in Chrome 133, and I'm really excited for this feature! Here's a bit about it and how you can use it. [...]

Updates to the customizable select API πŸ”—

Everything that has changed since the RFC post for this feature. [...]

2024 in Review πŸ”—

2024 in review. [...]

Customizable select: request for developer feedback πŸ”—

Learn about the new customizable select component, and try it out today. [...]

@property: Next-gen CSS variables now with universal browser support πŸ”—

The CSS Anchor Positioning API is a game-changer in web development because it lets you natively position elements. [...]

The latest in CSS and web UI: I/O 2024 recap πŸ”—

The web platform is alive with innovation, with CSS and web UI features at the forefront of this exciting evolution. [...]

Introducing the CSS anchor positioning API πŸ”—

The CSS Anchor Positioning API is a game-changer in web development because it lets you natively position elements. [...]

Popover API lands in Baseline πŸ”—

Popover provides so many great developer affordances for building layered interfaces like tooltips, menus, teaching UIs, and more. [...]

2023 in Review πŸ”—

Annual year in review: 2023 edition. [...]

CSS Wrapped: 2023! πŸ”—

2023 was a huge year for CSS! Learn about all the Web UI highlights that landed in browsers this year. [...]

Select element: now with horizontal rules πŸ”—

The select element gets a small but mighty upgrade where you can now add (horizontal rule) elements into the list of options and they will appear as [...]

Four new CSS features for smooth entry and exit animations πŸ”—

These four new features include: animating display and content-visibility on a keyframe timeline, the transition-behavior property, the @starting-styl [...]

Building a no-JS radial menu with CSS trigonometry, popover, and anchor positioning πŸ”—

Learn how to build a fluid, modern radial menu leveraging new and upcoming CSS capabilities. [...]

2022.5 in Review πŸ”—

Catching up on last year's year-in-review post [...]

Introducing the popover API πŸ”—

Popovers are everywhere on the web platform. Learn how to use the new web platform primitives to take advantage of them today. [...]

What's new in CSS and UI: I/O 2023 Edition πŸ”—

Popovers are everywhere on the web platform. Learn how to use the new web platform primitives to take advantage of them today. [...]

Using color-mix() to create opacity variants πŸ”—

Build an alpha color system without splitting out channels using this one neat trick. [...]

Getting started with style queries πŸ”—

With style queries landing in stable Chrome, learn about how to use them in applications. [...]

Container queries land in stable browsers πŸ”—

Learn about working with container queries and the polyfill. [...]

Working with container queries today πŸ”—

Learn about working with container queries and the polyfill. [...]

@container and :has(): two powerful new responsive APIs πŸ”—

Leverage the responsive UI power of container queries + :has(). [...]

Style Queries πŸ”—

Exploring when and how you would use style queries in your day-to-day work. [...]

Cascade layers are coming to your browser πŸ”—

Learn about using cascade layers to control the CSS cascade for more targetted styles. [...]

2021 in Review πŸ”—

Reviewing 2021's highs, lows, and everything in between. [...]

How we Built Designcember πŸ”—

Behind-the-scenes of designcember.com. [...]

Personalize It! πŸ”—

I answer the question "what is one thing you can do to make your site better?" [...]

CSS for Web Vitals πŸ”—

CSS-related techniques for optimizing Core Web Vitals. [...]

The new responsive: Web design in a component-driven world πŸ”—

Controlling macro and micro layout in a new era of responsive web design. [...]

Next Gen CSS: @container πŸ”—

@container brings us the ability to style elements based on the size of their parent container. [...]

Updates in hardware-accelerated animation capabilities πŸ”—

Learn about using cascade layers to control the CSS cascade for more targetted styles. [...]

New aspect-ratio CSS property supported in Chromium, Safari Technology Preview, and Firefox Nightly πŸ”—

The new CSS property that helps maintain spacing in responsive layouts. [...]

2020 in Review πŸ”—

Well this year absolutely sucked. But I'll try to take a look at the positive. [...]

Cross-browser paint worklets and Houdini.how πŸ”—

Supercharging your CSS with Houdini paint worklets is just a few clicks away. [...]

min(), max(), and clamp(): Three Logical CSS Functions to Use Today πŸ”—

Learn how to control element sizing, maintain proper spacing, and implement fluid typography using these well-supported CSS functions. [...]

content-visibility: the New CSS Property that Boosts your Rendering Performance πŸ”—

Improve initial load time by skipping the rendering of offscreen content. [...]

@property: giving superpowers to CSS variables πŸ”—

The Houdini Properties and Values API is coming to your CSS file in Chromium 85. [...]

Ten Modern Layouts in One Line of CSS πŸ”—

This post highlights a few powerful lines of CSS that do some serious heavy lifting and help you build robust modern layouts. [...]

Web Animations API improvements in Chromium 84 πŸ”—

Orchestrating animations with promises, performance improvements with replaceable animations, smoother animations with composite modes, and more. [...]

Randomized Selective Color: A Post List Study πŸ”—

A study on selective color from a predefined list, using CSS custom properties, a little bit of JavaScript, and some progressively enhanced CSS Houdi [...]

The Web in 2020: On Extensibility and Interoperability πŸ”—

In the past few years, we’ve seen a lot of change and diversion in regard to web technologies. In 2020, I foresee us as a web community heading toward [...]

Using Material Density on the Web πŸ”—

The latest update to our density guidelines includes a new systematic approach to applying density and spacing in digital products. [...]

2019 in Review πŸ”—

2019 was a massive year for me. I like to reflect on the year and set some goals for the future. [...]

Calculating Color: Dynamic Color Theming with Pure CSS πŸ”—

Did you know that you can build custom dynamic color themes without the use of JavaScript or a CSS preprocessor!? Read on! [...]

How to Use Material Data Tables on the Web πŸ”—

Creative web design and systematic web design don’t need to be at arms. This post examines how to use a design system (Material) and extend it to make [...]

Material Theming: Making Material Your Own! πŸ”—

Creative web design and systematic web design don’t need to be at arms. This post examines how to use a design system (Material) and extend it to make [...]

I'm Joining Google! πŸ”—

Just a little writeup about what I've learned and what I'm up to next. [...]

An Illustrated (and Musical) Guide to Map, Reduce, and Filter Array Methods πŸ”—

Map, reduce, and filter are three very useful array methods in JavaScript that give developers a ton of power. This post makes them a little easier to [...]

New horizons in CSS: Houdini and the Paint API πŸ”—

I wrote a blog post for LogRocket about CSS Houdini and the Paint API! Complete with demos and illustrations. [...]

The Future of Responsive Design πŸ”—

With expanding web technoligies, we can now interpret responsive design as the way it affects a user’s context, and how we can be the most responsive [...]

2018 in Review πŸ”—

Reviewing how my 2018 went, and discussing goals for next year! [...]

Solved with CSS! Logical Styling Based on the Number of Given Elements πŸ”—

The old-third post in my "Solved with CSS" Series, this time detailing how you can use CSS to apply logical styling based on how many elements are ins [...]

The Female Engineers of Bustle on Getting the Job Done πŸ”—

A feature on Bustle, sponsored by Windows, on my some of my teammates and myself, where we discuss work, the team, and falling in love with coding. [...]

Solved With CSS! Dropdown Menus πŸ”—

A CSS Tricks post on how we can create accessible dropdowns using only vanilla CSS. [...]

Solved With CSS! Colorizing SVG Backgrounds πŸ”—

A CSS Tricks post on how we can colorize inaccessible SVG backgrounds by using CSS filters, instead! [...]

Pair Projecting πŸ”—

This is my second Pastry Box Project post: on why working with other people makes projects more rewarding. [...]

2017 in Review πŸ”—

Keeping the tradition alive! My 2017 in review and 2018 goals. [...]

Why Design Systems Fail πŸ”—

This 24-Ways post looks into why the implementation of design systems and how to ensure that yours is successful. [...]

I'm Useless Without a To-Do List πŸ”—

It's hard to stay on task and productive β€” especially when we've got so much going on in our lives. This post details how I maintain a TODO list syste [...]

The Contrast Swap Technique: Improved Image Performance with CSS Filters πŸ”—

With CSS filter effects and blend modes, we can now leverage various techniques for styling images directly in the browser. However, creating aestheti [...]

Locally Scoped CSS Variables: What, How, and Why πŸ”—

Leveraging CSS Variable scope improves the size, specificity, and semantics of our stylesheets. This article talks all about what CSS Variables are an [...]

VSCode Custom Workspaces πŸ”—

VSCode just released custom workspaces! This means you can customize your text editor layout and style for different projects within a single editor! [...]

3 CSS Grid Features That Make My Heart Flutter πŸ”—

An awesome CSS grid tool was just released for Firefox, and the web has been buzzing about it. This is a short post about my 3 favorite features! [...]

Creative Side Projects: A How-To Guide πŸ”—

The best way to learn any new skill is through practice. This post is about how to come up with creative and effective side projects for developers to [...]

Interview on Shoptalk Show πŸ”—

I was on the Shoptalk Show (hosted by Chris Coyier and Dave Rupert) with Krystal Higgins talking about An Event Apart, speaking, and finding a "thing" [...]

Implementing "Save For Offline" with Service Workers πŸ”—

I recently added an option to save blog posts for offline reading. This post details how I did that and how you can too. [...]

2016 Year In Review + 2017 Resolutions πŸ”—

It's time for my annual reflection and goal resetting circa 2016 [...]

Simplicity in Design: Insights from an Industrial Engineer πŸ”—

My father, an industrial engineer with over 20 years od experience talks about interface design and the important of simplicity in programming. [...]

Rethinking Responsive Design πŸ”—

From Google's physical web project to the emergence of more affordable virtual reality and augmented reality systems, it's time to take a serious look [...]

Digitalocean.com on the Responsive Web Design Podcast πŸ”—

I was on the Responsive Web Design Podcast, co-hosted by Karen McGrane and Ethan Marcotte, with my coworker Zach Schnackel to discuss the new digitalo [...]

3 Years of Pattern Libraries: Lessons Learned πŸ”—

Component libraries can be very useful in terms of organization, unity, and ensuring performance/accessibility. Here are 3 things to understand when e [...]

Faster and More Accessible: The New digitalocean.com πŸ”—

We unified the site with our updated branding, and also focused on improving digitalocean.com's accessibility, organization, and performance. [...]

3 Weird SVG Browser Inconsistencies πŸ”—

This post started with a simple search and turned into a trove of undocumented knowledge I discovered about finicky cross-browser SVG properties. [...]

3 Easy Performance Wins for Designers πŸ”—

Wish media being the biggest performance bottleneck on the web, let's turn our focus to design. This post outlines 3 easy wins for more performant UI' [...]

It’s Not About Morals: Accessibility is for the Masses πŸ”—

Accessibility is often solely discussed in terms of people with disabilities, but in truth, it's something that benefits the majority (if not all) of [...]

Web Image Effects Performance Showdown πŸ”—

This post for Smashing Magazine looks at one of the most popular image effects, grayscale, to compare its implementation in HTML canvas, SVG, CSS filt [...]

Setting up An Accessibility Dashboard from Scratch with Pa11y on DigitalOcean πŸ”—

This post will walk you through setting up an accessibility testing dashboard from A to Z. Let's make the Internet more better together. [...]

Lessons Learned at IBM Design πŸ”—

I've learned so much during my time at IBM Design! This is a little wrap up post and an announcement about my next adventure. [...]

Pure CSS Games with Counter-Increment πŸ”—

Did you know you can make games in CSS? This post explores a relatively obscure CSS property (counter-increment) combined with checkbox inputs to show [...]

Interview on The Start FM πŸ”—

I was interviewed for one of my favorite podcasts ever: The Start FM. The conversation is about how I got to be where I am now and what it means to be [...]

If You Know Sass, You Know ES2015 πŸ”—

If you know some Sass, you're probably a lot further than you think to understanding and diving into the world of modern JavaScript. This post showcas [...]

Finessing < feColorMatrix > πŸ”—

CSS Filters are awesome, but you can't do individual channel manipulation with them. Enter: feColorMatrix, SVG filter effect method that allows for re [...]

A Gulp-Based External SVG Symbol Sprite Icon System πŸ”—

Icons are essential to most pattern libraries and web design systems. Let's take a look at a scalable approach! [...]

How Did I Begin Coding? πŸ”—

I wrote about how I began to code for the new publishing platform SuperYesMore. TL;DR β€” cartoon dolls and Flash. [...]

2015 Year In Review & 2016 Resolutions πŸ”—

It's time for my annual reflection and goal resetting! It's been a crazy year for sure. [...]

Classy CSS&colon; a Programmatic Approach to Sass Stylesheets πŸ”—

An opinionated Sass architecture system for writing modular and scalable libraries. Also, a case in defense of extends. [...]

CSS Image Effects #6: Infrared Photography πŸ”—

In the final post of the CSS Image Effects series, we explore the beautiful, surreal world of infrared photography by creating our own faux effect. [...]

CSS Image Effects #5: Lomography πŸ”—

A vibrant, unexpected, and fun effect β€” the Lomography Effect is an opportunity where you can really be creative and try out various CSS image techniq [...]

Introducing CSSgram: A CSS Library for Instagram Filters πŸ”—

CSSgram is a tiny (<1kb gzipped) library for recreating Instagram filters with CSS filters, gradients, and blend modes. [...]

CSS Image Effects #4: Bokeh Textures πŸ”—

Bokeh textures are very popular in photography. Let's take a look at how to create our own. [...]

CSS Image Effects #3: Vignettes 3 Ways πŸ”—

This week we'll take a look at one of the most popular photo manipulations: adding a vignette to draw attention to the center of an image. [...]

CSS Image Effects #2: 3D Glasses πŸ”—

How do you make 3D-glasses-like graphics in the browser? We'll look at how blend modes work together to create this effect. [...]

CSS Image Effects #1: Vintage Washout πŸ”—

The first post in a series on creating custom image effects in CSS. We'll take a look at the vintage washout effect. [...]

The Internet We Know is Built on Hacks πŸ”—

From HTTP2, Flexbox, CSS Filters, and ES6, the Internet we know today is built on hacks. Lets explore some of those hacks and solutions. [...]

CodeNewbie Podcast πŸ”—

I was interviewed for the CodeNewbie podcast, where I talk about life, IBM Design, open source, and personal goals. [...]

How to Get Designers Involved in Your OSS Project πŸ”—

A journalists take on my OSCON talk β€” Open Source Design, A Love Story. [...]

Tech Conference Travel Tips πŸ”—

With preparations for the fall conference season coming up, here are some travel tips to help make your life a little bit easier. [...]

Opensource.com Interview πŸ”—

How designers can contribute to open source, an interview for the OSCon Speaker Interview Series. [...]

Atomic OOBEMITSCSS πŸ”—

A ridiculous frankenstein of a name for a legitimate approach to CSS that pulls ideas from the most popular approaches. [...]

Hacking :visited πŸ”—

Hacking the :visited selector to show unread posts. We'll look at the limitations and my little work-around. [...]

Sass Pixel Art πŸ”—

Pixel art is so much fun! This blog post walks through how to read a matrix-like list with Sass and generate Mario pixel art from box shadows. [...]

Embrace the Terminal πŸ”—

If you use a computer, you could use your terminal to make huge improvements to your work flow. This article talks about getting started and writing a [...]

Sketchnotes from SXSW 2015 πŸ”—

Some selected sketchnotes from a few talks I went to at the SXSW Interactive 2015 Conference. [...]

5 Great Uses for Sass Maps πŸ”—

Another blog post written for SitePoint about 5 great uses for Sass maps and other thoughts on code at the moment. [...]

On Code and Community πŸ”—

A blog post written for SitePoint on why community is at the crux of a thriving code base. [...]

The Science of Web Animations&: SPA πŸ”—

Neuroscience plays a big roll in our design work. This post takes a look at Sensory Memory and how animations that visually link states can improve a [...]

Sketchnotes, FTW πŸ”—

Sketchnotes are a great way to document a talk or event. They allow you to doodle and get a little bit creative with your content recording. [...]

Sass Director and Manifest Files πŸ”—

I created a tool that lets you architect your Sass project in a single location (your manifest file), and it will build all of the directories and par [...]

2015 Resolutions πŸ”—

This is a personal post about my 2014 in review (because a lot happened) and my goals for 2015. Happy New Year! [...]

Setting up PageSpeed Insights to test Performance Locally via Gulp πŸ”—

This is a walk through of how to set up Google PageSpeed Insights within your existing gulp project. This way, you can get your page speed score infor [...]

On Learning and Comprehension πŸ”—

I've been doing a lot of research and experimentation lately about how people learn. This post might give you some ideas to improve your own comprehen [...]

Open Source Design πŸ”—

When designers and developers work together from the start, it produces better outcomes. But how can we get designers involved and wanting to particip [...]

A Pretty Long List of Style Guides and Pattern Libraries πŸ”—

An alphabetized list of styleguides and pattern libraries and a look into the differences between those two terms. [...]

ATX Sass πŸ”—

Our new website for Austin's Sass Meetup is live! [...]

The Intimidation Barrier πŸ”—

A closer look at one of the reasons why designers don't participate in the open source community. (This links out to designopen.org) [...]

How Open Sourcing My Personal Goals Made Me Really Productive πŸ”—

For the past four weeks, I've been keeping a very public and open version of my personal goals on Github. Its definitely made me a lot more productive [...]

Becoming a Keyboard Ninja: The Sticky Note Method πŸ”—

The keyboard, where our hands are placed most of the time (as developers), is the fastest navigation method by default. Knowing how to navigate yours [...]

Media Queries of the Future! πŸ”—

The Media Queries 4 spec brings insight to technological capabilities that are coming up soon (this is based on the Editor’s Draft, October 10, 2014). [...]

Sass Bites #33: Una Kravets πŸ”—

I was on Sass Bites this week! [...]

Building Proofessor πŸ”—

A behind-the-scenes look at the making of the Proofessor app. (This links out to viget.com) [...]