Try this:
Using query conditionals
Putting style enqueueing directly in the template is not advisable. It is possible (if you understand the order that relevant actions fire, and ensure that your call to wp_add_inline_style() happens at the right point in the execution order). It is far easier to keep all the code together, and use an appropriate query conditional, such as is_single(), to add the dynamic style:
function add_custom_css() {
wp_enqueue_style('custom-css', get_template_directory_uri() . '/custom.css');
// Add dynamic style if a single page is displayed
if ( is_single() ) {
$color = "#000111";
$custom_css = ".mycolor{ background: {$color}; }";
wp_add_inline_style( 'custom-css', $custom_css );
}
}
add_action( 'wp_enqueue_scripts', 'add_custom_css' );
Original Answer
functions.php
function add_custom_css() {
wp_enqueue_style('custom-css', get_template_directory_uri() . '/custom.css');
}
add_action( 'wp_enqueue_scripts', 'add_custom_css', 20 );
single.php
function wpse104657_custom_color() {
$color = "#000111";
$custom_css = "
.mycolor{
background: {$color};
}";
wp_add_inline_style( 'custom-css', $custom_css );
}
add_action( 'wp_enqueue_scripts', 'wpse104657_custom_color', 21 );
The 3rd parameter in the add_action() calls is the priority, which tells WordPress what order to add the action — higher numbers means later execution.
Edited to add This won’t add any code to custom.css — it’ll just add inline styles if custom.css has already been loaded.