DEV Community

Contè UI
Contè UI

Posted on

# Introducing Conté UI - A New Dynamic CSS System for Advanced Styling

#css #javascript #ui #ux

Contè UI - A Dynamic CSS System for Advanced Styling.

When CSS Frameworks Become Limiting — Meet Conté UI

Traditional frameworks often lock you into predefined scales. Conté UI breaks these limits with a breakthrough approach to building modern UIs with fully dynamic values and intuitive class conventions. Faster, lighter, and more flexible than traditional frameworks.

Released: May 1, 2026
Version: v0.1.0-beta
Open Source: https://github.com/Conte-UI/ConteUI

What if CSS wasn’t limited?

Most CSS frameworks rely on predefined scales —

fixed spacing, font sizes, and breakpoints.

That works… until you need something outside those limits.

Enter Conté UI

Conté UI removes those constraints.

Instead of memorizing predefined utilities, you write exactly what you need — using real CSS values directly inside class names.

<div class="p:23px text-size:18px bg:rgb(30,30,30)">
Enter fullscreen mode Exit fullscreen mode

• No scale restrictions.
• No configuration overhead.
• Just pure flexibility.

Core Features

  • Dynamic values — use any CSS values directly inside class names.

  • Advanced color system — supports solid colors, gradients, and image-based styling,

  • Color generation — with built-in Material Design palettes and automatic palette generation from a single seed color.

  • Pseudo support — apply pseudo-classes and pseudo-elements directly in classes

  • Layout system — built on Flexbox and Grid for modern UI structures

  • Theming system — define and customize themes with ease

  • Responsive engine — supports breakpoints, fluid scaling, and hybrid layouts

  • Typography system — flexible font handling with Google Fonts support

Works Alongside Other Frameworks

Conté UI is not designed to replace your existing tools — it’s designed to work with them.

Its class naming system is intentionally structured to minimize conflicts with other CSS frameworks, while giving you full freedom to use dynamic values when needed.

You can:

  • Use Conté UI alongside other frameworks
  • Extend existing systems without being limited by their scales
  • Add dynamic styling without rewriting your entire codebase

Instead of choosing one system over another, Conté UI acts as a flexible layer on top of your current stack.

Getting Started

You can start using Conté UI by including the compiled CSS file:

<link rel="stylesheet" href="dist/conte-ui-v0.1.0-beta.min.css">

---

Or clone the repository:

git clone https://github.com/Conte-UI/ConteUI.git
Enter fullscreen mode Exit fullscreen mode

Example 

<div class="d-flex gap:8px p:6px bg:conic-gradient(#f69d3c, #3f87a6) text-color:rgb(225,225,255)">
  <h1 class="text-size:0.7rem font-playfair">Hello Conté UI</h1>
  <p class="text-size:1rem">Dynamic values make styling effortless.</p>
</div>
Enter fullscreen mode Exit fullscreen mode

🧪 In Progress

Conté UI is just getting started.

New utilities are currently in development, expanding the system’s capabilities over time.

A powerful DevTool is also on the way — focused on testing, color generation, and exporting tailored CSS output.

Stay tuned.

License

Conté UI is licensed under the Apache License 2.0. See the LICENSE file for details.

This article assumes you are familiar with modern CSS and utility-based frameworks.

Top comments (0)