{"id":395476,"date":"2026-06-03T08:45:02","date_gmt":"2026-06-03T14:45:02","guid":{"rendered":"https:\/\/css-tricks.com\/?p=395476"},"modified":"2026-06-03T08:45:05","modified_gmt":"2026-06-03T14:45:05","slug":"quick-hit-143","status":"publish","type":"post","link":"https:\/\/css-tricks.com\/quick-hit-143\/","title":{"rendered":"Quick Hit #143"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/developer.chrome.com\/release-notes\/149\" rel=\"noopener\">Chrome 149<\/a> ships <a href=\"https:\/\/css-tricks.com\/almanac\/properties\/i\/image-rendering\/#:~:text=crisp%2Dedges%3A%20the%20contrast%2C%20colors%20and%20edges%20of%20the%20image%20will%20be%20preserved%20without%20any%20smoothing%20or%20blurring.%20This%20is%20intended%20for%20icons%2C%20data%20visualizations%2C%20diagrams%2C%20maps%2C%20pixel%20art%2C%20and%20anything%20with%20lines.%20This%20value%20applies%20to%20images%20scaled%20up%20or%20down.\"><code>image-rendering: crisp-edges<\/code><\/a>, making it Baseline.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Chrome 149 ships image-rendering: crisp-edges, making it Baseline.<\/p>\n","protected":false},"author":288677,"featured_media":300990,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[19079],"tags":[1021,478,1405],"class_list":["post-395476","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-quick-hits","tag-chrome","tag-css","tag-image-rendering"],"acf":{"show_toc":"No"},"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1","jetpack-related-posts":[{"id":395474,"url":"https:\/\/css-tricks.com\/quick-hit-142\/","url_meta":{"origin":395476,"position":0},"title":"Quick Hit #142","author":"Daniel Schwarz","date":"June 2, 2026","format":false,"excerpt":"Chrome 149 upgrades shape-outside to support rect() and xywh() (now Baseline) as well as path() and shape() (no other web browsers support these ones).","rel":"","context":"In &quot;Quick Hits&quot;","block_context":{"text":"Quick Hits","link":"https:\/\/css-tricks.com\/category\/quick-hits\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":393406,"url":"https:\/\/css-tricks.com\/quick-hit-120\/","url_meta":{"origin":395476,"position":1},"title":"Quick Hit #120","author":"Daniel Schwarz","date":"April 8, 2026","format":false,"excerpt":"Chrome 147 ships contrast-color() (the Color Level 5 version that only resolves to black or white), making it baseline.","rel":"","context":"In &quot;Quick Hits&quot;","block_context":{"text":"Quick Hits","link":"https:\/\/css-tricks.com\/category\/quick-hits\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":392300,"url":"https:\/\/css-tricks.com\/quick-hit-98\/","url_meta":{"origin":395476,"position":2},"title":"Quick Hit #98","author":"Daniel Schwarz","date":"February 13, 2026","format":false,"excerpt":"Chrome 145 finally ships text-justify, which is almost baseline now.","rel":"","context":"In &quot;Quick Hits&quot;","block_context":{"text":"Quick Hits","link":"https:\/\/css-tricks.com\/category\/quick-hits\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":269520,"url":"https:\/\/css-tricks.com\/keep-pixelated-images-pixelated-as-they-scale\/","url_meta":{"origin":395476,"position":3},"title":"Keep Pixelated Images Pixelated as They Scale","author":"Chris Coyier","date":"April 7, 2018","format":false,"excerpt":"This is a little reminder that there is a CSS property for helping control what happens to images as they scale up: image-rendering. We're quite used to the idea that scaling an image larger than its natural size (upscaling) causes it to be blurry. As awful as that is, it's\u2026","rel":"","context":"In &quot;Articles&quot;","block_context":{"text":"Articles","link":"https:\/\/css-tricks.com\/category\/articles\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2018\/04\/pixelated.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2018\/04\/pixelated.png?fit=1200%2C600&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2018\/04\/pixelated.png?fit=1200%2C600&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2018\/04\/pixelated.png?fit=1200%2C600&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2018\/04\/pixelated.png?fit=1200%2C600&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":393608,"url":"https:\/\/css-tricks.com\/quick-hit-125\/","url_meta":{"origin":395476,"position":4},"title":"Quick Hit #125","author":"Daniel Schwarz","date":"April 22, 2026","format":false,"excerpt":"Firefox 150 ships revert-rule, which rolls the rule back to when it didn\u2019t have its current value. It\u2019ll be Baseline once Chrome 148 ships.","rel":"","context":"In &quot;Quick Hits&quot;","block_context":{"text":"Quick Hits","link":"https:\/\/css-tricks.com\/category\/quick-hits\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=1050%2C600 3x"},"classes":[]},{"id":393246,"url":"https:\/\/css-tricks.com\/quick-hit-115\/","url_meta":{"origin":395476,"position":5},"title":"Quick Hit #115","author":"Daniel Schwarz","date":"March 27, 2026","format":false,"excerpt":"Firefox 149, like Chrome 133, ships popover=hint, which closes all but auto popovers.","rel":"","context":"In &quot;Quick Hits&quot;","block_context":{"text":"Quick Hits","link":"https:\/\/css-tricks.com\/category\/quick-hits\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=350%2C200 1x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=525%2C300 1.5x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=700%2C400 2x, https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/css-tricks-logo-gradient-outline.png?fit=1200%2C600&ssl=1&resize=1050%2C600 3x"},"classes":[]}],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/395476","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/288677"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=395476"}],"version-history":[{"count":1,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/395476\/revisions"}],"predecessor-version":[{"id":395477,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/395476\/revisions\/395477"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media\/300990"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=395476"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/categories?post=395476"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=395476"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}