Menu

The Design Team provides design for the WordPress project.

Want to get involved? See the handbook and optionally drop into #design to chat. Most active design work happens in the block editor project, consider dropping into Needs design or Needs design feedback.

Figma Access

There’s a WordPress Component Library in Figma. Duplicate to edit, direct access is reserved for the design team. Figma accounts are free, but edit access is not.

You don’t need edit access to use the Figma libraries, you can copy components from there into your own drafts. If you’re a contributor with the ability to grant edit access, please be mindful, and downgrade to view access once the initial need for edit has waned.

sara cannon 12:30 am on June 6, 2011
Tags: Blue Admin, feedback

I’ve been working on some blue admin tweaks…

I’ve been working on some blue admin tweaks. I ported over the categoryCategory The 'category' taxonomy lets you group posts / content together that share a common bond. Categories are pre-defined and broad ranging. tab color attributes to the colors files, and have been working on changing it from the default grey over to blue.

Before: http://cl.ly/2u1F230R3J382I2R2d2R

After 1: http://www.cl.ly/163U2O1S1H3c1F1o2Z3Y
– I think I like it better without a background color – but we would need to reflect that on grey as well?

After 2: http://www.cl.ly/00323S403w3S3b11403f
– subtle blue background color

After3: http://www.cl.ly/0v0s2l1V471K2z2Z2Y1v
– too dark

Thoughts?

#blue-admin, #feedback

Elio 2:48 am on June 6, 2011

#2 looks sweet. How about a subtle blue-white gradient? http://cl.ly/1u3M1p281h27262m2a0l
Just to avoid the hard transition from the blue to the white.
dremeda 8:15 pm on June 8, 2011

Hi Sara, I think the clear tab background works best. I don’t think there’s a reason to highlight the tab alone being the tab border gives clear separation.

Good job.

Dre
- ggwicz 3:09 am on June 22, 2011
  
  I agree, I like the no-color.
dremeda 8:26 pm on June 8, 2011

My replies seem to be disappearing, weird.

I think it looks best without the tab background color. You already get clear separation with the border showing the active tab.

Looks good imo.
Joen 9:36 am on June 16, 2011

Looks great Sara.

As part of Automattic’s data team, I’m responsible for the metaboxMetabox A post metabox is a draggable box shown on the post editing screen. Its purpose is to allow the user to select or enter information in addition to the main post content. This information should be related to the post in some way. tabs we introduced for the “What’s Hot” widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user. on WordPress.comWordPress.com An online implementation of WordPress code that lets you immediately access a new WordPress environment to publish your content. WordPress.com is a private company owned by Automattic that hosts the largest multisite in the world. This is arguably the best place to start blogging if you have never touched WordPress before. https://wordpress.com/, as well as the tab-boxes on the stats page. If you have any input on the blue style I did for those, I’m the one you want to pingPing The act of sending a very small amount of data to an end point. Ping is used in computer science to illicit a response from a target server to test it’s connection. Ping is also a term used by Slack users to @ someone or send them a direct message (DM). Users might say something along the lines of “Ping me when the meeting starts.”. Here’s what they look like now.
Joen 9:41 am on June 16, 2011

Hi Sara,

As part of Automattic’s data team, I’m responsible for the tabbed metaboxes introduced for the stats page and “What’s Hot” widgetWidget A WordPress Widget is a small block that performs a specific function. You can add these widgets in sidebars also known as widget-ready areas on your web page. WordPress widgets were originally created to provide a simple and easy-to-use way of giving design and structure control of the WordPress theme to the user.. If you have some input on the blue style for those, I’m the one you’ll want to pingPing The act of sending a very small amount of data to an end point. Ping is used in computer science to illicit a response from a target server to test it’s connection. Ping is also a term used by Slack users to @ someone or send them a direct message (DM). Users might say something along the lines of “Ping me when the meeting starts.”. Here’s what they look like now.