Arrow left and right: switch to the adjacent tool in the overview. Arrow up and down scroll the page.

Coreframework

Coreframework

Visual CSS framework tool for creating custom design systems

Visit Website
Hearts Heat (0–100)

AI Summary

Core Framework is a visual tool for creating and managing custom CSS frameworks with a graphical user interface. It offers a component editor, intelligent color management, fluid typography calculator, and automatically generates CSS variables and utility classes. Available as a standalone platform and WordPress plugin with integration for page builders like Bricks and Oxygen.

Pros

  • + Intuitive GUI for visually creating CSS frameworks without coding knowledge
  • + Modular approach allows complete customization and removal of unused components
  • + WordPress plugin with integrations for popular page builders like Bricks and Oxygen

Cons

  • Premium features for WordPress page builders cost €119 per integration
  • Successor to Oxyninja may require migration of existing projects

Use Cases

  • Creating a reusable design system for web projects
  • Visual management and organization of color palettes with automatic shade generation
  • Developing responsive UI components with the visual component editor
  • Integrating a custom CSS framework into WordPress with page builder support

Who is it for?

Ideal for web designers, frontend developers, and WordPress agencies who want to create consistent design systems and use them across teams.

Tags

Platform: web

What is Coreframework?

Coreframework is a visual tool for building custom CSS frameworks with a graphical user interface. Anyone who has previously managed CSS variables and utility classes by hand gets an editor that generates this output automatically. The tool runs as a standalone web platform and can alternatively be used as a WordPress plugin. It is the successor to Oxyninja and is aimed at teams that want to build a shared design system and reuse it across projects.

Core features

  • Component editor: Visual development and management of UI components without writing CSS directly.
  • Color management with shade generation: Color palettes are maintained centrally, with gradations generated automatically.
  • Fluid typography calculator: Font sizes scale fluidly across breakpoints, configured visually.
  • CSS variables and utility classes: Both are generated automatically based on the settings and can be included directly in a project.
  • WordPress integration: The plugin supports page builders such as Bricks and Oxygen. The extended integrations for these builders are paid add-ons, priced at 119 euros each.
  • Modular structure: Components that are not needed can be removed, keeping the framework lean.

Who is Coreframework for?

Web designers without deep CSS knowledge can use it to build a consistent design system that works beyond a single project. Frontend developers benefit mainly from the automated output: CSS variables and utilities come from a single source, eliminating inconsistencies caused by manual maintenance. WordPress agencies using Bricks or Oxygen get a direct integration. The additional cost of 119 euros per builder integration should be factored into budget planning early.

Existing projects based on Oxyninja cannot be carried over without effort. Anyone running active projects there should expect migration work before Coreframework can be used in production.

Context & alternatives

Coreframework sits in the category of design token and CSS framework generators. Tools such as Style Dictionary (token management with code output) and Tailwind CSS (with its own configuration system) follow comparable approaches, but both require more direct coding. Figma Tokens combined with a build process covers similar requirements, though it relies on a different stack and produces no visual CSS output.

The specific advantage of Coreframework is its native WordPress integration. Anyone who wants to manage their design system directly within a page builder context, without switching between multiple tools, has a more direct path here than with generic alternatives.

Related Tools

Related Blog Posts

Meooow! Want tool tips by email?

Yes, please!