# Icons

Published articles for Icons.

This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles.

## Minimal setup for Compose Desktop

DevFeed: [Minimal setup for Compose Desktop](<https://devfeed.tech/articles/minimal-setup-for-compose-desktop-39252.md>)

Original publisher: [Read original article](<https://kt.academy/article/compose-desktop>)

Published: 2025-12-22T00:00:00Z

Content type: tutorial

Language: en

Sources: [Kt. Academy](<https://devfeed.tech/sources/kt-academy.md>)

Topics: [compose-for-desktop](<https://devfeed.tech/topics/compose-for-desktop.md>), [Compose](<https://devfeed.tech/topics/compose.md>), [Kotlin](<https://devfeed.tech/topics/kotlin.md>), [ui](<https://devfeed.tech/topics/ui.md>)

Tags: [compose](<https://devfeed.tech/tags/compose.md>), [desktop](<https://devfeed.tech/tags/desktop.md>), [fonts](<https://devfeed.tech/tags/fonts.md>), [how-to](<https://devfeed.tech/tags/how-to.md>), [icons](<https://devfeed.tech/tags/icons.md>), [kotlin](<https://devfeed.tech/tags/kotlin.md>), [material3](<https://devfeed.tech/tags/material3.md>), [reload](<https://devfeed.tech/tags/reload.md>), [resources](<https://devfeed.tech/tags/resources.md>), [setup](<https://devfeed.tech/tags/setup.md>), [ui](<https://devfeed.tech/tags/ui.md>), [workshop-learning-programming](<https://devfeed.tech/tags/workshop-learning-programming.md>)

### AI overview

A tutorial on setting up Compose Desktop for a minimal desktop application or script UI. It covers required Kotlin and Compose plugins and dependencies, optional Hot Reload, Material3 and Resources, resource organization, desktop preview limitations, and starter application code.

### Source excerpt

How to setup Compose to use it on desktop, for providing UI for scripts or a simple project.

## Everything we shipped at Sketch in 2025

DevFeed: [Everything we shipped at Sketch in 2025](<https://devfeed.tech/articles/everything-we-shipped-at-sketch-in-2025-9117.md>)

Original publisher: [Read original article](<https://www.sketch.com/blog/sketch-in-2025/>)

Author: Freddie Harrison

Published: 2025-12-16T08:00:00Z

Content type: article

Language: en

Sources: [Sketch Blog](<https://devfeed.tech/sources/sketch-blog.md>)

Topics: [Sketch](<https://devfeed.tech/topics/sketch.md>), [releases](<https://devfeed.tech/topics/releases.md>), [liquid glass](<https://devfeed.tech/topics/liquid-glass.md>), [User interface design](<https://devfeed.tech/topics/ui-design.md>), [macOS](<https://devfeed.tech/topics/macos.md>), [iOS](<https://devfeed.tech/topics/ios.md>)

Tags: [2026](<https://devfeed.tech/tags/2026.md>), [apple](<https://devfeed.tech/tags/apple.md>), [apps](<https://devfeed.tech/tags/apps.md>), [auto-layout](<https://devfeed.tech/tags/auto-layout.md>), [icons](<https://devfeed.tech/tags/icons.md>), [ios-26](<https://devfeed.tech/tags/ios-26.md>), [keyboard](<https://devfeed.tech/tags/keyboard.md>), [latest-features](<https://devfeed.tech/tags/latest-features.md>), [layout](<https://devfeed.tech/tags/layout.md>), [liquid-glass](<https://devfeed.tech/tags/liquid-glass.md>), [macos](<https://devfeed.tech/tags/macos.md>), [releases](<https://devfeed.tech/tags/releases.md>)

### AI overview

Sketch reviews its 2025 product work, including the Athens, Barcelona, and Copenhagen releases. The updates introduced Stacks and Frames, expanded the Command Bar, added a glass effect for iOS and macOS 26 design, and included an MCP server and broader redesign work.

### Source excerpt

From Stacks and Frames, to Glass effects and a complete macOS Tahoe redesign -- here's everything we shipped at Sketch in 2025.

## Bootstrap Icons v1.12 and v1.13

DevFeed: [Bootstrap Icons v1.12 and v1.13](<https://devfeed.tech/articles/bootstrap-icons-v1-12-and-v1-13-22297.md>)

Original publisher: [Read original article](<https://blog.getbootstrap.com/2025/05/09/bootstrap-icons-1-12-1-13/>)

Author: Mark Otto

Published: 2025-05-09T00:01:00Z

Content type: release

Language: en

Sources: [Bootstrap.com](<https://devfeed.tech/sources/bootstrap-com.md>)

Topics: [Bootstrap](<https://devfeed.tech/topics/bootstrap.md>), [releases](<https://devfeed.tech/topics/releases.md>), [Sass](<https://devfeed.tech/topics/sass.md>), [Vite](<https://devfeed.tech/topics/vite.md>), [Figma Community](<https://devfeed.tech/topics/figma-community.md>), [npm](<https://devfeed.tech/topics/npm.md>), [GitHub](<https://devfeed.tech/topics/github.md>)

Tags: [bug-fixes](<https://devfeed.tech/tags/bug-fixes.md>), [docs](<https://devfeed.tech/tags/docs.md>), [figma-community](<https://devfeed.tech/tags/figma-community.md>), [github](<https://devfeed.tech/tags/github.md>), [icons](<https://devfeed.tech/tags/icons.md>), [install](<https://devfeed.tech/tags/install.md>), [npm](<https://devfeed.tech/tags/npm.md>), [releases](<https://devfeed.tech/tags/releases.md>), [v1](<https://devfeed.tech/tags/v1.md>), [vite](<https://devfeed.tech/tags/vite.md>)

### AI overview

A recap of Bootstrap Icons v1.12.x and v1.13.x releases, covering new icons, documentation updates, Sass guidance for Vite, bug fixes, a search hotfix, installation options, and publication of the Figma file to Figma Community.

### Source excerpt

In the last few weeks, a handful of new Bootstrap Icons releases have gone out. Here's a recap of what's new in our v1.12.x and v1.13.x releases so far. v1.12 v1.12.0 added a single icon, mostly because people wouldn't stop asking for it haha, and v1.12.1 added a page to the docs for it. That was all for Bluesky. v1.13.0 and v1.13.1 New in v1.13.0 are several icons, some guidance around how to use Sass files with Vite, and a few little bug fixes to some fill rules. v1.13.1 was a hotfix to resolve an issue with search on our docs.

## Zed Adds Icon Themes for Custom Folder and File Icons

DevFeed: [Zed Adds Icon Themes for Custom Folder and File Icons](<https://devfeed.tech/articles/add-some-color-to-your-life-with-icon-themes-13502.md>)

Original publisher: [Read original article](<https://zed.dev/blog/icon-themes>)

Author: Marshall Bowers

Published: 2025-02-05T00:00:00Z

Content type: release

Language: en

Sources: [Zed Industries - Blog](<https://devfeed.tech/sources/zed-industries-blog.md>)

Topics: [Extension](<https://devfeed.tech/topics/extension.md>), [ide](<https://devfeed.tech/topics/ide.md>)

Tags: [extensions](<https://devfeed.tech/tags/extensions.md>), [icons](<https://devfeed.tech/tags/icons.md>), [palette](<https://devfeed.tech/tags/palette.md>)

### AI overview

Zed now supports icon themes that change the appearance of folder and file icons. Users can install available themes as extensions and switch between them through the command palette.

### Source excerpt

You can now use icon themes to change the way folder and file icons look in Zed

## Toggle Labels With Icons - Personalizing Accessibility

DevFeed: [Toggle Labels With Icons - Personalizing Accessibility](<https://devfeed.tech/articles/toggle-labels-with-icons-personalizing-accessibility-38480.md>)

Original publisher: [Read original article](<https://eevis.codes/blog/2024-04-21/toggle-labels-with-icons-personalizing-accessibility/>)

Author: Eevis Panula

Published: 2025-06-11T04:23:15.051000Z

Content type: tutorial

Language: en

Sources: [Eevis Blog](<https://devfeed.tech/sources/eevis-blog.md>)

Topics: [Accessibility](<https://devfeed.tech/topics/accessibility.md>), [personalization](<https://devfeed.tech/topics/personalization.md>), [Icons](<https://devfeed.tech/topics/icons.md>), [ui](<https://devfeed.tech/topics/ui.md>), [User interface design](<https://devfeed.tech/topics/ui-design.md>), [User experience (UX)](<https://devfeed.tech/topics/ux.md>), [implementation](<https://devfeed.tech/topics/implementation.md>)

Tags: [accessibility](<https://devfeed.tech/tags/accessibility.md>), [how-to](<https://devfeed.tech/tags/how-to.md>), [icons](<https://devfeed.tech/tags/icons.md>), [implementation](<https://devfeed.tech/tags/implementation.md>), [personalization](<https://devfeed.tech/tags/personalization.md>), [ui](<https://devfeed.tech/tags/ui.md>), [users](<https://devfeed.tech/tags/users.md>), [ux](<https://devfeed.tech/tags/ux.md>)

### AI overview

This tutorial explains how personalization can improve accessibility by letting users toggle text labels alongside icons. It discusses why unlabeled icons can be difficult to understand for some users and outlines a settings-based implementation using a data store.

### Source excerpt

As mentioned in my previous blog post, Personalizing Accessibility with Settings, accessibility for the broadest group of users often requires some personalization. What is accessible for one might not be accessible for another. In this blog post, I will discuss one example of accessibility issues that could be solved with the help of settings: Icons and the need for text labels accompanying them. As you can see from the next section, this particular issue is personal to me, and I wanted to give an example of how to solve it. Why? Icons are not universal. I can't tell you how many times I've opened an app, seen icons (without labels), and wondered what the heck they mean. Where do they lead me? What happens if I press the button with an icon? Do I get to the place I'm looking for? Or does my phone explode? Who knows. The UI is not communicating it to me. I know UX people say that it's about learning. "If you just use the app for long enough, you'll learn". But the thing is, I've had a TBI, which has affected... You guessed right, my memory. So, I find it super frustrating when there are all kinds of symbols I don't understand without text labels, and I have no idea what to do with them. These apps make me frustrated. And that's not the goal of an app, right? On the other hand, I know some people benefit from not having those labels present. Also, almost every designer I've talked to about this topic seemed to think that having text in the UI is ugly (yes, I'm exaggerating a bit.) So, I'm coming up with a solution to help both groups - those who need the labels and those who don't need them: Personalization -- a setting in the app to toggle showing labels with icons. How? This section will present one way to add this toggle in settings. It's not a complete solution, as the actual implementation varies based on your app's architectural patterns. It aims to provide guidelines on how to do things by showing one example. Settings Data Store The first step is to add settin

## Meet the Maker: Duncan Horne

DevFeed: [Meet the Maker: Duncan Horne](<https://devfeed.tech/articles/meet-the-maker-duncan-horne-9110.md>)

Original publisher: [Read original article](<https://www.sketch.com/blog/meet-the-maker-duncan-horne/>)

Author: Duncan H.

Published: 2024-01-08T15:00:53Z

Content type: article

Language: en

Sources: [Sketch Blog](<https://devfeed.tech/sources/sketch-blog.md>)

Topics: [Sketch](<https://devfeed.tech/topics/sketch.md>), [Front end](<https://devfeed.tech/topics/frontend.md>), [App](<https://devfeed.tech/topics/app.md>)

Tags: [advice](<https://devfeed.tech/tags/advice.md>), [app](<https://devfeed.tech/tags/app.md>), [design](<https://devfeed.tech/tags/design.md>), [designer](<https://devfeed.tech/tags/designer.md>), [features](<https://devfeed.tech/tags/features.md>), [front-end](<https://devfeed.tech/tags/front-end.md>), [icons](<https://devfeed.tech/tags/icons.md>), [inspiration](<https://devfeed.tech/tags/inspiration.md>), [made-with-sketch](<https://devfeed.tech/tags/made-with-sketch.md>)

### AI overview

An interview with freelance icon designer and front-end developer Duncan Horne about his use of Sketch, his inspirations, and the tools and features he relies on, including strokes, gradients, Blend Modes, Blur Tools, and the Vector Tool.

### Source excerpt

"If you see a really cool icon design with a crazy effect, try and recreate it yourself."

## Bootstrap Icons v1.11.0

DevFeed: [Bootstrap Icons v1.11.0](<https://devfeed.tech/articles/bootstrap-icons-v1-11-0-22291.md>)

Original publisher: [Read original article](<https://blog.getbootstrap.com/2023/09/12/bootstrap-icons-1-11-0/>)

Author: Mark Otto

Published: 2023-09-12T00:01:00Z

Content type: release

Language: en

Sources: [Bootstrap.com](<https://devfeed.tech/sources/bootstrap-com.md>)

Topics: [releases](<https://devfeed.tech/topics/releases.md>), [Bootstrap](<https://devfeed.tech/topics/bootstrap.md>)

Tags: [figma](<https://devfeed.tech/tags/figma.md>), [figma-community](<https://devfeed.tech/tags/figma-community.md>), [github](<https://devfeed.tech/tags/github.md>), [icons](<https://devfeed.tech/tags/icons.md>), [issue-tracker](<https://devfeed.tech/tags/issue-tracker.md>), [npm](<https://devfeed.tech/tags/npm.md>), [release](<https://devfeed.tech/tags/release.md>), [search](<https://devfeed.tech/tags/search.md>), [v1](<https://devfeed.tech/tags/v1.md>)

### AI overview

Bootstrap Icons v1.11.0 adds 100 new icons, bringing the collection to more than 2,000 icons. The release also introduces version tags for icon pages, npm and Composer installation options, GitHub downloads, and a newly published Figma Community file.

### Source excerpt

Bootstrap Icons v1.11.0 has arrived with 100 new icons--including new floppy disk icons, additional brand icons, new person icons, new emojis, some birthday cake, a few new science icons, and more. We're now at over 2,000 icons! 100 new icons Here's a quick look at all the new icons in v1.11.0: Check out the pull request for all the details on which icons were added and which were updated.

## A redesigned Google Fonts website helps you find fonts and icons for projects

DevFeed: [A redesigned Google Fonts website helps you find fonts and icons for projects](<https://devfeed.tech/articles/the-new-google-fonts-find-what-you-re-looking-for-29215.md>)

Original publisher: [Read original article](<https://material.io/blog/2023-google-fonts-redesign>)

Published: 2023-09-07T13:00:00Z

Content type: release

Language: en

Sources: [Material.io - Material Design](<https://devfeed.tech/sources/material-io-material-design.md>)

Topics: [Google](<https://devfeed.tech/topics/google.md>), [Website](<https://devfeed.tech/topics/website.md>), [Icons](<https://devfeed.tech/topics/icons.md>)

Tags: [google](<https://devfeed.tech/tags/google.md>), [icons](<https://devfeed.tech/tags/icons.md>), [project](<https://devfeed.tech/tags/project.md>), [website](<https://devfeed.tech/tags/website.md>)

### AI overview

The article announces a redesigned Google Fonts website intended to help users find fonts and icons for their projects.

### Source excerpt

A redesigned Google Fonts website helps you find the right fonts and icons for your project

## Product Update - August 2023

DevFeed: [Product Update - August 2023](<https://devfeed.tech/articles/product-update-august-2023-30983.md>)

Original publisher: [Read original article](<https://www.mintlify.com/blog/august-2023>)

Author: Joshua Kim

Published: 2023-08-31T00:00:00Z

Content type: release

Language: en

Sources: [Mintlify Blog](<https://devfeed.tech/sources/mintlify-blog.md>)

Topics: [Command-line interface](<https://devfeed.tech/topics/cli.md>), [Documentation](<https://devfeed.tech/topics/documentation.md>), [LaTeX](<https://devfeed.tech/topics/latex.md>)

Tags: [announcements](<https://devfeed.tech/tags/announcements.md>), [cli](<https://devfeed.tech/tags/cli.md>), [documentation](<https://devfeed.tech/tags/documentation.md>), [icons](<https://devfeed.tech/tags/icons.md>), [improvements](<https://devfeed.tech/tags/improvements.md>), [latex](<https://devfeed.tech/tags/latex.md>), [mobile](<https://devfeed.tech/tags/mobile.md>), [product](<https://devfeed.tech/tags/product.md>), [update](<https://devfeed.tech/tags/update.md>)

### AI overview

Mintlify's August 2023 product update introduced CLI v4 with local preview capabilities and faster page loads, along with documentation feedback configuration, LaTeX support, mobile header copying, and expanded icon integration.

### Source excerpt

In August, we brought a range of improvements and expansions to our platform, including our CLI v4, documentation feedback, LateX support, copying headers from mobile, and icon add-ins.

## Building a Note-Taking App in Compose

DevFeed: [Building a Note-Taking App in Compose](<https://devfeed.tech/articles/building-a-note-taking-app-in-compose-20024.md>)

Original publisher: [Read original article](<https://technology.doximity.com/articles/building-a-note-taking-app-in-compose>)

Author: Doximity

Published: 2023-07-05T19:47:00Z

Content type: tutorial

Language: en

Sources: [Doximity](<https://devfeed.tech/sources/doximity.md>)

Topics: [Jetpack Compose](<https://devfeed.tech/topics/jetpack-compose.md>), [App](<https://devfeed.tech/topics/app.md>), [Code](<https://devfeed.tech/topics/code.md>), [Template](<https://devfeed.tech/topics/template.md>)

Tags: [app](<https://devfeed.tech/tags/app.md>), [architecture](<https://devfeed.tech/tags/architecture.md>), [build](<https://devfeed.tech/tags/build.md>), [building](<https://devfeed.tech/tags/building.md>), [class](<https://devfeed.tech/tags/class.md>), [clean-architecture](<https://devfeed.tech/tags/clean-architecture.md>), [code](<https://devfeed.tech/tags/code.md>), [collect](<https://devfeed.tech/tags/collect.md>), [compose](<https://devfeed.tech/tags/compose.md>), [data-class](<https://devfeed.tech/tags/data-class.md>), [di](<https://devfeed.tech/tags/di.md>), [extension-function](<https://devfeed.tech/tags/extension-function.md>), [flow](<https://devfeed.tech/tags/flow.md>), [icons](<https://devfeed.tech/tags/icons.md>), [implement](<https://devfeed.tech/tags/implement.md>), [koin](<https://devfeed.tech/tags/koin.md>), [list](<https://devfeed.tech/tags/list.md>), [state](<https://devfeed.tech/tags/state.md>), [state-management](<https://devfeed.tech/tags/state-management.md>), [view](<https://devfeed.tech/tags/view.md>)

### AI overview

A case study showing how to build a note-taking app with Jetpack Compose. It models note state, renders the notes UI, collects note data through a presenter and Clean Architecture use cases, and plans events for adding, editing, checking, and deleting notes.

### Source excerpt

In this case study, we will build a note-taking app that lets the user add, edit and delete notes. It uses Compose for both the view and presentation layers! Note: This is a follow up to Part 1: Simplifying State Management with Compose and assumes the reader is already familiar with Jetpack Compose. The Template I find it useful to start with the model that represents the state of the screen we're building. It will have a list of notes, with each note containing properties for the text and checkbox: data class NotesUiModel(val notes: List<Note>) : UiModel { data class Note(val text: String, val isChecked: Boolean) : UiModel } It'll be the job of the presenter to produce this model. Initially, let's implement a stub to return an empty list of notes (we'll ignore parameters for now): class NotesListPresenter : Presenter<NotesUiModel, Unit> { @Composable override fun present(params: Unit): NotesUiModel { return NotesUiModel(notes = emptyList()) } } Then we can build our view to render the model that's returned by the presenter: @Composable fun NotesScreen() { val presenter: NotesListPresenter = koinInject() // we use koin for DI val uiModel = presenter.present(Unit) Column { TopAppBar(title = { Text("Notes") }) Notes(uiModel) } } } The View The views themselves are pretty self-explanatory if you're already familiar with building UIs in Compose. For the notes, we'll take in a NotesUiModel argument and create a LazyColumn with the notes property. A FAB button is used for adding new notes, although we'll skip the triggering of events and return to this part in a little bit: @Composable private fun Notes(uiModel: NotesUiModel) { Box { LazyColumn { items(uiModel.notes) { note -> Note(note) } } FloatingActionButton(onClick = { /* TODO */ }) { Icon(imageVector = Icons.Rounded.Add) } } } Then we can render each note with a checkbox, text field and delete button: @Composable private fun Note(uiModel: Note) { Row { Checkbox( checked = uiModel.isChecked, onCheckedChange = { /* T

## Show BottomBar conditionally in Compose

DevFeed: [Show BottomBar conditionally in Compose](<https://devfeed.tech/articles/show-bottombar-conditionally-in-compose-22663.md>)

Original publisher: [Read original article](<https://www.valueof.io/blog/should-show-bottombar-conditionally-in-jetpack-compose>)

Author: James Shvarts

Published: 2022-11-08T21:38:12Z

Content type: tutorial

Language: en

Sources: [Android Blog - Mobile Dev Notes](<https://devfeed.tech/sources/android-blog-mobile-dev-notes.md>)

Topics: [Jetpack Compose](<https://devfeed.tech/topics/jetpack-compose.md>), [Compose](<https://devfeed.tech/topics/compose.md>), [App](<https://devfeed.tech/topics/app.md>)

Tags: [bottom-navigation](<https://devfeed.tech/tags/bottom-navigation.md>), [class](<https://devfeed.tech/tags/class.md>), [compose](<https://devfeed.tech/tags/compose.md>), [icons](<https://devfeed.tech/tags/icons.md>), [jetpack](<https://devfeed.tech/tags/jetpack.md>), [jetpack-compose](<https://devfeed.tech/tags/jetpack-compose.md>), [navigation](<https://devfeed.tech/tags/navigation.md>), [route](<https://devfeed.tech/tags/route.md>), [screen](<https://devfeed.tech/tags/screen.md>)

### AI overview

A tutorial on conditionally showing or hiding a bottom navigation bar in Jetpack Compose based on the current navigation route. It uses a custom AppState class, separate navigation graphs for tabs, and a detail-screen navigation example.

### Source excerpt

Conditionally show BottomBar with bottom navigation in Jetpack Compose

## Extending SwipeToDismiss in Jetpack compose

DevFeed: [Extending SwipeToDismiss in Jetpack compose](<https://devfeed.tech/articles/extending-swipetodismiss-in-jetpack-compose-25779.md>)

Original publisher: [Read original article](<https://www.sinasamaki.com/extending-swipetodismiss-in-jetpack-compose/>)

Author: sinasamaki

Published: 2022-09-04T00:00:00Z

Content type: tutorial

Language: en

Sources: [sinasamaki](<https://devfeed.tech/sources/sinasamaki.md>)

Topics: [Jetpack Compose](<https://devfeed.tech/topics/jetpack-compose.md>), [ui](<https://devfeed.tech/topics/ui.md>), [Tutorial](<https://devfeed.tech/topics/tutorial.md>)

Tags: [article](<https://devfeed.tech/tags/article.md>), [color](<https://devfeed.tech/tags/color.md>), [compose](<https://devfeed.tech/tags/compose.md>), [customization](<https://devfeed.tech/tags/customization.md>), [extend](<https://devfeed.tech/tags/extend.md>), [how-to](<https://devfeed.tech/tags/how-to.md>), [icons](<https://devfeed.tech/tags/icons.md>), [jetpack-compose](<https://devfeed.tech/tags/jetpack-compose.md>), [state](<https://devfeed.tech/tags/state.md>), [ui](<https://devfeed.tech/tags/ui.md>)

### AI overview

This tutorial explains how to extend Jetpack Compose's SwipeToDismiss composable for list actions by adding configurable swipe behavior, threshold state, colors, icons, and other UI improvements.

### Source excerpt

This is a common UI pattern to perform quick actions on lists of items. In this article, we will go over how to build a rich, expressive swipe to dismiss example. Jetpack compose has a default composable that provides this functionality called SwipeToDismiss. This composable offers some customization but we

## Optimized Chessboard Pattern VectorDrawable in Kotlin

DevFeed: [Optimized Chessboard Pattern VectorDrawable in Kotlin](<https://devfeed.tech/articles/optimized-chessboard-pattern-vectordrawable-in-kotlin-26304.md>)

Original publisher: [Read original article](<https://blog.louiscad.com/optimized-chessboard-pattern-vectordrawable-in-kotlin>)

Author: Louis CAD

Published: 2022-07-15T14:16:49Z

Content type: tutorial

Language: en

Sources: [Louis CAD doing software](<https://devfeed.tech/sources/louis-cad-doing-software.md>)

Topics: [Kotlin](<https://devfeed.tech/topics/kotlin.md>), [Android](<https://devfeed.tech/topics/android.md>), [SVG](<https://devfeed.tech/topics/svg.md>)

Tags: [android](<https://devfeed.tech/tags/android.md>), [code](<https://devfeed.tech/tags/code.md>), [design](<https://devfeed.tech/tags/design.md>), [graphic-design](<https://devfeed.tech/tags/graphic-design.md>), [graphics](<https://devfeed.tech/tags/graphics.md>), [icons](<https://devfeed.tech/tags/icons.md>), [kotlin](<https://devfeed.tech/tags/kotlin.md>), [scripting](<https://devfeed.tech/tags/scripting.md>), [svg](<https://devfeed.tech/tags/svg.md>)

### AI overview

A Kotlin developer describes creating a chessboard pattern in Android VectorDrawable format for distinguishing debug and minified Wear OS app variants. The resulting file was five times smaller than the initial version.

### Source excerpt

Trust me, I would have never been able to make such an efficient VectorDrawable with a designer tool like Sketch, Affinity Designer, or Adobe Illustrator. This is the story of how I came to draw a chessboard pattern in VectorDrawable format using Kot...

## Supporting adaptive themed icons on Android 13

DevFeed: [Supporting adaptive themed icons on Android 13](<https://devfeed.tech/articles/supporting-adaptive-themed-icons-on-android-13-28363.md>)

Original publisher: [Read original article](<https://siddroid.com/post/android/supporting-adaptive-themed-icons-on-android-13/>)

Author: Siddhesh Patil

Published: 2022-05-19T11:50:55Z

Content type: tutorial

Language: en

Sources: [Sid Patil - Android Engineer and Kotlin Advocate](<https://devfeed.tech/sources/sid-patil-android-engineer-and-kotlin-advocate.md>)

Topics: [Android](<https://devfeed.tech/topics/android.md>), [android-13](<https://devfeed.tech/topics/android-13.md>), [material-you](<https://devfeed.tech/topics/material-you.md>), [implementation](<https://devfeed.tech/topics/implementation.md>), [personalization](<https://devfeed.tech/topics/personalization.md>), [Specifications](<https://devfeed.tech/topics/specifications.md>), [ui](<https://devfeed.tech/topics/ui.md>)

Tags: [adaptive](<https://devfeed.tech/tags/adaptive.md>), [adaptive-icons](<https://devfeed.tech/tags/adaptive-icons.md>), [android](<https://devfeed.tech/tags/android.md>), [android-13](<https://devfeed.tech/tags/android-13.md>), [android-13-features](<https://devfeed.tech/tags/android-13-features.md>), [android-system-ui](<https://devfeed.tech/tags/android-system-ui.md>), [android-tiramisu](<https://devfeed.tech/tags/android-tiramisu.md>), [articles-by-sid-patil](<https://devfeed.tech/tags/articles-by-sid-patil.md>), [icons](<https://devfeed.tech/tags/icons.md>), [implementation](<https://devfeed.tech/tags/implementation.md>), [kotlin](<https://devfeed.tech/tags/kotlin.md>), [material-you](<https://devfeed.tech/tags/material-you.md>), [md3](<https://devfeed.tech/tags/md3.md>), [migrate](<https://devfeed.tech/tags/migrate.md>), [migrating-apps-to-android-tiramisu](<https://devfeed.tech/tags/migrating-apps-to-android-tiramisu.md>), [migrating-to-android-13](<https://devfeed.tech/tags/migrating-to-android-13.md>), [monet](<https://devfeed.tech/tags/monet.md>), [monet-theming](<https://devfeed.tech/tags/monet-theming.md>), [personalization](<https://devfeed.tech/tags/personalization.md>), [specifications](<https://devfeed.tech/tags/specifications.md>), [support](<https://devfeed.tech/tags/support.md>), [supporting-themed-icons-on-android-13](<https://devfeed.tech/tags/supporting-themed-icons-on-android-13.md>), [system-ui-apk](<https://devfeed.tech/tags/system-ui-apk.md>), [themed-icons](<https://devfeed.tech/tags/themed-icons.md>), [tiramisu](<https://devfeed.tech/tags/tiramisu.md>), [ui](<https://devfeed.tech/tags/ui.md>)

### AI overview

A tutorial on adding adaptive themed icon support to Android applications targeting Android 13 (Tiramisu). It explains the role of Material You and Monet, and identifies Android 13, device-maker Monet support, launcher support, and app-level support as requirements.

### Source excerpt

One of the coolest features of Android 13 with Material You and Monet is dynamically themed icons. Let us take a look at how we can migrate our apps to Tiramisu and add support for custom themed icons to match the system wide dynamic theme colors.

## Material Icons: Sehee Lee

DevFeed: [Material Icons: Sehee Lee](<https://devfeed.tech/articles/material-icons-sehee-lee-29296.md>)

Original publisher: [Read original article](<https://material.io/blog/material-icons-sehee-lee-interview>)

Published: 2022-05-11T10:00:00Z

Content type: article

Language: en

Sources: [Material.io - Material Design](<https://devfeed.tech/sources/material-io-material-design.md>)

Topics: [Icons](<https://devfeed.tech/topics/icons.md>), [Design system](<https://devfeed.tech/topics/design-system.md>), [Google](<https://devfeed.tech/topics/google.md>)

Tags: [design-systems](<https://devfeed.tech/tags/design-systems.md>), [designer](<https://devfeed.tech/tags/designer.md>), [google](<https://devfeed.tech/tags/google.md>), [icons](<https://devfeed.tech/tags/icons.md>)

### AI overview

An interview with Sehee Lee, a Senior Visual Designer who leads icons and design systems for Google Fonts.

### Source excerpt

An interview with Senior Visual Designer leading icons and design systems for Google Fonts, Sehee Lee

## The Overcast Redesign: Part One

DevFeed: [The Overcast Redesign: Part One](<https://devfeed.tech/articles/the-overcast-redesign-part-one-38592.md>)

Original publisher: [Read original article](<https://marco.org/2022/03/25/overcast-redesign-2022>)

Author: Marco Arment

Published: 2022-03-25T14:57:51Z

Content type: release

Language: en

Sources: [Marco.org](<https://devfeed.tech/sources/marco-org.md>)

Topics: [App](<https://devfeed.tech/topics/app.md>), [ui](<https://devfeed.tech/topics/ui.md>), [iOS](<https://devfeed.tech/topics/ios.md>), [screen](<https://devfeed.tech/topics/screen.md>), [Font](<https://devfeed.tech/topics/font.md>), [navigation](<https://devfeed.tech/topics/navigation.md>), [Icons](<https://devfeed.tech/topics/icons.md>), [color](<https://devfeed.tech/topics/color.md>), [notifications](<https://devfeed.tech/topics/notifications.md>)

Tags: [bug](<https://devfeed.tech/tags/bug.md>), [customizable](<https://devfeed.tech/tags/customizable.md>), [design](<https://devfeed.tech/tags/design.md>), [drag-and-drop](<https://devfeed.tech/tags/drag-and-drop.md>), [feature](<https://devfeed.tech/tags/feature.md>), [icons](<https://devfeed.tech/tags/icons.md>), [ios](<https://devfeed.tech/tags/ios.md>), [notifications](<https://devfeed.tech/tags/notifications.md>), [redesign](<https://devfeed.tech/tags/redesign.md>), [update](<https://devfeed.tech/tags/update.md>)

### AI overview

Overcast's 2022.2 update introduces the first phase of a major redesign focused on the home screen, playlist screen, typography, and spacing. It adds customizable playlist colors and icons, reordering, pinned podcasts, additional episode views, Mark as Played, special playlists, theme tint colors, and reliability improvements for notifications and background downloads.

### Source excerpt

Overcast's latest update (2022.2) brings the largest redesign in its nearly-eight-year history, plus many of the most frequently requested features and lots of under-the-hood improvements. I'm pretty proud of this one. For this first and largest phase of the redesign, I focused on the home screen, playlist screen, typography, and spacing. (I plan to revamp the now-playing and individual-podcast screens in a later update.) The home screen is radically different: Home screen, before (left) and after (right). Playlists now have strong visual identities for nicer and easier navigation. Each playlist has a customizable color, and a custom icon can be selected from over 3,000 SF Symbols to match modern iOS design and the other icons within Overcast. And playlists can be manually reordered with drag-and-drop. Recently played and newly published episodes can now be displayed on the home screen for quick access, much like the widget and CarPlay experience. Podcasts can now be pinned to the top of the home-screen list. Pinned podcasts can also be manually reordered with drag-and-drop. I've also rethought the old stacked "Podcasts" and "Played Podcasts" sections to better match people's needs and expectations. Now, the toggle atop the podcast list switches between three modes: podcasts with current episodes, all followed podcasts, and inactive podcasts (those that you don't follow and therefore won't get any more episodes from, or haven't posted a new episode in a long time). The playlist screen's structure remains mostly the same, while refining the design for the modern era: Playlist screen, before (left) and after (right). Here, it's more apparent that I've replaced the system San Francisco font with an alternate variant, San Francisco Rounded, to increase legibility and better match the personality of the app. I've also added highly demanded features: By far, Overcast's most-requested feature is a Mark as Played feature. That's now available as a checkmark button on episod

## Bottom Navigation Animation in Jetpack Compose

DevFeed: [Bottom Navigation Animation in Jetpack Compose](<https://devfeed.tech/articles/bottom-navigation-animation-in-jetpack-compose-25767.md>)

Original publisher: [Read original article](<https://www.sinasamaki.com/bottom-navigation-animation-in-jetpack-compose/>)

Author: sinasamaki

Published: 2022-02-21T00:00:00Z

Content type: tutorial

Language: en

Sources: [sinasamaki](<https://devfeed.tech/sources/sinasamaki.md>)

Topics: [Jetpack Compose](<https://devfeed.tech/topics/jetpack-compose.md>), [navigation](<https://devfeed.tech/topics/navigation.md>), [Compose](<https://devfeed.tech/topics/compose.md>), [ui](<https://devfeed.tech/topics/ui.md>), [Code](<https://devfeed.tech/topics/code.md>)

Tags: [article](<https://devfeed.tech/tags/article.md>), [bottom-navigation](<https://devfeed.tech/tags/bottom-navigation.md>), [class](<https://devfeed.tech/tags/class.md>), [code](<https://devfeed.tech/tags/code.md>), [color](<https://devfeed.tech/tags/color.md>), [components](<https://devfeed.tech/tags/components.md>), [compose](<https://devfeed.tech/tags/compose.md>), [icons](<https://devfeed.tech/tags/icons.md>), [implement](<https://devfeed.tech/tags/implement.md>), [jetpack-compose](<https://devfeed.tech/tags/jetpack-compose.md>), [libraries](<https://devfeed.tech/tags/libraries.md>), [navigation](<https://devfeed.tech/tags/navigation.md>), [screen](<https://devfeed.tech/tags/screen.md>), [sealed-class](<https://devfeed.tech/tags/sealed-class.md>), [state](<https://devfeed.tech/tags/state.md>), [ui](<https://devfeed.tech/tags/ui.md>)

### AI overview

A tutorial on building a custom animated bottom navigation interface in Jetpack Compose. It starts with a functional navigation UI and then adds animations for item weight, size, height, shadows, corners, opacity, and title visibility using Compose animation components.

### Source excerpt

Bottom navigation UI is used to navigate between different top level screens in apps. There is a composable available in the compose libraries, but it could be improved with some more animations. Using only the animation components provided in the jetpack compose libraries, we could implement a more custom bottom

## Implement Themed Icons (Android 13)

DevFeed: [Implement Themed Icons (Android 13)](<https://devfeed.tech/articles/implement-themed-icons-android-13-26019.md>)

Original publisher: [Read original article](<https://proandroiddev.com/implement-themed-icons-android-13-d20b89233681?source=rss-e93d234beac6------2>)

Author: Yahor Urbanovich

Published: 2022-02-16T10:31:44Z

Content type: tutorial

Language: en

Sources: [Stories by Yahor Urbanovich on Medium](<https://devfeed.tech/sources/stories-by-yahor-urbanovich-on-medium.md>)

Topics: [Android](<https://devfeed.tech/topics/android.md>), [API](<https://devfeed.tech/topics/api.md>), [App](<https://devfeed.tech/topics/app.md>)

Tags: [android](<https://devfeed.tech/tags/android.md>), [android-13](<https://devfeed.tech/tags/android-13.md>), [api](<https://devfeed.tech/tags/api.md>), [developer-preview](<https://devfeed.tech/tags/developer-preview.md>), [how-to](<https://devfeed.tech/tags/how-to.md>), [icons](<https://devfeed.tech/tags/icons.md>), [implement](<https://devfeed.tech/tags/implement.md>), [material-you](<https://devfeed.tech/tags/material-you.md>), [storytelling](<https://devfeed.tech/tags/storytelling.md>), [themed-icon](<https://devfeed.tech/tags/themed-icon.md>), [themed-icons](<https://devfeed.tech/tags/themed-icons.md>)

### AI overview

A tutorial on implementing themed app icons in Android 13. It explains the limitations of the Android 12 approach and shows how to provide a monochrome icon resource that the system can tint dynamically.

### Source excerpt

Part of the Material You concept is Themed Icons. It means that all icons starting from Android 12 will be the same color and change dynamically based on wallpapers. Android 12 introduced a beta option for enabling Themed Icons, but icons looked inconsistently across the system. Only Google apps had themed icons, other looks the same as previous. Android 12 So far not available no API for developers. I found only a few materials on how to implement themed icons on Android 12. For example: Material You App Icons: Part Way There Briefly, we need to override icon colors in the values-v31 folder to use new Material You colors. It will work, but with several limitations: Changing color in the system doesn't apply to the launch icon. Only after reinstall. Disabling the Themed icons feature doesn't affect the launch icon. Simply, the icon has dynamic color permanently. It's logical, the application can't have two launch icons simultaneously. The Pixel Launcher does the whole magic under the hood and stores an additional set of icons with monochrome icons for all Google apps. Pixel Launcher APK resourcesAndroid 13 way Google recently announced the first Developer Preview of Android 13, while there are a lot of new APIs. One of them is that developers got access to API for Themed app icons. To implement the new approach, we need to take several steps: Clear icon from shadows, unnecessary details and etc. Otherwise, the icon will differ from the uniform style. Icon with shadow 2. Add <monochrome android:drawable=""/> attribute to the <adaptive-icon> element. monochrome tag in icon resourceNote: If android:roundIcon and android:icon are both in your manifest, you must either remove the reference to android:roundIcon or supply the monochrome icon in the drawable defined by the android:roundIcon attribute. That's all, the system automatically applies tint color for the monochrome icon. Demo result: https://medium.com/media/5f60ea9df88d7a59f2d7357f128fcc14/hrefOther cases The rec

## Redesign: Version 5.0

DevFeed: [Redesign: Version 5.0](<https://devfeed.tech/articles/redesign-version-5-0-37604.md>)

Original publisher: [Read original article](<https://www.taniarascia.com/redesign-version-5/>)

Author: hello@taniarascia.com

Published: 2021-09-02T00:00:00Z

Content type: article

Language: en

Sources: [Tania Rascia](<https://devfeed.tech/sources/tania-rascia.md>)

Topics: [Website](<https://devfeed.tech/topics/website.md>), [vs-code](<https://devfeed.tech/topics/vs-code.md>), [Web Development](<https://devfeed.tech/topics/web-development.md>), [CSS](<https://devfeed.tech/topics/css.md>), [GUI](<https://devfeed.tech/topics/gui.md>)

Tags: [css](<https://devfeed.tech/tags/css.md>), [icons](<https://devfeed.tech/tags/icons.md>), [interactive](<https://devfeed.tech/tags/interactive.md>), [keyboard](<https://devfeed.tech/tags/keyboard.md>), [meta](<https://devfeed.tech/tags/meta.md>), [redesign](<https://devfeed.tech/tags/redesign.md>), [version](<https://devfeed.tech/tags/version.md>), [vs-code](<https://devfeed.tech/tags/vs-code.md>), [website](<https://devfeed.tech/tags/website.md>)

### AI overview

The author describes redesigning a personal website from scratch with a VS Code-inspired interface, categorized posts, pixel-art icons, a light/dark theme switcher, customizable colors, and improved keyboard accessibility. The site uses plain CSS and has evolved through multiple iterations.

### Source excerpt

Over the last week or two I've had a lot of fun building out a new site from scratch. I thought it would be fun to make my site look like a...

## Google Fonts Adds Open Source Material Design Icons

DevFeed: [Google Fonts Adds Open Source Material Design Icons](<https://devfeed.tech/articles/google-fonts-material-icons-29261.md>)

Original publisher: [Read original article](<https://material.io/blog/google-fonts-material-icons>)

Published: 2021-03-02T13:00:00Z

Content type: article

Language: en

Sources: [Material.io - Material Design](<https://devfeed.tech/sources/material-io-material-design.md>)

Topics: [Google](<https://devfeed.tech/topics/google.md>), [Icons](<https://devfeed.tech/topics/icons.md>), [Material Design](<https://devfeed.tech/topics/material-design.md>), [Open Source](<https://devfeed.tech/topics/open-source.md>)

Tags: [fonts](<https://devfeed.tech/tags/fonts.md>), [google](<https://devfeed.tech/tags/google.md>), [icons](<https://devfeed.tech/tags/icons.md>), [material-design](<https://devfeed.tech/tags/material-design.md>), [open-source](<https://devfeed.tech/tags/open-source.md>)

### AI overview

Google Fonts now supports open source icons, beginning with the Material Design icon set.

### Source excerpt

Google Fonts now supports open source icons, starting with the Material Design icon set

## Icon Fonts, Popups and Infinite Scroll

DevFeed: [Icon Fonts, Popups and Infinite Scroll](<https://devfeed.tech/articles/icon-fonts-popups-and-infinite-scroll-19327.md>)

Original publisher: [Read original article](<https://www.codenameone.com/blog/icon-fonts-popups-infinite-scroll/>)

Author: Shai Almog

Published: 2019-09-06T00:00:00Z

Content type: article

Language: en

Sources: [CodeName One](<https://devfeed.tech/sources/codename-one.md>)

Topics: [Icon font](<https://devfeed.tech/topics/icon-font.md>), [dialog](<https://devfeed.tech/topics/dialog.md>), [infinite scroll](<https://devfeed.tech/topics/infinite-scroll.md>)

Tags: [api](<https://devfeed.tech/tags/api.md>), [dialog](<https://devfeed.tech/tags/dialog.md>), [fonts](<https://devfeed.tech/tags/fonts.md>), [icons](<https://devfeed.tech/tags/icons.md>), [integration](<https://devfeed.tech/tags/integration.md>)

### AI overview

This partial Codename One update describes easier arbitrary icon-font integration, updated material font constants, and a graphics-based popup arrow API with improved customization and cross-platform behavior. It also introduces infinite-scroll changes, although the supplied text is incomplete.

### Source excerpt

As I mentioned in the last post there are a lot of new features we need to go over and it will take time to cover everything. In fact this is still a partial list and there's a lot more on the way... Easier Icon Font Integration First off Thomas submitted a PR for a few new font icon methods: Specifically in Label he added: public void setFontIcon(Font font, char c); public void setFontIcon(Font font, char c, float size); And in FontImage he added:

## Implementing Dark Themes in Android Applications

DevFeed: [Implementing Dark Themes in Android Applications](<https://devfeed.tech/articles/midnight-in-android-themes-29363.md>)

Original publisher: [Read original article](<https://arturdryomov.dev/posts/midnight-in-android-themes/>)

Author: Artur Dryomov

Published: 2019-08-15T00:00:00Z

Content type: tutorial

Language: en

Sources: [Artur Dryomov](<https://devfeed.tech/sources/artur-dryomov.md>)

Topics: [Dark Mode](<https://devfeed.tech/topics/dark-mode.md>), [Android](<https://devfeed.tech/topics/android.md>)

Tags: [android](<https://devfeed.tech/tags/android.md>), [color](<https://devfeed.tech/tags/color.md>), [guide](<https://devfeed.tech/tags/guide.md>), [icons](<https://devfeed.tech/tags/icons.md>), [themes](<https://devfeed.tech/tags/themes.md>)

### AI overview

A guide to implementing dark themes in the Juno rider Android application, covering theme switching across Android versions, themed and themeless colors, system bars, and vector icons.

### Source excerpt

Android Q introduces dark themes. Or night mode? No idea. Anyways, it is here and can be helpful with using applications in dark environments or with bringing back that sweet Winamp skins vibe. Implementing dark themes is surprisingly deep and affects the whole application. At times it feels like a redesign. I've tried to collect steps we've made to introduce the dark theme in the Juno rider application and make a (kind of) comprehensive guide. Let's jump in!

## Philips Hue adaptive icon

DevFeed: [Philips Hue adaptive icon](<https://devfeed.tech/articles/philips-hue-adaptive-icon-28682.md>)

Original publisher: [Read original article](<https://jeroenmols.com/blog/2019/07/03/adaptiveicon/>)

Author: info@jeroenmols.com (Jeroen Mols)

Published: 2019-07-03T00:00:00Z

Content type: tutorial

Language: en

Sources: [Jeroen Mols](<https://devfeed.tech/sources/jeroen-mols.md>)

Topics: [Android](<https://devfeed.tech/topics/android.md>), [Android Studio](<https://devfeed.tech/topics/android-studio.md>)

Tags: [adaptive-icon](<https://devfeed.tech/tags/adaptive-icon.md>), [adaptive-icons](<https://devfeed.tech/tags/adaptive-icons.md>), [android](<https://devfeed.tech/tags/android.md>), [android-studio](<https://devfeed.tech/tags/android-studio.md>), [blogs](<https://devfeed.tech/tags/blogs.md>), [color](<https://devfeed.tech/tags/color.md>), [icons](<https://devfeed.tech/tags/icons.md>), [image](<https://devfeed.tech/tags/image.md>), [ui](<https://devfeed.tech/tags/ui.md>)

### AI overview

A tutorial on designing and implementing a Philips Hue adaptive icon for Android. It explains how adaptive icons prevent launcher-specific reshaping problems, uses layered vector and WebP assets to create a color-changing depth effect, and covers generating compatible icon resources in Android Studio.

### Source excerpt

Your icon is one of the most important assets in your app. With a bit of luck, users might even put it on their main launcher screen!

## Matlab toolstrip - part 5 (icons)

DevFeed: [Matlab toolstrip - part 5 (icons)](<https://devfeed.tech/articles/matlab-toolstrip-part-5-icons-22322.md>)

Original publisher: [Read original article](<https://undocumentedmatlab.com/articles/matlab-toolstrip-part-5-icons>)

Author: Yair Altman

Published: 2019-01-06T17:00:37Z

Content type: tutorial

Language: en

Sources: [Undocumented Matlab](<https://devfeed.tech/sources/undocumented-matlab.md>)

Topics: [MATLAB](<https://devfeed.tech/topics/matlab.md>), [GUI](<https://devfeed.tech/topics/gui.md>), [App](<https://devfeed.tech/topics/app.md>)

Tags: [app](<https://devfeed.tech/tags/app.md>), [customization](<https://devfeed.tech/tags/customization.md>), [gui](<https://devfeed.tech/tags/gui.md>), [gui-high-risk-of-breaking-in-future-versions-java-undocumented-feature](<https://devfeed.tech/tags/gui-high-risk-of-breaking-in-future-versions-java-undocumented-feature.md>), [high-risk-of-breaking-in-future-versions](<https://devfeed.tech/tags/high-risk-of-breaking-in-future-versions.md>), [icons](<https://devfeed.tech/tags/icons.md>), [java](<https://devfeed.tech/tags/java.md>), [toolstrip](<https://devfeed.tech/tags/toolstrip.md>), [undocumented-feature](<https://devfeed.tech/tags/undocumented-feature.md>)

### AI overview

This tutorial explains how to set icons for MATLAB toolstrip controls and app windows. It covers standard icons, local PNG or JPG files, images packaged in JAR files, and Java objects.

### Source excerpt

Icons can be specified in various ways for toolstrip controls and the app window itself. The post Matlab toolstrip - part 5 (icons) appeared first on Undocumented Matlab. Related posts: Matlab toolstrip - part 3 (basic customization) Matlab toolstrips can be created and customized in a variety of ways. ... Matlab toolstrip - part 9 (popup figures) Custom popup figures can be attached to Matlab GUI toolstrip controls. ... Matlab toolstrip - part 2 (ToolGroup App) Matlab users can create custom Apps with toolstrips and docked figures. ... Matlab toolstrip - part 8 (galleries) Matlab toolstrips can contain customizable gallery panels of items. ...

[Next page](<https://devfeed.tech/tags/icons.md?cursor=WyIyMDE5LTAxLTA2VDE3OjAwOjM3KzAwOjAwIiwgImIxMGU2MTAwLTgwYzEtNGYzNy05OTFjLTcyODYwOTUyMGNiYyJd>)