<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>CSS &#8211; Fountn</title>
	<atom:link href="https://fountn.design/resource-tags/css/feed/" rel="self" type="application/rss+xml" />
	<link>https://fountn.design</link>
	<description>Curated design resources. No clutter. Just flow.</description>
	<lastBuildDate>Thu, 01 Jan 2026 08:08:43 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9</generator>

<image>
	<url>https://fountn.design/wp-content/uploads/2024/03/cropped-Default-150x150.png</url>
	<title>CSS &#8211; Fountn</title>
	<link>https://fountn.design</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>PatternCraft — Free CSS &#038; Tailwind Background Patterns</title>
		<link>https://fountn.design/resource/patterncraft-free-css-tailwind-background-patterns/</link>
		
		<dc:creator><![CDATA[Ozan Öztaskiran]]></dc:creator>
		<pubDate>Thu, 01 Jan 2026 08:07:35 +0000</pubDate>
				<guid isPermaLink="false">https://fountn.design/?post_type=resource&#038;p=17044</guid>

					<description><![CDATA[PatternCraft is a free, developer-friendly library for creating and using high-quality background patterns and gradients built with modern CSS and Tailwind. It focuses on practical reuse: every pattern comes with copy-ready code, live previews, and clear structure so designers and developers can integrate backgrounds into real projects in seconds. The library includes a growing collection [&#8230;]]]></description>
		
		
		
			</item>
		<item>
		<title>Classnames: Naming Inspiration for CSS, HTML &#038; JavaScript</title>
		<link>https://fountn.design/resource/classnames-naming-inspiration-for-css-html-javascript/</link>
		
		<dc:creator><![CDATA[Ozan Öztaskiran]]></dc:creator>
		<pubDate>Tue, 30 Dec 2025 16:53:16 +0000</pubDate>
				<guid isPermaLink="false">https://fountn.design/?post_type=resource&#038;p=17005</guid>

					<description><![CDATA[Classnames is a reference site that provides thematically grouped word lists to help designers and developers name things more clearly. It offers inspiration for naming CSS classes, HTML elements, JavaScript functions, and other system parts by organizing words around concepts like action, structure, comparison, and composition, with links to definitions for deeper context. The resource [&#8230;]]]></description>
		
		
		
			</item>
		<item>
		<title>grayscale design &#124; Luminance-based color palette generator for Tailwind CSS</title>
		<link>https://fountn.design/resource/grayscale-design-luminance-based-color-palette-generator-for-tailwind-css/</link>
		
		<dc:creator><![CDATA[Fountn Team]]></dc:creator>
		<pubDate>Mon, 23 Jun 2025 07:23:30 +0000</pubDate>
				<guid isPermaLink="false">https://fountn.design/?post_type=resource&#038;p=14110</guid>

					<description><![CDATA[Grayscale.design is a web-based color tool for generating and customizing luminance-based grayscale palettes. It allows designers to build structured gray scales—typically used in design systems, UI themes, or Tailwind-based projects—by adjusting luminance values across 12 steps, from lightest (50) to darkest (1100). The tool’s sliders offer precise control, and the results are visually represented in [&#8230;]]]></description>
		
		
		
			</item>
		<item>
		<title>poco. &#8211; minimal set of CSS variables and utilities</title>
		<link>https://fountn.design/resource/poco-minimal-set-of-css-variables-and-utilities/</link>
		
		<dc:creator><![CDATA[Ozan Öztaskiran]]></dc:creator>
		<pubDate>Fri, 06 Jun 2025 11:13:46 +0000</pubDate>
				<guid isPermaLink="false">https://fountn.design/?post_type=resource&#038;p=13800</guid>

					<description><![CDATA[Poco is a minimal CSS utility framework that provides a limited, opinionated set of design tokens for typography and spacing. The showcased site presents a clean, dark-themed documentation page focused on type scale, with predefined font sizes and line heights ranging from 12px/16px to 44px/48px. Poco doesn’t aim to replace full-fledged frameworks like Tailwind or [&#8230;]]]></description>
		
		
		
			</item>
		<item>
		<title>Style Reptile: Figma to CSS Extractor</title>
		<link>https://fountn.design/resource/style-reptile-figma-to-css-extractor/</link>
		
		<dc:creator><![CDATA[Ozan Öztaskiran]]></dc:creator>
		<pubDate>Sun, 11 May 2025 07:15:28 +0000</pubDate>
				<guid isPermaLink="false">https://fountn.design/?post_type=resource&#038;p=12683</guid>

					<description><![CDATA[A Figma plugin designed to help designers and developers bridge the handoff between design and front-end implementation. The core functionality of the plugin is to extract CSS-compatible style definitions from Figma files, including tokens for spacing, typography, and configuration. These extracted styles are output into multiple .css files like config.css, paddings.css, and typography.css. The plugin [&#8230;]]]></description>
		
		
		
			</item>
		<item>
		<title>DesignCourse</title>
		<link>https://fountn.design/resource/designcourse-2/</link>
		
		<dc:creator><![CDATA[Ozan Öztaskiran]]></dc:creator>
		<pubDate>Thu, 24 Apr 2025 08:57:03 +0000</pubDate>
				<guid isPermaLink="false">https://fountn.design/?post_type=resource&#038;p=10977</guid>

					<description><![CDATA[An interactive online learning platform created by Gary Simon, a seasoned UI/UX designer and frontend developer with over 20 years of experience. The platform offers comprehensive courses in UI/UX design, CSS, and advanced frontend development, all structured to provide hands-on experience through video instruction, interactive tests, and real-world projects. A standout feature is the integration [&#8230;]]]></description>
		
		
		
			</item>
		<item>
		<title>Flexbox Labs</title>
		<link>https://fountn.design/resource/flexbox-labs/</link>
		
		<dc:creator><![CDATA[Ozan Öztaskiran]]></dc:creator>
		<pubDate>Wed, 23 Apr 2025 08:03:11 +0000</pubDate>
				<guid isPermaLink="false">https://fountn.design/?post_type=resource&#038;p=10866</guid>

					<description><![CDATA[Flexbox Labs provides a visual playground for creating and customizing layouts using CSS Flexbox. Users can manipulate various flex container properties such as flex-direction, flex-wrap, justify-content, align-items, align-content, and gap. Additionally, individual flex items can be added, duplicated, or removed, allowing for comprehensive experimentation with layout structures. ￼ ￼ The tool offers real-time previews, enabling [&#8230;]]]></description>
		
		
		
			</item>
		<item>
		<title>Anima &#8211; Figma to Code React, HTML, CSS, Tailwind, MUI</title>
		<link>https://fountn.design/resource/anima-figma-to-code-react-html-css-tailwind-mui-devmode-inspect-react-html-vue-css/</link>
		
		<dc:creator><![CDATA[Ozan Öztaskiran]]></dc:creator>
		<pubDate>Sat, 22 Mar 2025 07:08:28 +0000</pubDate>
				<guid isPermaLink="false">https://fountn.design/?post_type=resource&#038;p=9172</guid>

					<description><![CDATA[Anima is a Figma plugin that converts designs into front-end code, supporting frameworks like HTML, React, and Vue with styling options such as CSS, Tailwind CSS, and Styled Components. It helps designers and developers streamline the transition from design to development by automatically generating reusable code components and minimizing redundant code. The tool also offers [&#8230;]]]></description>
		
		
		
			</item>
		<item>
		<title>Overflow Clip &#8211; Learn how overflow: clip works in CSS</title>
		<link>https://fountn.design/resource/overflow-clip-learn-how-overflow-clip-works-in-css/</link>
		
		<dc:creator><![CDATA[Ozan Öztaskiran]]></dc:creator>
		<pubDate>Sat, 04 Jan 2025 11:48:22 +0000</pubDate>
				<guid isPermaLink="false">https://backup.fountn.design/?post_type=resource&#038;p=7156</guid>

					<description><![CDATA[Ahmad Shadeed’s article on the CSS overflow: clip property provides an insightful guide to its use and benefits. This property, a recent addition to the CSS specification, allows developers to clip overflowing content without adding a scrollbar or creating a scrolling interface. Shadeed explains its syntax and offers real-world examples of its application, demonstrating how [&#8230;]]]></description>
		
		
		
			</item>
		<item>
		<title>Spektra &#8211; Gradient Generator</title>
		<link>https://fountn.design/resource/spektra-gradient-generator/</link>
		
		<dc:creator><![CDATA[Ozan Öztaskiran]]></dc:creator>
		<pubDate>Wed, 01 Jan 2025 12:28:38 +0000</pubDate>
				<guid isPermaLink="false">https://backup.fountn.design/?post_type=resource&#038;p=6983</guid>

					<description><![CDATA[Spektra is a sleek, user-friendly gradient generator designed for designers and developers who want to create visually stunning color gradients with ease. Built using React and TypeScript, the tool supports linear, radial, and conic gradients, giving users advanced control over elements like angle adjustments, center positioning, and unlimited color stops. Real-time previews and one-click CSS [&#8230;]]]></description>
		
		
		
			</item>
	</channel>
</rss>
