hearing from Adam<\/a> just how configurable Tailwind is. In any case, I find this all endless fascinating and, if you love it, more power to ya. <\/p>\n","protected":false},"excerpt":{"rendered":"There is no doubt that “functional CSS” resonates strongly with some people. If that term is new to you, I belive it’s come to mean the same thing as “Atomic CSS” as defined by John Polacek here. Harry Nicholls likens it to a function that can only produce one result (although I’d call that a […]<\/p>\n","protected":false},"author":3,"featured_media":278503,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_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,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":"","jetpack_publicize_message":"Just how functional is _too_ functional with Functional CSS?","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":[]},"categories":[17],"tags":[804,1380],"jetpack_publicize_connections":[],"acf":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2018\/11\/functional-css.png?fit=1200%2C600&ssl=1","jetpack-related-posts":[{"id":253483,"url":"https:\/\/css-tricks.com\/lets-define-exactly-atomic-css\/","url_meta":{"origin":278477,"position":0},"title":"Let\u2019s Define Exactly What Atomic CSS is","date":"April 10, 2017","format":false,"excerpt":"As Atomic CSS (also known as Functional CSS) has been gaining in popularity, some confusion has occurred about similar related terms. The goal of this article is to clarify this terminology. There are other projects that use the term Atomic, including Atomic Web Design by Brad Frost. Atomic CSS is\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/01\/atomic-css-pieces.jpg?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":353318,"url":"https:\/\/css-tricks.com\/the-css-in-react-landscape\/","url_meta":{"origin":278477,"position":1},"title":"The CSS-in-React Landscape","date":"October 21, 2021","format":false,"excerpt":"I only half-jokingly refer to the CSS-in-JS world as CSS-in-React. Many of the libraries listed below theoretically work in non-React situations \u2014 they generally call that \"framework-agnostic\") \u2014 but I'd guess the vast majority of their usage is on React projects. That's because React, despite being a UI-focused library, has\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2018\/05\/css-in-js.jpg?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":362578,"url":"https:\/\/css-tricks.com\/thierry-koblentz-atomic-css\/","url_meta":{"origin":278477,"position":2},"title":"The Making of Atomic CSS: An Interview With Thierry Koblentz","date":"February 3, 2022","format":false,"excerpt":"I interviewed Thierry Koblentz, creator of Atomic CSS, to understand the history and background that led to making of the popular CSS framework. Thierry, now retired, has vast experience writing CSS at large scale and has previously worked as a front-end engineer at Yahoo!. Thierry is widely credited with bringing\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/01\/atomic-css-pieces.jpg?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":331314,"url":"https:\/\/css-tricks.com\/retrospective-on-fela\/","url_meta":{"origin":278477,"position":3},"title":"Retrospective on Fela","date":"December 21, 2020","format":false,"excerpt":"I really appreciate a real-world walkthrough of a technology. Not only in what that technology does, but why it was chosen and how it worked for a team. Anybody can read the docs, but what you know after years of real-world usage is far more valuable. Kitty Giraudel: I want\u2026","rel":"","context":"In "Link"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2020\/12\/Screen-Shot-2020-12-21-at-7.42.46-AM.png?fit=1200%2C608&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":262610,"url":"https:\/\/css-tricks.com\/growing-popularity-atomic-css\/","url_meta":{"origin":278477,"position":4},"title":"On the Growing Popularity of Atomic CSS","date":"November 24, 2017","format":false,"excerpt":"Even if you consider yourself a CSS expert, chances are that at some point on a large project you've had to deal with a convoluted, labyrinthine stylesheet that never stops growing. Some stylesheets can feel like a messy entangled web of inheritance. Spaghetti Monster The cascade is incredibly powerful. Small\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":313139,"url":"https:\/\/css-tricks.com\/responsive-styling-using-attribute-selectors\/","url_meta":{"origin":278477,"position":5},"title":"Responsive Styling Using Attribute Selectors","date":"June 30, 2020","format":false,"excerpt":"One of the challenges we face when implementing class-based atomic styling is that it often depends on a specific breakpoint for context. We can prefix each breakpoint. This works well until we start adding multiple classes. That\u2019s when it becomes difficult to keep a track what relates to what and\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2020\/06\/atomic-css-attributes-1.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]}],"_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/278477"}],"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\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=278477"}],"version-history":[{"count":3,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/278477\/revisions"}],"predecessor-version":[{"id":278502,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/278477\/revisions\/278502"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media\/278503"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=278477"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/categories?post=278477"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=278477"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}